diff options
author | Thomas Lange <code@nerdmind.de> | 2021-07-14 16:42:16 +0200 |
---|---|---|
committer | Thomas Lange <code@nerdmind.de> | 2021-07-14 17:28:11 +0200 |
commit | 01cbd757d69668b39c1b072b0449b77e6e2bee8d (patch) | |
tree | 3bb22c5a3d21543a69a03e0e03d7fc864878e19a /theme | |
parent | a4242144eebc101bc1e5ec150a80312e30d0112f (diff) | |
download | blog-01cbd757d69668b39c1b072b0449b77e6e2bee8d.tar.gz blog-01cbd757d69668b39c1b072b0449b77e6e2bee8d.tar.xz blog-01cbd757d69668b39c1b072b0449b77e6e2bee8d.zip |
Do some minor optimizations on the admin theme
* Add noisy background images
* Rename SCSS/CSS file "main" to "bright"
* Remove uppercase text-transform for headings
* Replace hardcoded font sizes with SCSS variables
* Decrease font size for category link in post item template
* Move right-floated ID before the heading in the HTML markup to ensure
it does not moves to the second line if the heading text is too wide.
Diffstat (limited to 'theme')
-rw-r--r-- | theme/admin/html/category/item.php | 2 | ||||
-rw-r--r-- | theme/admin/html/main.php | 2 | ||||
-rw-r--r-- | theme/admin/html/page/item.php | 2 | ||||
-rw-r--r-- | theme/admin/html/post/item.php | 2 | ||||
-rw-r--r-- | theme/admin/html/user/item.php | 2 | ||||
-rw-r--r-- | theme/admin/rsrc/css/bright.css (renamed from theme/admin/rsrc/css/main.css) | 10 | ||||
-rw-r--r-- | theme/admin/rsrc/css/bright.scss (renamed from theme/admin/rsrc/css/main.scss) | 2 | ||||
-rw-r--r-- | theme/admin/rsrc/css/dark.css | 10 | ||||
-rw-r--r-- | theme/admin/rsrc/css/dark.scss | 2 | ||||
-rw-r--r-- | theme/admin/rsrc/css/import/_styles.scss | 16 | ||||
-rw-r--r-- | theme/admin/rsrc/img/noise-bright.png | bin | 0 -> 9237 bytes | |||
-rw-r--r-- | theme/admin/rsrc/img/noise-dark.png | bin | 0 -> 6557 bytes |
12 files changed, 25 insertions, 25 deletions
diff --git a/theme/admin/html/category/item.php b/theme/admin/html/category/item.php index 710253c..0c6d243 100644 --- a/theme/admin/html/category/item.php +++ b/theme/admin/html/category/item.php @@ -1,8 +1,8 @@ <article class="item"> <header> <h2> - <i class="fa fa-tag"></i><?=escapeHTML($CATEGORY['ATTR']['NAME'])?> <span class="item-id">#<?=$CATEGORY['ATTR']['ID']?></span> + <i class="fa fa-tag"></i><?=escapeHTML($CATEGORY['ATTR']['NAME'])?> </h2> <ul class="item-meta"> <li> diff --git a/theme/admin/html/main.php b/theme/admin/html/main.php index a0a1412..82dd407 100644 --- a/theme/admin/html/main.php +++ b/theme/admin/html/main.php @@ -11,7 +11,7 @@ if($toogle = HTTP::GET('colors')) { } } -$theme = isset($_COOKIE['dark_mode']) ? 'dark' : 'main'; +$theme = isset($_COOKIE['dark_mode']) ? 'dark' : 'bright'; ?> <!DOCTYPE html> <html lang="<?=$BLOGMETA['LANG']?>"> diff --git a/theme/admin/html/page/item.php b/theme/admin/html/page/item.php index 018286e..6e394bb 100644 --- a/theme/admin/html/page/item.php +++ b/theme/admin/html/page/item.php @@ -1,8 +1,8 @@ <article class="item"> <header> <h2> - <i class="fa fa-file-text-o"></i><?=escapeHTML($PAGE['ATTR']['NAME'])?> <span class="item-id">#<?=$PAGE['ATTR']['ID']?></span> + <i class="fa fa-file-text-o"></i><?=escapeHTML($PAGE['ATTR']['NAME'])?> </h2> <ul class="item-meta"> <li> diff --git a/theme/admin/html/post/item.php b/theme/admin/html/post/item.php index 5261bdb..e4b2bec 100644 --- a/theme/admin/html/post/item.php +++ b/theme/admin/html/post/item.php @@ -1,8 +1,8 @@ <article class="item"> <header> <h2> - <i class="fa fa-newspaper-o"></i><?=escapeHTML($POST['ATTR']['NAME'])?> <span class="item-id">#<?=$POST['ATTR']['ID']?></span> + <i class="fa fa-newspaper-o"></i><?=escapeHTML($POST['ATTR']['NAME'])?> </h2> <ul class="item-meta"> <li> diff --git a/theme/admin/html/user/item.php b/theme/admin/html/user/item.php index 9a5a83e..3a9ecb6 100644 --- a/theme/admin/html/user/item.php +++ b/theme/admin/html/user/item.php @@ -1,8 +1,8 @@ <article class="item"> <header> <h2> - <i class="fa fa-user"></i><?=escapeHTML($USER['ATTR']['FULLNAME'])?> <span class="item-id">#<?=$USER['ATTR']['ID']?></span> + <i class="fa fa-user"></i><?=escapeHTML($USER['ATTR']['FULLNAME'])?> </h2> <ul class="item-meta"> <li> diff --git a/theme/admin/rsrc/css/main.css b/theme/admin/rsrc/css/bright.css index 95fce4b..3525c89 100644 --- a/theme/admin/rsrc/css/main.css +++ b/theme/admin/rsrc/css/bright.css @@ -65,7 +65,6 @@ a:focus { ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ h1, h2, h3 { margin-bottom: 0; - text-transform: uppercase; } h1 + p, h2 + p, h3 + p { margin-top: 0; @@ -98,7 +97,7 @@ html, body { html { font-size: 1.25rem; color: #333; - background: #DDD; + background: url("../img/noise-bright.png") #DDD; -webkit-hyphens: auto; word-break: break-word; hyphens: auto; @@ -431,15 +430,16 @@ img { padding: 0; list-style: none; } -.item-meta-right { - float: right; -} .item-meta li { display: inline-block; } .item-meta li + li:before { content: " – "; } +.item-meta li.item-meta-right { + float: right; + font-size: 0.6rem; +} .item-meta li.item-meta-right:before { content: none; } diff --git a/theme/admin/rsrc/css/main.scss b/theme/admin/rsrc/css/bright.scss index a3ae746..8173497 100644 --- a/theme/admin/rsrc/css/main.scss +++ b/theme/admin/rsrc/css/bright.scss @@ -1,7 +1,7 @@ /*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ # Content background and border color ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ -$htmlBackgroundColor: #DDD; +$htmlBackground: url("../img/noise-bright.png") #DDD; $backgroundColor: #FFF; $backgroundColorEmphasize: #EEE; $borderColor: #AAA; diff --git a/theme/admin/rsrc/css/dark.css b/theme/admin/rsrc/css/dark.css index ece8bba..d7ac53d 100644 --- a/theme/admin/rsrc/css/dark.css +++ b/theme/admin/rsrc/css/dark.css @@ -65,7 +65,6 @@ a:focus { ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ h1, h2, h3 { margin-bottom: 0; - text-transform: uppercase; } h1 + p, h2 + p, h3 + p { margin-top: 0; @@ -98,7 +97,7 @@ html, body { html { font-size: 1.25rem; color: #9DAAB7; - background: #4D535B; + background: url("../img/noise-dark.png") #3D434B; -webkit-hyphens: auto; word-break: break-word; hyphens: auto; @@ -431,15 +430,16 @@ img { padding: 0; list-style: none; } -.item-meta-right { - float: right; -} .item-meta li { display: inline-block; } .item-meta li + li:before { content: " – "; } +.item-meta li.item-meta-right { + float: right; + font-size: 0.6rem; +} .item-meta li.item-meta-right:before { content: none; } diff --git a/theme/admin/rsrc/css/dark.scss b/theme/admin/rsrc/css/dark.scss index 4388715..e75e280 100644 --- a/theme/admin/rsrc/css/dark.scss +++ b/theme/admin/rsrc/css/dark.scss @@ -1,7 +1,7 @@ /*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ # Content background and border color ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ -$htmlBackgroundColor: #4D535B; +$htmlBackground: url("../img/noise-dark.png") #3D434B; $backgroundColorEmphasize: #32373E; $backgroundColor: #3D434B; $borderColor: #1D232B; diff --git a/theme/admin/rsrc/css/import/_styles.scss b/theme/admin/rsrc/css/import/_styles.scss index 88ef8b4..1cac455 100644 --- a/theme/admin/rsrc/css/import/_styles.scss +++ b/theme/admin/rsrc/css/import/_styles.scss @@ -28,7 +28,6 @@ a { ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ h1, h2, h3 { margin-bottom: 0; - text-transform: uppercase; +p { margin-top: 0; @@ -63,7 +62,7 @@ html, body { html { font-size: 1.25rem; color: $textColor; - background: $htmlBackgroundColor; + background: $htmlBackground; -webkit-hyphens: auto; word-break: break-word; hyphens: auto; @@ -432,7 +431,7 @@ img { &-id { float: right; color: $textColorLight; - font-size: 0.7rem; + font-size: $fontSize; font-weight: normal; } @@ -441,10 +440,6 @@ img { padding: 0; list-style: none; - &-right { - float: right; - } - li { display: inline-block; @@ -452,6 +447,11 @@ img { content: " – "; } + &.item-meta-right { + float: right; + font-size: $fontSizeSmall; + } + &.item-meta-right:before { content: none; } @@ -640,7 +640,7 @@ input, select, textarea { background: $backgroundColorEmphasize; color: $textColorLight; font-family: inherit; - font-size: 0.7rem; + font-size: $fontSize; padding: 0.25rem; border: 0.05rem solid $borderColor; box-sizing: border-box; diff --git a/theme/admin/rsrc/img/noise-bright.png b/theme/admin/rsrc/img/noise-bright.png Binary files differnew file mode 100644 index 0000000..a9356b3 --- /dev/null +++ b/theme/admin/rsrc/img/noise-bright.png diff --git a/theme/admin/rsrc/img/noise-dark.png b/theme/admin/rsrc/img/noise-dark.png Binary files differnew file mode 100644 index 0000000..f0ddc0d --- /dev/null +++ b/theme/admin/rsrc/img/noise-dark.png |