diff options
| -rw-r--r-- | app/views/users/edit.html.erb | 18 | ||||
| -rw-r--r-- | public/stylesheets/admin.css | 72 |
2 files changed, 39 insertions, 51 deletions
diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb index 4f1a22b8..9df93815 100644 --- a/app/views/users/edit.html.erb +++ b/app/views/users/edit.html.erb | |||
| @@ -1,14 +1,13 @@ | |||
| 1 | <h1><%= @user == current_user ? t(".my_account") : t(".edit_user", :login => @user.login) %></h1> | 1 | <div id="admin_layout"> |
| 2 | <h1><%= @user == current_user ? t(".my_account") : t(".edit_user", :login => @user.login) %></h1> | ||
| 2 | 3 | ||
| 3 | <% if @user.errors.any? %> | 4 | <% if @user.errors.any? %> |
| 4 | <div class="error_messages"> | 5 | <div class="error_messages"> |
| 5 | <ul><% @user.errors.full_messages.each do |msg| %><li><%= msg %></li><% end %></ul> | 6 | <ul><% @user.errors.full_messages.each do |msg| %><li><%= msg %></li><% end %></ul> |
| 6 | </div> | 7 | </div> |
| 7 | <% end %> | 8 | <% end %> |
| 8 | 9 | ||
| 9 | <div id="admin_layout"> | ||
| 10 | <%= form_for @user do |f| %> | 10 | <%= form_for @user do |f| %> |
| 11 | <div id="content"> | ||
| 12 | <div class="layout_row_label"><%= t("users.labels.login") %></div> | 11 | <div class="layout_row_label"><%= t("users.labels.login") %></div> |
| 13 | <div class="layout_row_content"><%= f.text_field :login, :autocomplete => "username" %></div> | 12 | <div class="layout_row_content"><%= f.text_field :login, :autocomplete => "username" %></div> |
| 14 | 13 | ||
| @@ -29,7 +28,6 @@ | |||
| 29 | <div class="layout_row_label"></div> | 28 | <div class="layout_row_label"></div> |
| 30 | <div class="layout_row_content"><%= submit_tag t(".update") %></div> | 29 | <div class="layout_row_content"><%= submit_tag t(".update") %></div> |
| 31 | <% end %> | 30 | <% end %> |
| 32 | </div> | ||
| 33 | 31 | ||
| 34 | <% if @user == current_user %> | 32 | <% if @user == current_user %> |
| 35 | <div class="layout_row_label"><%= t(".second_factor") %></div> | 33 | <div class="layout_row_label"><%= t(".second_factor") %></div> |
| @@ -37,7 +35,6 @@ | |||
| 37 | <% if current_user.otp_enrolled? %> | 35 | <% if current_user.otp_enrolled? %> |
| 38 | <p><%= t(".enabled") %></p> | 36 | <p><%= t(".enabled") %></p> |
| 39 | <%= form_tag otp_enrollment_path, :method => :delete, :class => "otp_form" do %> | 37 | <%= form_tag otp_enrollment_path, :method => :delete, :class => "otp_form" do %> |
| 40 | <%= text_field_tag :login, current_user.login, :autocomplete => "username", :readonly => true, :tabindex => -1, :class => "visually_hidden" %> | ||
| 41 | <%= password_field_tag :current_password, nil, :placeholder => t(".current_password"), :autocomplete => "current-password" %> | 38 | <%= password_field_tag :current_password, nil, :placeholder => t(".current_password"), :autocomplete => "current-password" %> |
| 42 | <%= text_field_tag :code, nil, :placeholder => t(".current_code"), | 39 | <%= text_field_tag :code, nil, :placeholder => t(".current_code"), |
| 43 | :autocomplete => "one-time-code", :inputmode => "numeric" %> | 40 | :autocomplete => "one-time-code", :inputmode => "numeric" %> |
| @@ -48,7 +45,6 @@ | |||
| 48 | <% else %> | 45 | <% else %> |
| 49 | <p><%= t(".not_enrolled") %></p> | 46 | <p><%= t(".not_enrolled") %></p> |
| 50 | <%= form_tag otp_enrollment_path, :method => :post, :class => "otp_form" do %> | 47 | <%= form_tag otp_enrollment_path, :method => :post, :class => "otp_form" do %> |
| 51 | <%= text_field_tag :login, current_user.login, :autocomplete => "username", :readonly => true, :tabindex => -1, :class => "visually_hidden" %> | ||
| 52 | <%= password_field_tag :current_password, nil, :placeholder => t(".current_password"), :autocomplete => "current-password"%> | 48 | <%= password_field_tag :current_password, nil, :placeholder => t(".current_password"), :autocomplete => "current-password"%> |
| 53 | <%= button_tag :type => "submit", :class => "action_button" do %> | 49 | <%= button_tag :type => "submit", :class => "action_button" do %> |
| 54 | <%= icon("shield-lock", library: "tabler", "aria-hidden": true) %> <%= t(".enable_second_factor") %> | 50 | <%= icon("shield-lock", library: "tabler", "aria-hidden": true) %> <%= t(".enable_second_factor") %> |
diff --git a/public/stylesheets/admin.css b/public/stylesheets/admin.css index 8378cf78..6664c4ce 100644 --- a/public/stylesheets/admin.css +++ b/public/stylesheets/admin.css | |||
| @@ -59,10 +59,7 @@ summary:hover { | |||
| 59 | background-color: #f7f7f7; | 59 | background-color: #f7f7f7; |
| 60 | } | 60 | } |
| 61 | 61 | ||
| 62 | input[type=password] { | 62 | input[type=password], |
| 63 | border: 1px solid #989898; | ||
| 64 | } | ||
| 65 | |||
| 66 | input[type=radio] { | 63 | input[type=radio] { |
| 67 | border: 1px solid #989898; | 64 | border: 1px solid #989898; |
| 68 | } | 65 | } |
| @@ -72,17 +69,12 @@ input[type=radio] { | |||
| 72 | ============================================================ */ | 69 | ============================================================ */ |
| 73 | 70 | ||
| 74 | #wrapper { | 71 | #wrapper { |
| 75 | padding: 5px; | 72 | margin: 0 5px; |
| 76 | width: 100%; | ||
| 77 | box-sizing: border-box; | ||
| 78 | } | 73 | } |
| 79 | 74 | ||
| 80 | @media(min-width:1016px) { | 75 | @media(min-width:1016px) { |
| 81 | #wrapper { | 76 | #wrapper { |
| 82 | margin: 0 125px; | 77 | margin: 0 125px; |
| 83 | padding: 0; | ||
| 84 | width: inherit; | ||
| 85 | box-sizing: inherit; | ||
| 86 | } | 78 | } |
| 87 | 79 | ||
| 88 | .node_action_bar.node_action_bar_save { | 80 | .node_action_bar.node_action_bar_save { |
| @@ -107,6 +99,16 @@ input[type=radio] { | |||
| 107 | .right { text-align: right; } | 99 | .right { text-align: right; } |
| 108 | .clear_left { clear: left; } | 100 | .clear_left { clear: left; } |
| 109 | 101 | ||
| 102 | #login_form { | ||
| 103 | max-width: 22rem; | ||
| 104 | } | ||
| 105 | |||
| 106 | #login_form input[type=text], | ||
| 107 | #login_form input[type=password] { | ||
| 108 | width: 100%; | ||
| 109 | box-sizing: border-box; | ||
| 110 | } | ||
| 111 | |||
| 110 | /* ============================================================ | 112 | /* ============================================================ |
| 111 | Navigation | 113 | Navigation |
| 112 | ============================================================ */ | 114 | ============================================================ */ |
| @@ -811,7 +813,8 @@ form.button_to button[type="submit"] { | |||
| 811 | padding: 4px 12px; | 813 | padding: 4px 12px; |
| 812 | box-sizing: border-box; | 814 | box-sizing: border-box; |
| 813 | height: 2.25rem; | 815 | height: 2.25rem; |
| 814 | width: 22rem; | 816 | width: 100%; |
| 817 | max-width: 22rem; | ||
| 815 | border-radius: 2px; | 818 | border-radius: 2px; |
| 816 | } | 819 | } |
| 817 | 820 | ||
| @@ -914,10 +917,6 @@ form.button_to button[type="submit"] { | |||
| 914 | } | 917 | } |
| 915 | } | 918 | } |
| 916 | 919 | ||
| 917 | #new_node input[type=text], #new_node input[type=password] { | ||
| 918 | width: 350px; | ||
| 919 | } | ||
| 920 | |||
| 921 | input[type=text]#tag_list, | 920 | input[type=text]#tag_list, |
| 922 | input[type=text]#node_staged_slug, | 921 | input[type=text]#node_staged_slug, |
| 923 | input#move_to_search_term { | 922 | input#move_to_search_term { |
| @@ -974,21 +973,20 @@ input#tag_list { | |||
| 974 | input[type=text]#page_title { | 973 | input[type=text]#page_title { |
| 975 | box-sizing: border-box; | 974 | box-sizing: border-box; |
| 976 | width: 100%; | 975 | width: 100%; |
| 977 | padding-top: 6px 5px 4px; | 976 | padding: 6px 5px 4px; |
| 978 | font-weight: bold; | 977 | font-weight: bold; |
| 979 | } | 978 | } |
| 980 | 979 | ||
| 981 | #admin_layout textarea#page_body { | ||
| 982 | box-sizing: border-box; | ||
| 983 | width: 100%; | ||
| 984 | height: 60vh; | ||
| 985 | } | ||
| 986 | |||
| 987 | #admin_layout textarea#page_abstract { | 980 | #admin_layout textarea#page_abstract { |
| 988 | width: 100%; | 981 | width: 100%; |
| 989 | box-sizing: border-box; | 982 | box-sizing: border-box; |
| 990 | height: 8rem; | 983 | height: 8rem; |
| 984 | } | ||
| 985 | |||
| 986 | #admin_layout textarea#page_body { | ||
| 987 | box-sizing: border-box; | ||
| 991 | width: 100%; | 988 | width: 100%; |
| 989 | height: 60vh; | ||
| 992 | } | 990 | } |
| 993 | 991 | ||
| 994 | #admin_layout #content, | 992 | #admin_layout #content, |
| @@ -1004,16 +1002,18 @@ input#move_to_search_term { | |||
| 1004 | width: 100%; | 1002 | width: 100%; |
| 1005 | } | 1003 | } |
| 1006 | 1004 | ||
| 1007 | @media(min-width:1016px) { | 1005 | input#menu_search_term, |
| 1008 | input#menu_search_term, | 1006 | input#menu_item_node_id, |
| 1009 | input#menu_item_node_id, | 1007 | input#menu_item_path, |
| 1010 | input#menu_item_path, | 1008 | input#menu_item_title { |
| 1011 | input#menu_item_title { | 1009 | width: 100%; |
| 1012 | width: 690px; | 1010 | max-width: 44rem; |
| 1013 | } | 1011 | } |
| 1014 | 1012 | ||
| 1015 | textarea#page_abstract { | 1013 | @media(min-width:1016px) { |
| 1014 | #admin_layout textarea#page_abstract { | ||
| 1016 | padding: 5px; | 1015 | padding: 5px; |
| 1016 | height: 250px; | ||
| 1017 | } | 1017 | } |
| 1018 | 1018 | ||
| 1019 | #admin_overview { | 1019 | #admin_overview { |
| @@ -1560,7 +1560,8 @@ div#draft_list table td.actions a { | |||
| 1560 | } | 1560 | } |
| 1561 | 1561 | ||
| 1562 | .restore_picker input[type=text] { | 1562 | .restore_picker input[type=text] { |
| 1563 | width: 22em; | 1563 | width: 100%; |
| 1564 | max-width: 22rem | ||
| 1564 | } | 1565 | } |
| 1565 | 1566 | ||
| 1566 | .restore_picker .search_results { | 1567 | .restore_picker .search_results { |
| @@ -1590,15 +1591,6 @@ form.otp_form input[type=text] { | |||
| 1590 | margin-bottom: 0.5rem; | 1591 | margin-bottom: 0.5rem; |
| 1591 | } | 1592 | } |
| 1592 | 1593 | ||
| 1593 | .visually_hidden { | ||
| 1594 | position: absolute; | ||
| 1595 | width: 1px; | ||
| 1596 | height: 1px; | ||
| 1597 | overflow: hidden; | ||
| 1598 | clip-path: inset(50%); | ||
| 1599 | white-space: nowrap; | ||
| 1600 | } | ||
| 1601 | |||
| 1602 | .otp_qr svg { | 1594 | .otp_qr svg { |
| 1603 | width: 220px; | 1595 | width: 220px; |
| 1604 | height: auto; | 1596 | height: auto; |
