From cb8490c8fb1e58e467eda9b1aebc3fbcaa469193 2017-06-22 05:14:29 From: DarkMorford Date: 2017-06-22 05:14:29 Subject: [PATCH] Start re-working admin styles in SASS. --- diff --git a/.gitignore b/.gitignore index 4e9e8c5..88f98ce 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,7 @@ # Composer dependencies vendor + +# Stylesheet artifacts +*.css +*.css.map +.sass-cache diff --git a/styles/_fonts.scss b/styles/_fonts.scss new file mode 100644 index 0000000..ccf2e7c --- /dev/null +++ b/styles/_fonts.scss @@ -0,0 +1,6 @@ +@charset "utf-8"; + +$fonts-main: "Lucida Grande", "Lucida Sans Unicode", Tahoma, Verdana; +$fonts-news: Georgia, "Times New Roman", Times, serif; +$fonts-input: Verdana, Arial, Helvetica, sans-serif; +$fonts-code: "Courier New", Courier, monospace; diff --git a/styles/_palette.scss b/styles/_palette.scss new file mode 100644 index 0000000..24a1346 --- /dev/null +++ b/styles/_palette.scss @@ -0,0 +1,12 @@ +@charset "utf-8"; + +$background-color: #F9FCFE; +$input-background: #F4F4F4; + +$font-color-normal: #000000; + +$input-border: #B2B2B2; +$button-normal-border: #CCCCCC; +$button-down-border: #999999; + +$button-label: #333333; diff --git a/styles/wp-admin.css b/styles/wp-admin.scss similarity index 89% rename from styles/wp-admin.css rename to styles/wp-admin.scss index 2ed65ba..88349a8 100644 --- a/styles/wp-admin.css +++ b/styles/wp-admin.scss @@ -1,3 +1,7 @@ +@charset "utf-8"; +@import "fonts"; +@import "palette"; + * html #poststuff { height: 100%; /* kill peekaboo bug in IE */ } @@ -9,6 +13,7 @@ body { border: none; } + a { border-bottom: 1px solid #69c; color: #00019b; @@ -21,45 +26,47 @@ a.delete:hover { } #devnews h4 { - font-family: Georgia, "Times New Roman", Times, serif; + font-family: $fonts-news; font-size: 18px; font-weight: normal; } -#planetnews ul { - list-style: none; - margin: 0; - padding: 0; -} - -#planetnews li { - width: 17%; - margin: 1%; - float: left; -} - -#planetnews li a { - display: block; - padding: .5em; - background: #ddd; - height: 6em; - overflow: hidden; -} - -#planetnews cite { - font-size: 11px; -} - -#planetnews li .post { - font-family: Georgia, "Times New Roman", Times, serif; - font-size: 18px; - display: block; - height: 60px; - overflow: hidden; -} - -#planetnews .hidden { - display: none; +#planetnews { + ul { + list-style: none; + margin: 0; + padding: 0; + } + + li { + width: 17%; + margin: 1%; + float: left; + + a { + display: block; + padding: .5em; + background: #ddd; + height: 6em; + overflow: hidden; + } + + .post { + font-family: $fonts-news; + font-size: 18px; + display: block; + height: 60px; + overflow: hidden; + } + } + + cite { + font-size: 11px; + } + + .hidden { + display: none; + } } .readmore { @@ -125,43 +132,43 @@ a:hover { } body { - background: #f9fcfe; - color: #000; + background: $background-color; + color: $font-color-normal; margin: 0; padding: 0; } body, td { - font: 13px "Lucida Grande", "Lucida Sans Unicode", Tahoma, Verdana; + font: 13px $fonts-main; } fieldset { border: none; padding: 3px; -} -fieldset label.selectit { - display: block; - font-size: 11px; - padding: 0 2px; -} + label.selectit { + display: block; + font-size: 11px; + padding: 0 2px; -fieldset label.selectit:hover { - background: #e9e9e9; -} + &:hover { + background: #e9e9e9; + } + } -fieldset legend { - padding: .1em .3em; -} + legend { + padding: .1em .3em; + } -fieldset.options { - padding: 1em; -} + &.options { + padding: 1em; -fieldset.options legend { - font-size: 1.5em; - font-weight: bold; - font-family: Georgia, "Times New Roman", Times, serif; + legend { + font-size: 1.5em; + font-weight: bold; + font-family: $fonts-news; + } + } } form, label input { @@ -198,10 +205,10 @@ p, li, dl, dd, dt { } textarea, input, select { - background: #f4f4f4; - border: 1px solid #b2b2b2; - color: #000; - font: 13px Verdana, Arial, Helvetica, sans-serif; + background: $input-background; + border: 1px solid $input-border; + color: $font-color-normal; + font: 13px $fonts-input; margin: 1px; padding: 3px; } @@ -283,7 +290,7 @@ form#upload #post_content { } .code { - font-family: "Courier New", Courier, monospace; + font-family: $fonts-code; } .commentlist li { @@ -325,24 +332,24 @@ form#upload #post_content { .quicktags, .search { background: #ccc; - color: #000; - font: 12px Georgia, "Times New Roman", Times, serif; + color: $font-color-normal; + font: 12px $fonts-news; } .submit input, .submit input:focus, .button, .button:focus { background: url( images/fade-butt.png ); - border: 3px double #999; - border-left-color: #ccc; - border-top-color: #ccc; - color: #333; + border: 3px double $button-down-border; + border-left-color: $button-normal-border; + border-top-color: $button-normal-border; + color: $button-label; padding: 0.25em; } .submit input:active, .button:active { - background: #f4f4f4; - border: 3px double #ccc; - border-left-color: #999; - border-top-color: #999; + background: $input-background; + border: 3px double $button-normal-border; + border-left-color: $button-down-border; + border-top-color: $button-down-border; } .button, .button:focus { @@ -466,7 +473,7 @@ input.disabled, textarea.disabled { } #adminmenu a { - color: #000; + color: $font-color-normal; font-size: 14px; font-weight: normal; margin: 0; @@ -506,7 +513,7 @@ input.disabled, textarea.disabled { } #submenu .current { - background: #f9fcfe; + background: $background-color; border-top: 1px solid #045290; border-right: 2px solid #045290; color: #000; @@ -619,7 +626,7 @@ input.delete:hover { } #quicktags #ed_code { - font-family: "Courier New", Courier, mono; + font-family: $fonts-code; margin-bottom: 3px; } @@ -697,11 +704,11 @@ input.delete:hover { text-align: center; } -#login p { +#login p { font-size: 12px; } -#login p.message { +#login p.message { width: 310px; margin: 0 auto 1em; } @@ -773,12 +780,12 @@ input.delete:hover { width: 97%; } -#login p label { +#login p label { font-size: 11px; } #login input#rememberme { - background-color: 0e3757; + background-color: #0e3757; } #login #submit { @@ -846,7 +853,7 @@ input.delete:hover { } #template textarea { - font: small 'Courier New', Courier, monospace; + font: small $fonts-code; width: 97%; } @@ -893,7 +900,7 @@ input.delete:hover { font-weight: normal; letter-spacing: -.05em; margin: 0; - font-family: Georgia, "Times New Roman", Times, serif + font-family: $fonts-news; } #wphead h1 span { @@ -1098,7 +1105,7 @@ overall, dbx-box is best left as visually unstyled as possible } #your-profile legend { - font-family: Georgia, "Times New Roman", Times, serif; + font-family: $fonts-news; font-size: 22px; } @@ -1336,6 +1343,6 @@ a.page-numbers:hover { margin: 0 6px; } -ul.historic { +ul.historic { margin-bottom: 1em; -} \ No newline at end of file +}