Updated button styles
authorAlexander Ebert <ebert@woltlab.com>
Sat, 16 Apr 2016 13:26:37 +0000 (15:26 +0200)
committerAlexander Ebert <ebert@woltlab.com>
Sat, 16 Apr 2016 13:26:37 +0000 (15:26 +0200)
wcfsetup/install/files/style/ui/button.scss
wcfsetup/setup/db/install.sql

index 099a314ea3c0dade04bb2d212a7ef353adf9cb58..9915698be5d50880998859b0ec792436459c33da 100644 (file)
@@ -5,12 +5,12 @@ input[type="submit"],
 .button,
 a.button { // a.button is required to override link formatting, such as drop-down buttons
        background-color: $wcfButtonBackground;
-       border: 1px solid $wcfButtonBorder;
+       border-width: 0;
        color: $wcfButtonText;
        cursor: pointer;
        display: inline-block;
        outline: none;
-       padding: 4px 12px;
+       padding: 6px 12px;
        
        // input elements do not inherit font family, size and line-height from body
        font-family: $wcfFontFamily;
@@ -24,7 +24,6 @@ a.button { // a.button is required to override link formatting, such as drop-dow
        &.active,
        &:hover {
                background-color: $wcfButtonBackgroundActive;
-               border-color: $wcfButtonBorderActive;
                color: $wcfButtonTextActive;
        }
        
@@ -39,15 +38,13 @@ button.buttonPrimary,
 input[type="button"].buttonPrimary,
 input[type="submit"],
 .button.buttonPrimary,
-a.button.buttonPrimary { // a.button is required to override link formatting, such as drop-down buttons
+a.button.buttonPrimary { // a.button is required to override link formatting, such as dropdown buttons
        background-color: $wcfButtonPrimaryBackground;
-       border-color: $wcfButtonPrimaryBorder;
        color: $wcfButtonPrimaryText;
        
        &.active,
        &:hover {
                background-color: $wcfButtonPrimaryBackgroundActive;
-               border-color: $wcfButtonPrimaryBorderActive;
                color: $wcfButtonPrimaryTextActive;
        }
 }
@@ -62,7 +59,6 @@ a.button {
        &:disabled,
        &.disabled {
                background-color: $wcfButtonDisabledBackground !important;
-               border-color: $wcfButtonDisabledBorder !important;
                color: $wcfButtonDisabledText !important;
                cursor: not-allowed !important;
        }
@@ -77,7 +73,6 @@ a.button {
        > .button,
        > a.button {
                background-color: $wcfButtonBackgroundActive;
-               border-color: $wcfButtonBorderActive;
                color: $wcfButtonTextActive;
        }
        
@@ -87,7 +82,6 @@ a.button {
        > .button.buttonPrimary,
        > a.button.buttonPrimary {
                background-color: $wcfButtonPrimaryBackgroundActive;
-               border-color: $wcfButtonPrimaryBorderActive;
                color: $wcfButtonPrimaryTextActive;
        }
 }
@@ -96,7 +90,7 @@ a.button {
        @include inlineList;
        
        &.smallButtons .button {
-               padding: 4px 7px;
+               padding: 5px 7px;
                
                @include wcfFontSmall;
        }
index bbf82f9bfe18cf587e156418b2ff04f8e9c27708..4af20dcc656340f07efc3c1549c3830f0240ddec 100644 (file)
@@ -1944,21 +1944,21 @@ INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('overrideSc
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('pageLogo', '');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('useFluidLayout', '1');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('useGoogleFont', '1');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonBackground', 'rgba(255, 255, 255, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonBackgroundActive', 'rgba(52, 73, 94, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonBorder', 'rgba(127, 140, 141, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonBorderActive', 'rgba(52, 73, 94, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonDisabledBackground', 'rgba(255, 255, 255, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonBackground', 'rgba(224, 224, 224, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonBackgroundActive', 'rgba(213, 213, 213, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonBorder', 'rgba(127, 140, 141, 1)'); -- no longer in use (ACP style editor needs to be updated first)
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonBorderActive', 'rgba(52, 73, 94, 1)'); -- no longer in use (ACP style editor needs to be updated first)
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonDisabledBackground', 'rgba(223, 223, 223, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonDisabledBorder', 'rgba(173, 176, 179, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonDisabledText', 'rgba(173, 176, 179, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryBackground', 'rgba(255, 255, 255, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryBackgroundActive', 'rgba(79, 129, 189, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryBorder', 'rgba(79, 129, 189, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryBorderActive', 'rgba(79, 129, 189, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryText', 'rgba(79, 129, 189, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonDisabledText', 'rgba(165, 165, 165, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryBackground', 'rgba(33, 150, 243, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryBackgroundActive', 'rgba(26, 119, 201, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryBorder', 'rgba(79, 129, 189, 1)'); -- no longer in use (ACP style editor needs to be updated first)
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryBorderActive', 'rgba(79, 129, 189, 1)'); -- no longer in use (ACP style editor needs to be updated first)
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryText', 'rgba(255, 255, 255, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonPrimaryTextActive', 'rgba(255, 255, 255, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonText', 'rgba(127, 140, 141, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonTextActive', 'rgba(255, 255, 255, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonText', 'rgba(33, 33, 33, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfButtonTextActive', 'rgba(33, 33, 33, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfContentBackground', 'rgba(255, 255, 255, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfContentBorder', 'rgba(79, 129, 189, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfContentBorderInner', 'rgba(238, 238, 238, 1)');