mediawiki.ui: Update color palette

[lhc/web/wiklou.git] / resources / src / mediawiki.less / mediawiki.ui / mixins.less

diff --git a/resources/src/mediawiki.less/mediawiki.ui/mixins.less b/resources/src/mediawiki.less/mediawiki.ui/mixins.less
index bda4043..ae08c9f 100644 (file)
--- a/resources/src/mediawiki.less/mediawiki.ui/mixins.less
+++ b/resources/src/mediawiki.less/mediawiki.ui/mixins.less
@@ -5,7 +5,7 @@
 // Font is not included.
 .agora-field-styling() {
 
-       border: 1px solid @colorGrayLight;
+       border: 1px solid @colorFieldBorder;
 
        &:focus {
                // Styling focus of native checkboxes etc on Mac is almost impossible.
@@ -13,9 +13,9 @@
                        outline: 0; // Removes OS field focus
                }
 
-               box-shadow: @colorProgressiveShadow 0 0 5px;
+               box-shadow: lighten(@colorProgressive, 6%) 0 0 5px;
 
-               border-color: @colorProgressiveShadow;
+               border-color: lighten(@colorProgressive, 6%);
        }
 
        color: @colorText;
@@ -26,9 +26,8 @@
 }
 
 .agora-label-styling() {
-       //font-weight: bold;
        font-size: 0.9em;
-       color: darken(@colorGrayLight, 50%);
+       color: @colorText;
 
        * {
                font-weight: normal;
@@ -49,7 +48,7 @@
                height: auto;
                margin: 0 0.1em 0 0;
                padding: 0;
-               border: 1px solid @colorGrayLight;
+               border: 1px solid @colorFieldBorder;
                cursor: pointer;
        }
 }
@@ -84,11 +83,11 @@
 }
 
 .button-colors(@bgColor) when (lightness(@bgColor) >= 70%) {
-       color: @colorGrayDark;
-       border: 1px solid @colorGrayLight;
+       color: @colorButtonText;
+       border: 1px solid @colorGray12;
 
        &:disabled {
-               color: @colorGrayLight;
+               color: @colorDisabledText;
 
                // make sure disabled buttons don't have hover and active states
                &:hover,
@@ -100,7 +99,7 @@
 }
 
 .button-colors(@bgColor) when (lightness(@bgColor) < 70%) {
-       color: @colorWhite;
+       color: #fff;
        // border of the same color as background so that light background and
        // dark background buttons are the same height (only top and bottom to
        // make box shadow on hover cover the corners too)
@@ -110,8 +109,8 @@
        text-shadow: 0 1px rgba(0, 0, 0, .1);
 
        &:disabled {
-               background: @colorGrayLight;
-               border-color: @colorGrayLight;
+               background: @colorGray12;
+               border-color: @colorGray12;
 
                // make sure disabled buttons don't have hover and active states
                &:hover,
@@ -125,7 +124,7 @@
 .button-colors-quiet(@textColor) {
        // Quiet buttons all start gray, and reveal
        // constructive/progressive/destructive color on hover and active.
-       color: @colorGrayDark;
+       color: @colorButtonText;
 
        &:hover,
        &:focus {
@@ -142,6 +141,6 @@
        }
 
        &:disabled {
-               color: @colorGrayLight;
+               color: @colorDisabledText;
        }
 }