Accessibility and design fixes for update and redirect pages

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
This commit is contained in:
Jan-Christoph Borchardt 2018-10-02 10:11:47 +02:00
parent 0c18b4decc
commit 4de8f48b06
No known key found for this signature in database
GPG Key ID: CBD846FC845CBE17
2 changed files with 32 additions and 19 deletions

View File

@ -33,15 +33,20 @@ body {
} }
/* Various fonts settings */ /* Various fonts settings */
p.info a, #body-login a {
color: #fff;
font-weight: 600;
}
#body-login a:not(.button):hover,
#body-login a:not(.button):focus {
text-decoration: underline;
text-decoration-skip-ink: auto;
}
#showAdvanced { #showAdvanced {
color: #fff; color: #fff;
} }
#remember_login:hover+label,
#forgot-password:hover,
p.info a:hover {
opacity: .6;
}
em { em {
font-style: normal; font-style: normal;
opacity: .5; opacity: .5;
@ -182,9 +187,10 @@ input[type='submit'].icon-confirm,
input[type='button'], input[type='button'],
button, .button, button, .button,
select { select {
display: inline-block;
width: auto; width: auto;
min-width: 25px; min-width: 25px;
padding: 5px; padding: 12px;
background-color: white; background-color: white;
font-weight: 600; font-weight: 600;
color: #555; color: #555;
@ -227,6 +233,7 @@ input.update-continue {
.updateAnyways a.updateAnywaysButton:hover { .updateAnyways a.updateAnywaysButton:hover {
color: #222 !important; color: #222 !important;
} }
input.primary, input.primary,
button.primary { button.primary {
border: 1px solid #fff; border: 1px solid #fff;
@ -234,6 +241,13 @@ button.primary {
color: #fff; color: #fff;
} }
input.primary:not(:disabled):hover,
input.primary:not(:disabled):focus,
button.primary:not(:disabled):hover,
button.primary:not(:disabled):focus {
background-color: #17adff;
}
/* Checkboxes - white only for login */ /* Checkboxes - white only for login */
input[type='checkbox'].checkbox { input[type='checkbox'].checkbox {
position: absolute; position: absolute;
@ -300,7 +314,7 @@ label.infield {
left: 5px; left: 5px;
top: -20px; top: -20px;
width: 269px; width: 269px;
border-radius: 0 0 2px 2px; border-radius: 0 0 3px 3px;
overflow: hidden; overflow: hidden;
height: 3px; height: 3px;
} }
@ -438,9 +452,11 @@ form .warning input[type='checkbox']+label {
.lost-password-container #lost-password, .lost-password-container #lost-password,
.lost-password-container #lost-password-back { .lost-password-container #lost-password-back {
display: inline-block; display: inline-block;
font-weight: 300;
padding: 12px; padding: 12px;
margin-top: -6px; margin-top: -6px;
color: #fff; color: #fff;
cursor: pointer;
} }
#forgot-password { #forgot-password {
padding: 11px; padding: 11px;
@ -543,12 +559,13 @@ form #selectDbType label.ui-state-active {
.update, .update,
.error { .error {
display: block; display: block;
padding: 10px; padding: 15px;
background-color: rgba(0,0,0,.3); background-color: rgba(0,0,0,.3);
box-shadow: 0 0 30px rgba(0,0,0,.3);
color: #fff; color: #fff;
text-align: left; text-align: left;
word-wrap: break-word; word-wrap: break-word;
border-radius: 3px; border-radius: 10px;
cursor: default; cursor: default;
-moz-user-select: text; -moz-user-select: text;
-webkit-user-select: text; -webkit-user-select: text;
@ -608,7 +625,10 @@ fieldset.update legend + p {
/* Various paragraph styles */ /* Various paragraph styles */
.infogroup { .infogroup {
margin-bottom: 15px; margin: 8px 0;
}
.infogroup:last-child {
margin-bottom: 0;
} }
p.info { p.info {
margin: 20px auto; margin: 20px auto;
@ -633,13 +653,6 @@ p.info {
.update img.float-spinner { .update img.float-spinner {
float: left; float: left;
} }
.update h2 {
margin: 0 0 20px;
}
.update a {
color: #fff;
border-bottom: 1px solid #aaa;
}
.update a.update-show-detailed { .update a.update-show-detailed {
border-bottom: inherit; border-bottom: inherit;
} }

View File

@ -34,7 +34,7 @@
<div class="infogroup bold"> <div class="infogroup bold">
<?php p($l->t('Please make sure that the database, the config folder and the data folder have been backed up before proceeding.')) ?> <?php p($l->t('Please make sure that the database, the config folder and the data folder have been backed up before proceeding.')) ?>
</div> </div>
<input class="updateButton" type="button" value="<?php p($l->t('Start update')) ?>"> <input class="updateButton primary" type="button" value="<?php p($l->t('Start update')) ?>">
<div class="infogroup"> <div class="infogroup">
<em> <em>
<?php p($l->t('To avoid timeouts with larger installations, you can instead run the following command from your installation directory:')) ?> <?php p($l->t('To avoid timeouts with larger installations, you can instead run the following command from your installation directory:')) ?>