aboutsummaryrefslogtreecommitdiffstats
path: root/theme
diff options
context:
space:
mode:
authorThomas Lange <code@nerdmind.de>2021-07-14 16:42:16 +0200
committerThomas Lange <code@nerdmind.de>2021-07-14 17:28:11 +0200
commit01cbd757d69668b39c1b072b0449b77e6e2bee8d (patch)
tree3bb22c5a3d21543a69a03e0e03d7fc864878e19a /theme
parenta4242144eebc101bc1e5ec150a80312e30d0112f (diff)
downloadblog-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.php2
-rw-r--r--theme/admin/html/main.php2
-rw-r--r--theme/admin/html/page/item.php2
-rw-r--r--theme/admin/html/post/item.php2
-rw-r--r--theme/admin/html/user/item.php2
-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.css10
-rw-r--r--theme/admin/rsrc/css/dark.scss2
-rw-r--r--theme/admin/rsrc/css/import/_styles.scss16
-rw-r--r--theme/admin/rsrc/img/noise-bright.pngbin0 -> 9237 bytes
-rw-r--r--theme/admin/rsrc/img/noise-dark.pngbin0 -> 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
new file mode 100644
index 0000000..a9356b3
--- /dev/null
+++ b/theme/admin/rsrc/img/noise-bright.png
Binary files differ
diff --git a/theme/admin/rsrc/img/noise-dark.png b/theme/admin/rsrc/img/noise-dark.png
new file mode 100644
index 0000000..f0ddc0d
--- /dev/null
+++ b/theme/admin/rsrc/img/noise-dark.png
Binary files differ
generated by cgit v1.2.3 (git 2.25.1) at 2024-04-30 07:25:48 +0000