Color Adjustments

The colors just needed to be tweaked a bit for the sake on better
contrast and readability.

Still some trouble spots but will adjust as needed
This commit is contained in:
ro 2024-03-21 14:51:24 -06:00
parent 82984635b5
commit 8794ffc715
No known key found for this signature in database
GPG key ID: 29B551CDBD4D3B50
15 changed files with 38 additions and 41 deletions

View file

@ -2,8 +2,8 @@
:root {
--primary: #1d3040;
--secondary: #fc6399;
--tertiary: #f5ab35;
--highlight: #63fcc6ff;
--primary-highlight: #f5ab35;
--secondary-highlight: #63fcc6ff;
--white: #ebe5d4;
--black: #32302f;
}

View file

@ -29,7 +29,7 @@ a {
}
a:hover {
border-bottom: 1px solid var(--highlight);
border-bottom: 1px solid var(--secondary-highlight);
}
sup {
@ -42,7 +42,7 @@ sup {
pre,
code {
background: var(--black);
color: var(--highlight);
color: var(--secondary-highlight);
border-radius: 3px;
padding: 3px;
}
@ -171,7 +171,7 @@ main > section[role="page-meta"] > div a {
/* FOOTER */
footer {
background: var(--highlight);
background: var(--secondary-highlight);
padding: 30px 15%;
color: var(--primary);
}
@ -188,7 +188,7 @@ footer {
}
footer {
background: var(--highlight);
background: var(--secondary-highlight);
padding: 30px 10%;
}
}

View file

@ -80,7 +80,7 @@ section[role="book-index-pages"] hr {
section[role="book-index-pages"] button[data-active="true"] {
background: var(--primary);
color: var(--tertiary);
color: var(--primary-highlight);
}
section[role="book-index-pages"] button[data-active="false"] {
@ -91,7 +91,7 @@ section[role="book-index-pages"] > div[role="paginate"] {
width: fit-content;
margin: 0 auto;
font-size: 1.5em;
color: var(--highlight);
color: var(--secondary-highlight);
}
section[role="book-index-pages"] > div[role="paginate"] i {

View file

@ -1,9 +1,9 @@
:root {
/* BASE COLORS */
--primary: #1d3040;
--secondary: #b2cce5;
--tertiary: #f5ab35;
--highlight: #fc6399;
--secondary: #f3ebd2;
--primary-highlight: #f5ab35;
--secondary-highlight: #b54b6f;
--white: #efebe3;
--grey: #abb7b7;
--black: #32302f;

View file

@ -3,7 +3,7 @@ a {
}
p {
background: var(--tertiary);
background: var(--primary-highlight);
color: var(--primary);
padding: 5px;
display: block;
@ -18,7 +18,7 @@ input[type="text"] {
border-radius: 5px;
font: 18px var(--base-type);
display: inline-block;
background: var(--white);
background: var(--secondary);
color: var(--primary);
}
@ -26,12 +26,12 @@ textarea {
border: 0;
border-radius: 3px;
color: var(--primary);
background: var(--white);
background: var(--secondary);
}
button,
input[type="submit"] {
background: var(--highlight);
background: var(--secondary-highlight);
color: var(--primary);
font: 20px var(--base-type);
border-radius: 5px;

View file

@ -32,7 +32,7 @@ sup {
}
::selection {
background: var(--highlight);
background: var(--secondary-highlight);
color: var(--white);
}
@ -44,14 +44,14 @@ sup {
pre,
code {
background: var(--black);
color: var(--highlight);
color: var(--secondary-highlight);
border-radius: 3px;
padding: 3px;
}
svg[role="icon"] {
transition: all 0.3s linear;
fill: var(--white);
fill: var(--secondary);
width: 25px;
height: 25px;
padding-top: 5px;
@ -129,11 +129,11 @@ button[data-render="true"] {
}
button[data-render="true"] svg {
fill: var(--highlight);
fill: var(--primary-highlight);
}
button[data-render="false"] svg {
fill: var(--white);
fill: var(--secondary);
}
/* RESPONSIVE */

View file

@ -81,7 +81,7 @@ button[data-active="false"] svg {
}
button[data-active="true"] svg {
fill: var(--highlight);
fill: var(--primary-highlight);
}
section[class="index-recent-pages"] aside {

View file

@ -38,7 +38,7 @@ section.login form a {
width: 10%;
height: 20px;
display: inline-block;
background: var(--tertiary);
background: var(--primary-highlight);
vertical-align: top;
text-align: center;
margin: 0 0 0 10px;

View file

@ -9,7 +9,7 @@ article[role="navigation"] > section > div.nav-item {
width: 98%;
background: var(--white);
border-radius: 3px;
color: var(--highlight);
color: var(--secondary-highlight);
margin: 0 0 10px;
font-size: 1.5em;
cursor: move;

View file

@ -4,7 +4,7 @@ header > nav.top-nav {
grid-template-columns: 50px auto auto;
height: 100%;
position: relative;
background: var(--white);
background: var(--secondary);
border-radius: 3px;
transform-style: preserve-3d;
transform-origin: 100% 50%;

View file

@ -1,7 +1,7 @@
/* FILE MANAGER */
main > section[role="file-manager"] {
width: 100%;
background: var(--tertiary);
background: var(--primary-highlight);
padding: 20px 0;
margin-top: 75px;
}
@ -153,7 +153,7 @@ main
main > section[role="page-meta"] {
width: 100%;
background: var(--highlight);
background: var(--secondary-highlight);
}
main > section[role="page-meta"] > div[role="page-meta-wrapper"] {
@ -162,12 +162,11 @@ main > section[role="page-meta"] > div[role="page-meta-wrapper"] {
gap: 20px;
width: 100%;
max-width: 900px;
margin: 10px auto;
color: var(--white);
margin: 0 auto;
color: var(--secondary);
}
main section[role="page-meta"] textarea#post-title-text {
background: var(--white);
font-family: var(--base-type);
width: 100%;
height: 80px;
@ -176,7 +175,6 @@ main section[role="page-meta"] textarea#post-title-text {
}
main section[role="page-meta"] textarea#post-tags {
background: var(--white);
font-family: var(--base-type);
width: 100%;
height: 80px;
@ -244,7 +242,7 @@ main
main > section[role="text-editor"] {
width: 100%;
max-width: 900px;
margin: 0 auto;
margin: 10px auto;
}
main section[role="text-editor"] .icon-hide {
@ -274,7 +272,7 @@ main > section[role="text-editor"] > div[role="edit-post-wrapper"] {
main > section[role="text-editor"] > div[role="edit-post-wrapper"] textarea:focus {
outline: none;
border-color: var(--highlight);
border-color: var(--secondary-highlight);
}
main section[role="text-editor"] div[role="edit-post-wrapper"] #edit,
@ -307,7 +305,7 @@ main > section[role="text-editor"] > div[role="edit-post-wrapper"] > #edit {
z-index: 1;
background: transparent;
color: transparent;
caret-color: var(--highlight);
caret-color: var(--secondary-highlight);
}
main > section[role="text-editor"] > div[role="edit-post-wrapper"] > #highlight {

View file

@ -47,7 +47,7 @@ section[class="member-settings"] > div:nth-child(4) {
section[class="member-settings"] > div:nth-child(4) a {
font-weight: bold;
text-decoration: underline;
color: var(--tertiary);
color: var(--primary-highlight);
}
section[class="member-settings"] > div:nth-child(5) {
@ -122,7 +122,7 @@ section[class="member-settings"]
> div[class="theme"]
button[data-enabled="true"] {
color: var(--white);
background: var(--highlight);
background: var(--secondary-highlight);
display: block;
border-radius: 3px;
padding: 3px;
@ -148,9 +148,9 @@ section[class="member-settings"] > div[class="mail"] a {
}
section[class="member-settings"] > div[class="mail"] a[data-enabled="true"] {
color: var(--tertiary);
color: var(--primary-highlight);
font-weight: bold;
border-top: var(--highlight) 1px solid;
border-top: var(--secondary-highlight) 1px solid;
}
section[class="member-settings"] > div[class="mail"] div[data-enabled="false"] {

View file

@ -51,7 +51,7 @@
</a>
@else
<a href="/dashboard/page/edit/{{ $page['uuid'] }}" id="{{ $page['uuid'] }}" class="page-link">
<div class="page-bg" style="background: url({{ $file }}) no-repeat center center / cover #fc6399">
<div class="page-bg" style="background: url({{ $file }}) no-repeat center center / cover #b54b6f">
<div id="meta">
@include('includes.recent-meta')
</div>

View file

@ -137,8 +137,7 @@
</div>
@endif
</section>
<section role="page-meta">
</section><section role="page-meta">
<div role="page-meta-wrapper">
<div role="page-title">
<strong>TITLE</strong>

View file

@ -27,7 +27,7 @@
</video>
</a>
@else
<a href="/dashboard/page/edit/{{ $page['uuid'] }}" id="{{ $page['uuid'] }}" class="post-link recent-link" style="background: url({{ $file }}) no-repeat center center / cover #fc6399">
<a href="/dashboard/page/edit/{{ $page['uuid'] }}" id="{{ $page['uuid'] }}" class="post-link recent-link" style="background: url({{ $file }}) no-repeat center center / cover #b54b6f">
@include('includes.recent-meta')
</a>
@endif