Style 'Sign in' view

This commit is contained in:
cryptogopher 2023-04-07 00:09:20 +02:00
parent b5c0a6a120
commit 74381494ea
4 changed files with 53 additions and 11 deletions

View File

@ -22,12 +22,29 @@ body {
margin: 0 0.5em;
}
input {
border: 1px solid;
border-radius: 0.2em;
border-color: #cccccc;
font-size: 0.9em;
padding: 0.1em 0.4em;
}
input[type=checkbox] {
height: 1em;
margin: 0;
width: 1em;
}
input:focus:not([type=checkbox]) {
outline: none;
}
.application-menu {
height: 2.1em;
margin: 0.5em 0;
}
.application-menu a {
border: 0.1em solid;
.application-menu a, input[type=submit] {
border: 1px solid;
background-color: #ffffff;
border-color: #a0a0a0;
border-radius: 0.2em;
color: #a0a0a0;
@ -37,7 +54,10 @@ body {
margin-left: 1em;
padding: 0.6em;
}
.application-menu a:hover {
.application-menu a:hover,
.application-menu a:focus-visible,
input[type=submit]:hover,
input[type=submit]:focus-visible {
background-color: #009ade;
border-color: #009ade;
color: white;
@ -94,3 +114,21 @@ a:not(:hover) {
.flash button:hover {
opacity: 1;
}
.field + .field, .field + .actions {
margin-top: 0.8em;
}
form label {
display: inline-block;
font-weight: bold;
font-size: 0.9em;
padding-right: 0.25em;
text-align: right;
width: 50%;
}
form input[type=submit] {
display: block;
float: none;
font-size: 0.9em;
margin: 0 auto;
}

View File

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<title>FixinMe</title>
<title>fixin.me</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<%= csrf_meta_tags %>
<%= csp_meta_tag %>

View File

@ -1,25 +1,25 @@
<h2>Log in</h2>
<h2 style="text-align:center;"><%= t :sign_in %></h2>
<%= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %>
<div class="field">
<%= f.label :email %><br />
<%= f.email_field :email, autofocus: true, autocomplete: "email" %>
<%= f.label t(:email) -%>
<%= f.email_field :email, size: 32, autofocus: true, autocomplete: "email" %>
</div>
<div class="field">
<%= f.label :password %><br />
<%= f.password_field :password, autocomplete: "current-password" %>
<%= f.label t(:password) -%>
<%= f.password_field :password, size: 32, autocomplete: "current-password" %>
</div>
<% if devise_mapping.rememberable? %>
<div class="field">
<%= f.label t(:remember_me) -%>
<%= f.check_box :remember_me %>
<%= f.label :remember_me %>
</div>
<% end %>
<div class="actions">
<%= f.submit "Log in" %>
<%= f.submit t(:sign_in) %>
</div>
<% end %>

View File

@ -1,3 +1,7 @@
en:
email: "E-mail"
password: "Password"
register: "Register"
remember_me: "Remember me"
sign_in: "Sign in"
sign_out: "Sign out"