Amend Base10 color and remove (affected) PNG fallbacks

Amending Base10 to slightly darker `#202122` to fulfill WCAG
requirements in connection to Accent50.
Also removing all PNG fallbacks as they are only used in JS-only.

Bug: T248393
Change-Id: I07fa4e23320763a634e5340ab125634842b86454
This commit is contained in:
Volker E
2020-04-20 15:58:44 -07:00
committed by jenkins-bot
parent 15088649bd
commit 6ea7307df9
21 changed files with 27 additions and 33 deletions

View File

@@ -15,7 +15,7 @@
padding: 4px 6px 4px 25px;
font-size: 13px;
font-weight: normal;
.background-image-svg( '../images/compact-links-trigger.svg', '../images/compact-links-trigger.png' );
background-image: url( ../images/compact-links-trigger.svg );
background-size: 18px;
background-repeat: no-repeat;
background-position: left 4px center;

View File

@@ -48,7 +48,7 @@
}
.uls-font-label strong {
color: #222;
color: #202122;
}
.uls-display-settings-anon-label {

View File

@@ -17,7 +17,7 @@
.uls-ime-menu-settings-item {
background-color: #f8f9fa;
color: #222;
color: #202122;
border-top: 1px solid #c8ccd1;
border-radius: 0 0 2px 2px;
margin-top: 6px;
@@ -26,8 +26,7 @@
}
.uls-ime-disable-link {
background: transparent no-repeat left top;
.background-image-svg( '../images/remove-input.svg', '../images/remove-input.png' );
background: transparent url( ../images/remove-input.svg ) no-repeat left top;
background-size: auto 16px;
padding-left: 22px;
padding-right: 26px;
@@ -36,8 +35,7 @@
}
.uls-ime-more-settings-link {
background: transparent no-repeat center top;
.background-image-svg( '../images/cog.svg', '../images/cog.png' );
background: transparent url( ../images/cog.svg ) no-repeat center top;
background-size: auto 14px;
border-left: 1px solid #c8ccd1;
width: 22px;
@@ -124,8 +122,7 @@
right: 4px;
opacity: 0.81;
padding: 0;
background: transparent no-repeat right center;
.background-image-svg( '../images/help.svg', '../images/help.png' );
background: transparent url( ../images/help.svg ) no-repeat right center;
background-size: 16px 16px;
}

View File

@@ -23,15 +23,15 @@
cursor: pointer;
&:hover {
color: #222;
color: #202122;
}
&.display-settings-block {
.background-image-svg( '../images/display.svg', '../images/display.png' );
background-image: url( ../images/display.svg );
}
&.input-settings-block {
.background-image-svg( '../images/input.svg', '../images/input.png' );
background-image: url( ../images/input.svg );
}
}
}

View File

@@ -2,8 +2,7 @@
@import 'mediawiki.mixins';
#p-lang .uls-settings-trigger {
background: transparent no-repeat center top;
.background-image-svg( '../images/cog-sprite.svg', '../images/cog-sprite.png' );
background: transparent url( ../images/cog-sprite.svg ) no-repeat center top;
border: 0;
min-height: 16px;
min-width: 16px;

View File

@@ -33,7 +33,7 @@
width: 100%;
/* Using border instead of outline for focus (outline doesn't have enough space) */
outline: 0;
color: #222;
color: #202122;
padding: 5px 0 5px 42px;
border: 1px solid transparent;
background: left 15px top 6px transparent no-repeat;
@@ -74,27 +74,27 @@
}
&:hover .settings-text {
color: #222;
color: #202122;
}
&.display-settings-block {
.background-image-svg( '../images/display.svg', '../images/display.png' );
background-image: url( ../images/display.svg );
}
&.input-settings-block {
.background-image-svg( '../images/input.svg', '../images/input.png' );
background-image: url( ../images/input.svg );
}
}
}
#languagesettings-settings-panel {
padding: 0 15px;
color: #222;
color: #202122;
background: #fff;
}
#languagesettings-settings-panel h3 {
color: #222;
color: #202122;
padding-top: 15px;
margin-top: 1pt;
line-height: 20pt;
@@ -102,7 +102,7 @@
}
#languagesettings-settings-panel h4 {
color: #222;
color: #202122;
font-size: 12pt;
}
@@ -146,7 +146,7 @@
}
.checkbox strong {
color: #222;
color: #202122;
}
label.checkbox input[ type='checkbox' ] {
@@ -158,9 +158,9 @@ label.checkbox input[ type='checkbox' ] {
}
.uls-icon-close {
background: transparent no-repeat center center;
.background-image-svg( '../images/close.svg', '../images/close.png' );
background-size: 16px 16px; // Support: Android Browser <= 4.3, doesn't accept it as part of `background` shorthand
background: transparent url( ../images/close.svg ) no-repeat center center;
// Support: Android Browser <= 4.3, doesn't accept `background-size` as part of `background` shorthand.
background-size: 16px 16px;
float: right;
padding: 16px;
cursor: pointer;

View File

@@ -36,10 +36,8 @@
}
.uls-icon-back {
background: transparent url( ../images/back-grey-ltr.png ) no-repeat scroll center center;
background-image: linear-gradient( transparent, transparent ), url( ../images/back-grey-ltr.svg );
background: transparent url( ../images/back-grey-ltr.svg ) no-repeat scroll center center;
background-size: 28px;
background-position: center center;
height: 32px;
width: 40px;
display: block;