Issue #2934178 by samuel.mortenson, DyanneNova, xjm, yoroy, andrewmacpherson: Contrast issues with off-canvas dialog styling
parent
8351e1bc9f
commit
e428304f34
|
@ -69,7 +69,7 @@
|
||||||
#drupal-off-canvas input[type="submit"].button--primary:hover,
|
#drupal-off-canvas input[type="submit"].button--primary:hover,
|
||||||
#drupal-off-canvas input[type="submit"].button--primary:focus,
|
#drupal-off-canvas input[type="submit"].button--primary:focus,
|
||||||
#drupal-off-canvas input[type="submit"].button--primary:active {
|
#drupal-off-canvas input[type="submit"].button--primary:active {
|
||||||
background: #2b8bd8;
|
background: #236aaf;
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
#drupal-off-canvas .button-action:before {
|
#drupal-off-canvas .button-action:before {
|
||||||
|
|
|
@ -43,9 +43,6 @@
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
#drupal-off-canvas .details-wrapper .description {
|
|
||||||
color: #bbb;
|
|
||||||
}
|
|
||||||
#drupal-off-canvas .form-item {
|
#drupal-off-canvas .form-item {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
|
|
|
@ -46,7 +46,6 @@
|
||||||
}
|
}
|
||||||
#drupal-off-canvas th {
|
#drupal-off-canvas th {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #bbb;
|
|
||||||
}
|
}
|
||||||
#drupal-off-canvas th.checkbox,
|
#drupal-off-canvas th.checkbox,
|
||||||
#drupal-off-canvas td.checkbox {
|
#drupal-off-canvas td.checkbox {
|
||||||
|
|
|
@ -9,7 +9,7 @@
|
||||||
|
|
||||||
/* Style the edit mode toolbar and tabs. */
|
/* Style the edit mode toolbar and tabs. */
|
||||||
#toolbar-bar.js-settings-tray-edit-mode {
|
#toolbar-bar.js-settings-tray-edit-mode {
|
||||||
background-image: linear-gradient(to bottom, #0c97ed, #1f86c7);
|
background-image: linear-gradient(to bottom, #0A7BC1, #0a6eb4);
|
||||||
}
|
}
|
||||||
.js-settings-tray-edit-mode .toolbar-item:not(.toolbar-icon-edit) {
|
.js-settings-tray-edit-mode .toolbar-item:not(.toolbar-icon-edit) {
|
||||||
color: #999;
|
color: #999;
|
||||||
|
@ -22,9 +22,9 @@
|
||||||
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item,
|
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item,
|
||||||
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item.is-active,
|
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item.is-active,
|
||||||
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item:focus {
|
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item:focus {
|
||||||
background-color: #50a0e9;
|
background-color: #0066A1;
|
||||||
background-image: linear-gradient(to bottom, #007bc6, #0071b8);
|
background-image: linear-gradient(to bottom, #0066A1, #005b98);
|
||||||
color: #ddd;
|
color: #eee;
|
||||||
text-shadow: none;
|
text-shadow: none;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
outline: none;
|
outline: none;
|
||||||
|
@ -32,13 +32,13 @@
|
||||||
/* Make the hover of the inactive state the same as the active state. */
|
/* Make the hover of the inactive state the same as the active state. */
|
||||||
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item:hover,
|
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item:hover,
|
||||||
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item.is-active {
|
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item.is-active {
|
||||||
background-image: linear-gradient(to bottom, #0c97ed, #1f86c7);
|
background-image: linear-gradient(to bottom, #0a7bc1, #0a6eb4);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
/* Make the hover of the active state the same as the inactive state. */
|
/* Make the hover of the active state the same as the inactive state. */
|
||||||
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item.is-active:hover {
|
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item.is-active:hover {
|
||||||
background-color: #2369a6;
|
background-color: #0066A1;
|
||||||
background-image: linear-gradient(to bottom, #007bc6, #0071b8);
|
background-image: linear-gradient(to bottom, #0066A1, #005b98);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
/* Make the inactive icon grey. */
|
/* Make the inactive icon grey. */
|
||||||
|
|
|
@ -20,25 +20,25 @@
|
||||||
|
|
||||||
/* Style both the edit and editing states of the contextual links toggle tab. */
|
/* Style both the edit and editing states of the contextual links toggle tab. */
|
||||||
.toolbar-icon-edit.toolbar-item {
|
.toolbar-icon-edit.toolbar-item {
|
||||||
background-color: #50a0e9;
|
background-color: #0066A1;
|
||||||
background-image: linear-gradient(to bottom, #007bc6, #0071b8);
|
background-image: linear-gradient(to bottom, #0066A1, #005b98);
|
||||||
color: #eee;
|
color: #eee;
|
||||||
text-shadow: 0 1px hsla(0, 0%, 0%, 0.5);
|
text-shadow: 0 1px hsla(0, 0%, 0%, 0.5);
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
}
|
}
|
||||||
.toolbar-icon-edit.toolbar-item.is-active {
|
.toolbar-icon-edit.toolbar-item.is-active {
|
||||||
background-color: #50a0e9;
|
background-color: #0a7bc1;
|
||||||
background-image: linear-gradient(to bottom, #007bc6, #0071b8);
|
background-image: linear-gradient(to bottom, #0a7bc1, #0a6eb4);
|
||||||
color: #eee;
|
color: #fff;
|
||||||
text-shadow: 0 1px hsla(0, 0%, 0%, 0.5);
|
text-shadow: 0 1px hsla(0, 0%, 0%, 0.5);
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
}
|
}
|
||||||
.toolbar-tab:hover > .toolbar-icon-edit,
|
.toolbar-tab:hover > .toolbar-icon-edit,
|
||||||
.toolbar-icon-edit:focus .toolbar-item {
|
.toolbar-icon-edit:focus .toolbar-item {
|
||||||
background-color: #2369a6;
|
background-color: #0a7bc1;
|
||||||
background-image: linear-gradient(to bottom, #0c97ed, #1f86c7);
|
background-image: linear-gradient(to bottom, #0a7bc1, #0a6eb4);
|
||||||
border-color: #1e5c90;
|
border-color: #1e5c90;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
outline: none;
|
outline: none;
|
||||||
|
@ -59,9 +59,8 @@ button.toolbar-icon.toolbar-icon-edit.toolbar-item:before:focus {
|
||||||
}
|
}
|
||||||
|
|
||||||
#toolbar-bar.js-settings-tray-edit-mode button.toolbar-icon.toolbar-icon-edit.toolbar-item.is-active {
|
#toolbar-bar.js-settings-tray-edit-mode button.toolbar-icon.toolbar-icon-edit.toolbar-item.is-active {
|
||||||
background-image: none;
|
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
#toolbar-bar.js-settings-tray-edit-mode button.toolbar-icon.toolbar-icon-edit.toolbar-item.is-active:hover {
|
#toolbar-bar.js-settings-tray-edit-mode button.toolbar-icon.toolbar-icon-edit.toolbar-item.is-active:hover {
|
||||||
background-image: linear-gradient(to bottom, #0094f0, #0e69be);
|
background-image: linear-gradient(to bottom, #0a6fb4, #0a65aa);
|
||||||
}
|
}
|
||||||
|
|
|
@ -69,7 +69,7 @@
|
||||||
#drupal-off-canvas input[type="submit"].button--primary:hover,
|
#drupal-off-canvas input[type="submit"].button--primary:hover,
|
||||||
#drupal-off-canvas input[type="submit"].button--primary:focus,
|
#drupal-off-canvas input[type="submit"].button--primary:focus,
|
||||||
#drupal-off-canvas input[type="submit"].button--primary:active {
|
#drupal-off-canvas input[type="submit"].button--primary:active {
|
||||||
background: #2b8bd8;
|
background: #236aaf;
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
#drupal-off-canvas .button-action:before {
|
#drupal-off-canvas .button-action:before {
|
||||||
|
|
|
@ -43,9 +43,6 @@
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
#drupal-off-canvas .details-wrapper .description {
|
|
||||||
color: #bbb;
|
|
||||||
}
|
|
||||||
#drupal-off-canvas .form-item {
|
#drupal-off-canvas .form-item {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
|
|
|
@ -46,7 +46,6 @@
|
||||||
}
|
}
|
||||||
#drupal-off-canvas th {
|
#drupal-off-canvas th {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #bbb;
|
|
||||||
}
|
}
|
||||||
#drupal-off-canvas th.checkbox,
|
#drupal-off-canvas th.checkbox,
|
||||||
#drupal-off-canvas td.checkbox {
|
#drupal-off-canvas td.checkbox {
|
||||||
|
|
Loading…
Reference in New Issue