Fix flagged settings accessibility problems (#2744) [ci skip]
This commit is contained in:
parent
e96f666dc4
commit
f492e8ff70
7 changed files with 35 additions and 32 deletions
|
|
@ -215,7 +215,7 @@
|
|||
max-width: 100%;
|
||||
padding: 14px 0px;
|
||||
margin-top: 20px;
|
||||
font-size: 1.8em;
|
||||
font-size: 1.5em;
|
||||
cursor: pointer;
|
||||
&.danger-button {
|
||||
background: $red;
|
||||
|
|
@ -247,7 +247,7 @@
|
|||
}
|
||||
cursor: pointer;
|
||||
&.danger-button {
|
||||
background-color: $red;
|
||||
background-color: #b30000;
|
||||
color: $off-white;
|
||||
}
|
||||
&:disabled {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<% unless @user.identities.exists?(provider: 'github') %>
|
||||
<div class="field">
|
||||
<a href="/users/auth/github" class="big-button cta" data-no-instant>
|
||||
<img src="<%= asset_path("github-logo.svg") %>" /> CONNECT GITHUB ACCOUNT
|
||||
<img src="<%= asset_path("github-logo.svg") %>" alt="github logo" /> CONNECT GITHUB ACCOUNT
|
||||
</a>
|
||||
</div>
|
||||
<hr />
|
||||
|
|
@ -10,7 +10,7 @@
|
|||
<% unless @user.identities.exists?(provider: 'twitter') %>
|
||||
<div class="field">
|
||||
<a href="/users/auth/twitter?callback_url=<%= ApplicationConfig["APP_PROTOCOL"] %><%= ApplicationConfig["APP_DOMAIN"] %>/users/auth/twitter/callback" class="big-button cta" data-no-instant>
|
||||
<img src="<%= asset_path("twitter-logo.svg") %>" /> CONNECT TWITTER ACCOUNT
|
||||
<img src="<%= asset_path("twitter-logo.svg") %> " alt="twitter logo" /> CONNECT TWITTER ACCOUNT
|
||||
</a>
|
||||
</div>
|
||||
<hr />
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<h2>Languages</h2>
|
||||
<h3>Select which languages you'd prefer to see in your feed <span style="color:#e05252">(beta)</span></h3>
|
||||
<h3>Select which languages you'd prefer to see in your feed <span style="color:#8c3434">(beta)</span></h3>
|
||||
<h4 style="font-weight:400">
|
||||
This setting controls which languages you are more likely to see throughout the site, but you may still see other languages, especially English.
|
||||
</h4>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<% end %>
|
||||
|
||||
<h2>Features</h2>
|
||||
<%= form_for(@user) do |f| %>
|
||||
<%= form_for(@user, html: { id: nil }) do |f| %>
|
||||
<div class="sub-field">
|
||||
<%= f.label :editor_version, "Editor version: v1 or v2" %>
|
||||
<%= f.select :editor_version, options_for_select(%w[v1 v2], @user.editor_version) %>
|
||||
|
|
@ -18,12 +18,13 @@
|
|||
</div>
|
||||
<div class="field">
|
||||
<label></label>
|
||||
<%= f.hidden_field :tab, value: @tab %>
|
||||
<%= f.hidden_field :tab, value: @tab, id: nil %>
|
||||
<%= f.submit "SUBMIT", class: "cta" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<h2>Feed Customization</h2>
|
||||
<%= form_for(@user) do |f| %>
|
||||
<%= form_for(@user, html: { id: nil }) do |f| %>
|
||||
<div class="sub-field">
|
||||
<%= f.label :experience_level, "Enter your coding experience level (1-10)" %>
|
||||
<%= f.text_field :experience_level %>
|
||||
|
|
@ -31,12 +32,13 @@
|
|||
</div>
|
||||
<div class="field">
|
||||
<label></label>
|
||||
<%= f.hidden_field :tab, value: @tab %>
|
||||
<%= f.hidden_field :tab, value: @tab, id: nil %>
|
||||
<%= f.submit "SUBMIT", class: "cta" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<h2>Style Customization</h2>
|
||||
<%= form_for(@user) do |f| %>
|
||||
<%= form_for(@user, html: { id: nil }) do |f| %>
|
||||
<div class="sub-field">
|
||||
<%= f.label :config_theme, "Site Theme" %>
|
||||
<%= f.select(:config_theme, options_for_select(["default", "night theme", "pink theme"], @user.config_theme.tr("_", " "))) %>
|
||||
|
|
@ -49,7 +51,7 @@
|
|||
</div>
|
||||
<div class="field">
|
||||
<label></label>
|
||||
<%= f.hidden_field :tab, value: @tab %>
|
||||
<%= f.hidden_field :tab, value: @tab, id: nil %>
|
||||
<%= f.submit "SUBMIT", class: "cta" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
@ -60,8 +62,7 @@
|
|||
<h4 style="font-weight:400">
|
||||
You have the option to remove sponsor messaging (where it is practical to do so). Our wonderful sponsors help sustain the platform and improve your experience, and we strive to make their presence constructive to the community, but feel free to use this setting if you wish.
|
||||
</h4>
|
||||
|
||||
<%= form_for(@user) do |f| %>
|
||||
<%= form_for(@user, html: { id: nil }) do |f| %>
|
||||
<div class="checkbox-field">
|
||||
<div class="sub-field">
|
||||
<%= f.check_box :display_sponsors %>
|
||||
|
|
@ -74,13 +75,12 @@
|
|||
</div>
|
||||
<div class="field">
|
||||
<label></label>
|
||||
<%= f.hidden_field :tab, value: @tab %>
|
||||
<%= f.hidden_field :tab, value: @tab, id: nil %>
|
||||
<%= f.submit "SUBMIT", class: "cta" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<h2>Export content</h2>
|
||||
|
||||
<% if @user.export_requested? %>
|
||||
<h4 style="font-weight:400">
|
||||
You have recently requested an export of your content.
|
||||
|
|
@ -93,7 +93,7 @@
|
|||
They will be emailed to your inbox.
|
||||
</h4>
|
||||
|
||||
<%= form_for(@user) do |f| %>
|
||||
<%= form_for(@user, html: { id: nil }) do |f| %>
|
||||
<div class="checkbox-field">
|
||||
<div class="sub-field">
|
||||
<%= f.check_box :export_requested %>
|
||||
|
|
@ -102,17 +102,15 @@
|
|||
</div>
|
||||
<div class="field">
|
||||
<label></label>
|
||||
<%= f.hidden_field :tab, value: @tab %>
|
||||
<%= f.hidden_field :tab, value: @tab, id: nil %>
|
||||
<%= f.submit "SUBMIT", class: "cta" %>
|
||||
</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
||||
<h2> Connect </h2>
|
||||
|
||||
<h3> Inbox Type </h3>
|
||||
|
||||
<%= form_for(@user) do |f| %>
|
||||
<%= form_for(@user, html: { id: nil }) do |f| %>
|
||||
<div class="field checkbox-label-first">
|
||||
<%= f.label :inbox_type, "Open your inbox to messages from people you don't follow or keep your inbox private to mutual follows." %>
|
||||
<div class="sub-field">
|
||||
|
|
|
|||
|
|
@ -54,7 +54,7 @@
|
|||
<li>Paste the secret code below and click <b>Join Organization</b></li>
|
||||
</ol>
|
||||
<h5>Your secret: (You should rotate this regularly)</h5>
|
||||
<input type="text" class="settings-org-secret" id="settings-org-secret" value="<%= @organization.secret %>" readonly>
|
||||
<input type="text" class="settings-org-secret" id="settings-org-secret" value="<%= @organization.secret %>" readonly aria-label="Organization secret (to be rotated regularly)">
|
||||
<%= form_tag "/organizations/generate_new_secret", onsubmit: "return confirm('Are you sure you want to generate a new secret? All outstanding secrets will be invalid.');" do %>
|
||||
<button class="settings-generate-new-secret">Generate New Secret</button>
|
||||
<% end %>
|
||||
|
|
@ -66,7 +66,7 @@
|
|||
<%= f.text_field :name, maxlength: 50 %>
|
||||
</div>
|
||||
<div class="field">
|
||||
<%= f.label :username %>
|
||||
<%= f.label :slug, "Username" %>
|
||||
<%= f.text_field :slug, maxlength: 18, minlength: 2 %>
|
||||
<i>Your organization's URL is: https://dev.to/<%= @organization.slug %></i>
|
||||
</div>
|
||||
|
|
@ -135,7 +135,7 @@
|
|||
<a href="https://<%= ApplicationConfig["APP_DOMAIN"] %>/devteam/the-dev-badge-is-available-on-font-awesome-2ihe" target="_blank">DEV Team</a>.
|
||||
</h4>
|
||||
<div class="field">
|
||||
<%= f.label "Body text (Limited markdown — bold/italic/etc)" %>
|
||||
<%= f.label :cta_body_markdown, "Body text (Limited markdown — bold/italic/etc)" %>
|
||||
<%= f.text_area :cta_body_markdown, maxlength: 256, placeholder: "**This is an example**
|
||||
|
||||
_italic_ and **bold** is okay. Links, and headers etc. will not show up.
|
||||
|
|
@ -143,11 +143,11 @@ _italic_ and **bold** is okay. Links, and headers etc. will not show up.
|
|||
256 character limit." %>
|
||||
</div>
|
||||
<div class="field">
|
||||
<%= f.label "Link Text" %>
|
||||
<%= f.label :cta_button_text, "Link Text" %>
|
||||
<%= f.text_field :cta_button_text, maxlength: 20, placeholder: "Limit of 20 characters" %>
|
||||
</div>
|
||||
<div class="field">
|
||||
<%= f.label "Link url" %>
|
||||
<%= f.label :cta_button_url, "Link url" %>
|
||||
<%= f.text_field :cta_button_url, placeholder: "https://example.com" %>
|
||||
</div>
|
||||
<div class="field">
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
|
||||
<%= form_for @organization do |f| %>
|
||||
<div class="field">
|
||||
<%= f.label "Name *" %>
|
||||
<%= f.label :name, "Name *" %>
|
||||
<%= f.text_field :name %>
|
||||
</div>
|
||||
<div class="field">
|
||||
|
|
@ -29,7 +29,7 @@
|
|||
<sub><em>Your organization URL will be dev.to/{username}</em></sub>
|
||||
</div>
|
||||
<div class="field">
|
||||
<%= f.label "Profile Image *" %>
|
||||
<%= f.label :profile_image, "Profile Image *" %>
|
||||
<%= f.file_field :profile_image %>
|
||||
</div>
|
||||
<div class="field">
|
||||
|
|
@ -54,11 +54,11 @@
|
|||
</div>
|
||||
|
||||
<div class="field">
|
||||
<%= f.label "Summary *" %>
|
||||
<%= f.label :summary, "Summary *" %>
|
||||
<%= f.text_area :summary %>
|
||||
</div>
|
||||
<div class="field">
|
||||
<%= f.label "Proof *" %>
|
||||
<%= f.label :proof, "Proof *" %>
|
||||
<%= f.text_area :proof, placeholder: "This is just a quick blurb indicating or link that shows that you clearly are associated with this organization." %>
|
||||
<div style="width:560px;max-width:90%;">
|
||||
You must have your organization's permission to submit this form. Dishonesty may result in a permanent ban.
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<% unless @user.identities.exists?(provider: 'github') %>
|
||||
<div class="field">
|
||||
<a href="/users/auth/github" class="big-button cta" data-no-instant>
|
||||
<img src="<%= asset_path("github-logo.svg") %>" /> CONNECT GITHUB ACCOUNT
|
||||
<img src="<%= asset_path("github-logo.svg") %>" alt="github logo" /> CONNECT GITHUB ACCOUNT
|
||||
</a>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
@ -12,12 +12,17 @@
|
|||
<% unless @user.identities.exists?(provider: 'twitter') %>
|
||||
<div class="field">
|
||||
<a href="/users/auth/twitter?callback_url=<%= ApplicationConfig["APP_PROTOCOL"] %><%= ApplicationConfig["APP_DOMAIN"] %>/users/auth/twitter/callback" class="big-button cta" data-no-instant>
|
||||
<img src="<%= asset_path("twitter-logo.svg") %>" /> CONNECT TWITTER ACCOUNT
|
||||
<img src="<%= asset_path("twitter-logo.svg") %>" alt="twitter logo" /> CONNECT TWITTER ACCOUNT
|
||||
</a>
|
||||
</div>
|
||||
<% end %>
|
||||
<h4>
|
||||
<a href="https://<%= ApplicationConfig["APP_DOMAIN"] %>/<%= current_user.username %>"><img src="https://d2fltix0v2e0sb.cloudfront.net/dev-badge.svg" height="28" width="28" style="vertical-align:-7px;margin-right:4px;" class="dev-badge" /></a>
|
||||
<a href="https://<%= ApplicationConfig["APP_DOMAIN"] %>/<%= current_user.username %>" aria-label="Go to your profile page">
|
||||
<img src="https://d2fltix0v2e0sb.cloudfront.net/dev-badge.svg"
|
||||
alt="DEV badge"
|
||||
height="28" width="28"
|
||||
style="vertical-align:-7px;margin-right:4px;" class="dev-badge" />
|
||||
</a>
|
||||
Add the DEV badge to your personal site. <a href="/p/badges">Click here for the code</a>
|
||||
</h4>
|
||||
<%= form_for(@user) do |f| %>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue