Skip to content

Commit 18dd404

Browse files
agirlnamedsophiaagirlnamedsophia
authored
Final design Adjustments (#42)
* final layout updates per design qa
1 parent 7ff4410 commit 18dd404

18 files changed

Lines changed: 136 additions & 145 deletions

File tree

‎app/assets/stylesheets/components/_inputs.scss‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,3 +20,7 @@
2020
padding: 0.04em 0 0 0.04em;
2121
}
2222
}
23+
24+
.input-text input, .input-number input, .input-email input, .input-password input, .input-money input, .input-cents input, .input-percent input, .input-search input, .input-datepicker input, .input-file input, .input-text textarea, .input-number textarea, .input-email textarea, .input-password textarea, .input-money textarea, .input-cents textarea, .input-percent textarea, .input-search textarea, .input-datepicker textarea, .input-file textarea {
25+
font-weight: $font-medium;
26+
}

‎app/assets/stylesheets/typography/_base.scss‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,16 @@
11
body {
22
@include sc-responsive-typography;
3-
background: $near-white;
43
font-family: $primary-font-stack;
54
min-width: $app-min-width;
65
}
6+
7+
.Body {
8+
&--nearWhite {
9+
background: $near-white;
10+
}
11+
&--white {
12+
background: $white;
13+
}
14+
}
15+
16+
$font-medium: 400;

‎app/assets/stylesheets/typography/_utilities.scss‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,5 +15,9 @@
1515
.u-white-link {
1616
font-size: 1.4rem;
1717
text-transform: uppercase;
18+
font-weight: $font-heavy;
1819
color: $white;
20+
&:hover {
21+
color: $light-blue;
22+
}
1923
}

‎app/helpers/application_layout_helper.rb‎

Lines changed: 7 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -9,23 +9,6 @@ def site_layout_header_classes
99
classes.join ' '
1010
end
1111

12-
def site_layout_section_classes
13-
classes = ['sc-SiteLayout-section']
14-
classes << "sc-SiteLayout-section--#{site_layout_body_color}" unless site_layout_body_color == 'white'
15-
classes.join ' '
16-
end
17-
18-
def site_layout_container_classes
19-
classes = ['sc-SiteLayout-container']
20-
classes.join ' '
21-
end
22-
23-
def content_layout_classes
24-
classes = ['sc-ContentLayout sc-ContentLayout--constrained']
25-
classes << 'sc-ContentLayout--centered' if site_layout_content_layout == 'centered'
26-
classes.join ' '
27-
end
28-
2912
def site_layout_content_layout
3013
content_for(:site_content_layout) || 'base'
3114
end
@@ -38,12 +21,16 @@ def default_header_modifier
3821
'blue'
3922
end
4023

41-
def site_layout_body_color
42-
content_for(:site_layout_body_color) || 'white'
24+
def body_layout_body_color
25+
content_for(:body_layout_body_color) || 'nearWhite'
26+
end
27+
28+
def body_layout_body_color_class
29+
"Body--#{body_layout_body_color}"
4330
end
4431

4532
def site_layout_body_css_classes
46-
[controller_action_css_class, controller_css_class].join(' ')
33+
[controller_action_css_class, controller_css_class, body_layout_body_color_class].join(' ')
4734
end
4835

4936
def controller_css_class

‎app/views/admin/bulk_assignments/new.html.erb‎

Lines changed: 28 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,37 @@
1+
<% content_for :body_layout_body_color, 'white' %>
2+
<% content_for :page_title, "Split Details: #{@split.name}" %>
3+
14
<div class="TakeoverText">
25
<h1 class="TakeoverText-title sc-m-v--l">Reassign Visitors to <%= @split.name %></h1>
36
</div>
47

5-
<div class="InfoCard">
6-
<%= simple_form_for(@bulk_assignment_creation, url: admin_split_bulk_assignments_path) do |f| %>
7-
<%= f.input :identifiers_listing, as: :text, label: 'IDs To Assign', :input_html => {:rows => 10} %>
8+
<%= simple_form_for(@bulk_assignment_creation, url: admin_split_bulk_assignments_path) do |f| %>
9+
<%= f.input :identifiers_listing, as: :text, label: 'IDs To Assign', :input_html => {:rows => 10} %>
810

9-
<% if @bulk_assignment_creation.new_identifier_creation_ratio_above_warning_threshold? %>
10-
<div id="identifier_creation_warning">
11-
<p>
12-
<%= percentage @bulk_assignment_creation.new_identifier_creation_ratio %>
13-
(<%= @bulk_assignment_creation.new_identifier_count %> of <%= @bulk_assignment_creation.total_identifiers_to_assign_count %>)
14-
of the identifiers provided will be <em>created</em> as part of this operation.
15-
<br>
16-
That's unusual. Please verify that you selected the correct <strong>Identified By</strong> below
17-
and double-check that the IDs listed above are correct.
18-
Do you still wish to proceed?
19-
</p>
11+
<% if @bulk_assignment_creation.new_identifier_creation_ratio_above_warning_threshold? %>
12+
<div id="identifier_creation_warning">
13+
<p>
14+
<%= percentage @bulk_assignment_creation.new_identifier_creation_ratio %>
15+
(<%= @bulk_assignment_creation.new_identifier_count %> of <%= @bulk_assignment_creation.total_identifiers_to_assign_count %>)
16+
of the identifiers provided will be <em>created</em> as part of this operation.
2017
<br>
21-
</div>
22-
<div class="sc-m-l--s">
23-
<%= f.input :force_identifier_creation, as: :boolean, label: 'YES', wrapper_html: { class: "has-error" } %>
24-
</div>
25-
<% end %>
26-
<div class="IdentifierTypeSelection sc-m-v--s">
27-
<%= f.input :identifier_type_id, label: 'Identified By', collection: identifier_types, label_method: :name, value_method: :id, include_blank: true %>
18+
That's unusual. Please verify that you selected the correct <strong>Identified By</strong> below
19+
and double-check that the IDs listed above are correct.
20+
Do you still wish to proceed?
21+
</p>
22+
<br>
2823
</div>
29-
<div class="fs-VariantOptions">
30-
<%= f.input :variant, label: "To Variant", include_blank: false, collection: @split.variants, as: :radio_buttons %>
24+
<div class="sc-m-l--s">
25+
<%= f.input :force_identifier_creation, as: :boolean, label: 'YES', wrapper_html: { class: "has-error" } %>
3126
</div>
32-
<%= f.input :reason, placeholder: "e.g. Turn FeatureX on" %>
33-
34-
<%= render "shared/form_footer", f: f, submit_text: "Assign To Split", submit_disable_with_text: "Assigning..." %>
3527
<% end %>
36-
</div>
28+
<div class="IdentifierTypeSelection sc-m-v--s">
29+
<%= f.input :identifier_type_id, label: 'Identified By', collection: identifier_types, label_method: :name, value_method: :id, include_blank: true %>
30+
</div>
31+
<div class="fs-VariantOptions">
32+
<%= f.input :variant, label: "To Variant", include_blank: false, collection: @split.variants, as: :radio_buttons %>
33+
</div>
34+
<%= f.input :reason, placeholder: "e.g. Turn FeatureX on" %>
35+
36+
<%= render "shared/form_footer", f: f, submit_text: "Assign To Split", submit_disable_with_text: "Assigning..." %>
37+
<% end %>

‎app/views/admin/decisions/new.html.erb‎

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,23 @@
1+
<% content_for :body_layout_body_color, 'white' %>
2+
<% content_for :page_title, "Split Details: #{@split.name}" %>
3+
14
<div class="TakeoverText">
25
<h1 class="TakeoverText-title sc-m-v--l">Decide '<%= @split.name %>'</h1>
36
</div>
47

5-
<div class="InfoCard">
6-
<%= simple_form_for(@decision, url: admin_split_decisions_path) do |f| %>
7-
<p class="title">Deciding this split in favor of a variant will have two immediate consequences:</p>
8-
<ol class="ExplanationList sc-m-l--s sc-p-l--xs">
9-
<li>This split will be re-weighted so that all <span class="u-emphasis">future</span> assignments will be to the variant specified.</li>
10-
<li>All visitors currently assigned to any other variant in this split will be <span class="u-emphasis">re-assigned</span> to the variant specified.</li>
11-
</ol>
8+
<%= simple_form_for(@decision, url: admin_split_decisions_path) do |f| %>
9+
<p class="title">Deciding this split in favor of a variant will have two immediate consequences:</p>
10+
<ol class="ExplanationList sc-m-l--s sc-p-l--xs">
11+
<li>This split will be re-weighted so that all <span class="u-emphasis">future</span> assignments will be to the variant specified.</li>
12+
<li>All visitors currently assigned to any other variant in this split will be <span class="u-emphasis">re-assigned</span> to the variant specified.</li>
13+
</ol>
1214

13-
<div class="InfoCard-row sc-m-t--m">
14-
<strong>Current Population: <%= @split.assignments.count %></strong>
15-
</div>
16-
<div class="fs-VariantOptions">
17-
<%= f.input :variant, label: 'Target Variant', collection: @split.variants, as: :radio_buttons, include_blank: false %>
18-
</div>
15+
<div class="sc-m-t--m">
16+
<strong>Current Population: <%= @split.assignments.count %></strong>
17+
</div>
18+
<div class="fs-VariantOptions">
19+
<%= f.input :variant, label: 'Target Variant', collection: @split.variants, as: :radio_buttons, include_blank: false %>
20+
</div>
1921

20-
<%= render "shared/form_footer", f: f, submit_text: "Decide Split", submit_disable_with_text: "Saving your Split Decision...", confirm_text: "\nYou are deciding '#{@split.name}'.\nDo you wish to proceed?" %>
21-
<% end %>
22-
</div>
22+
<%= render "shared/form_footer", f: f, submit_text: "Decide Split", submit_disable_with_text: "Saving your Split Decision...", confirm_text: "\nYou are deciding '#{@split.name}'.\nDo you wish to proceed?" %>
23+
<% end %>

‎app/views/admin/split_configs/new.html.erb‎

Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,23 @@
1+
<% content_for :body_layout_body_color, 'white' %>
2+
<% content_for :page_title, "Split Details: #{@split_creation.name}" %>
3+
14
<div class="TakeoverText">
25
<h1 class="TakeoverText-title sc-m-v--l">Split: <%= @split_creation.name %></h1>
36
</div>
47

5-
<div class="InfoCard">
6-
<%= simple_form_for(@split_creation, url: admin_split_split_config_path) do |f| %>
7-
<% f.simple_fields_for :weighting_registry do |ff| %>
8-
9-
<% if @split_creation.errors.include? :weighting_registry %>
10-
<div class="sc-flash sc-m-b--s error">
11-
<%= @split_creation.errors.full_messages_for(:weighting_registry).join(', ') %>
12-
</div>
13-
<% end %>
8+
<%= simple_form_for(@split_creation, url: admin_split_split_config_path) do |f| %>
9+
<% f.simple_fields_for :weighting_registry do |ff| %>
1410

15-
<% @split_creation.weighting_registry.each do |variant, weight| %>
16-
<%= ff.input variant, as: :percent, input_html: { value: weight, class: "weight-input" } %>
17-
<% end %>
11+
<% if @split_creation.errors.include? :weighting_registry %>
12+
<div class="sc-flash sc-m-b--s error">
13+
<%= @split_creation.errors.full_messages_for(:weighting_registry).join(', ') %>
14+
</div>
15+
<% end %>
1816

19-
<%= render "shared/form_footer", f: f, submit_text: "Edit", submit_disable_with_text: "Changing..." %>
17+
<% @split_creation.weighting_registry.each do |variant, weight| %>
18+
<%= ff.input variant, as: :percent, input_html: { value: weight, class: "weight-input" } %>
2019
<% end %>
20+
21+
<%= render "shared/form_footer", f: f, submit_text: "Edit", submit_disable_with_text: "Changing..." %>
2122
<% end %>
22-
</div>
23+
<% end %>

‎app/views/admin/split_details/edit.html.erb‎

Lines changed: 12 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,21 @@
1-
<% content_for :page_title, @split_detail.split.name %>
1+
<% content_for :body_layout_body_color, 'white' %>
2+
<% content_for :page_title, "Split Details: #{@split_detail.split.name}" %>
23

34
<div class="TakeoverText">
45
<h1 class="TakeoverText-title">Context and outcomes</h1>
56
</div>
67

7-
<div class="InfoCard">
8-
<%= simple_form_for @split_detail, url: admin_split_details_path, method: :put do |f| %>
9-
<%= f.error :base %>
10-
<%= f.input :owner, label: "Squad Name" %>
11-
<%= f.input :platform, collection: Split.platforms.keys %>
12-
<%= f.input :location, label: "Location", hint: "Example: Sign Up" %>
8+
<%= simple_form_for @split_detail, url: admin_split_details_path, method: :put do |f| %>
9+
<%= f.error :base %>
10+
<%= f.input :owner, label: "Owner" %>
11+
<%= f.input :platform, collection: Split.platforms.keys %>
12+
<%= f.input :location, label: "Location", hint: "Example: Sign Up" %>
1313

14-
<%= f.input :description, as: :text, hint: "Example: Users often get confused during the account creation process when reaching step 2, 'Personal Details'. We are testing two different versions of this page that aim to clear up that confusion." %>
14+
<%= f.input :description, as: :text, hint: "Example: Users often get confused during the account creation process when reaching step 2, 'Personal Details'. We are testing two different versions of this page that aim to clear up that confusion." %>
1515

16-
<%= f.input :hypothesis, as: :text, hint: "Example: By rearranging some of the fields and adding helper text we can improve sign up completion rates and decrease the amount of support tickets we receive." %>
16+
<%= f.input :hypothesis, as: :text, hint: "Example: By rearranging some of the fields and adding helper text we can improve sign up completion rates and decrease the amount of support tickets we receive." %>
1717

18-
<%= f.input :assignment_criteria, as: :text, hint: "Example: Assigned when any user enters the first step of the signup flow. Mobile users are not affected." %>
18+
<%= f.input :assignment_criteria, as: :text, hint: "Example: Assigned when any user enters the first step of the signup flow. Mobile users are not affected." %>
1919

20-
<footer class="sc-TakeoverFooter">
21-
<div class="sc-TakeoverFooter-content">
22-
<%= link_to "Back", admin_split_path(id: @split_detail.split.id), class: 'sc-TakeoverFooter-ctaBack sc-Link sc-Link--arrowLeft ft-backButton' %>
23-
<%= f.submit "Update Details", data: { disable_with: "Updating Split..." }, class: 'u-button ft-confirmButton' %>
24-
</div>
25-
</footer>
26-
<% end %>
27-
</div>
20+
<%= render "shared/form_footer", f: f, back_path: admin_split_path(@split_detail.split.id), submit_text: "Update Details", submit_disable_with_text: "Updating Split...", submit_disable_with_text: "Assigning..." %>
21+
<% end %>

‎app/views/admin/splits/_split.html.erb‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@
33
<%= split.name %>
44
</td>
55
<td>
6-
<%= render partial: 'split_registry', locals: { registry: split.registry } %>
6+
<%= split.owner_app.name.capitalize %>
77
</td>
88
<td>
9-
<%= split.owner_app.name %>
9+
<%= split.created_at.to_s(:slashed_full_date) %>
1010
</td>
1111
<td>
1212
<%= link_to "View", admin_split_path(split) %>

‎app/views/admin/splits/_variants.html.erb‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
</div>
66
<hr class="InfoCard-divider">
77
<div class="InfoCard-description">
8-
<table class="variants-table BasicTable">
8+
<table class="fs-VariantsTable BasicTable">
99
<thead>
1010
<th>Name</th>
1111
<th>Weight</th>

0 commit comments

Comments
 (0)