Compare commits

...

2 Commits

Author SHA1 Message Date
Fred Boniface 9fe57fce90 Color adjustment 2023-10-05 15:17:30 +01:00
Fred Boniface 1b04a28212 Add box-shadows 2023-10-05 14:51:34 +01:00
10 changed files with 41 additions and 17 deletions

View File

@ -14,5 +14,6 @@
-ms-transform: rotate(45deg); -ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
box-shadow: 1px 1px 5px rgba(0,0,0,0.39);
} }
</style> </style>

View File

@ -4,13 +4,14 @@
<style> <style>
.card-container { .card-container {
background-color: var(--main-text-color); background-color: var(--second-txt-color);
width: 90%; width: 90%;
height: auto; height: auto;
margin: auto; margin: auto;
padding: 10px 5px 10px 5px; padding: 10px 5px 10px 5px;
border-radius: 10px; border-radius: 0px;
margin-top: 5px; margin-top: 10px;
margin-bottom: 5px; margin-bottom: 5px;
box-shadow: 1px 1px 5px rgba(0,0,0,0.19);
} }
</style> </style>

View File

@ -24,7 +24,7 @@
<style> <style>
a { a {
text-decoration: none; text-decoration: none;
color: var(--dark-text-color); color: var(--second-bg-color);
} }
.tag-container { .tag-container {

View File

@ -16,6 +16,6 @@
<style> <style>
a { a {
text-decoration: none; text-decoration: none;
color: var(--dark-text-color); color: var(--second-bg-color);
} }
</style> </style>

View File

@ -34,7 +34,7 @@
<style> <style>
.message { .message {
color: var(--light-text-color); color: var(--second-bg-color);
} }
.tag-box { .tag-box {

View File

@ -1,4 +1,4 @@
:root { /*:root {
--main-bg-color: lightslategrey; --main-bg-color: lightslategrey;
--accent-color: rgb(234, 255, 97); --accent-color: rgb(234, 255, 97);
--accent-rollover: yellow; --accent-rollover: yellow;
@ -8,6 +8,22 @@
--dark-text-color: rgb(56, 56, 7); --dark-text-color: rgb(56, 56, 7);
--link-color: cyan; --link-color: cyan;
--link-visited-color: rgb(189, 0, 189); --link-visited-color: rgb(189, 0, 189);
}*/
:root {
--accent-bg-color: #271c19;
--accent-heading-color: #fffffe;
--accent-txt-color: #fff3ec;
--accent-link-color: #9656a1;
--second-bg-color: #55423d;
--second-heading-color: #fffffe;
--second-txt-color: #fff3ec;
--second-link-color: #9656a1;
--main-bg-color: #ffc0ad;
--main-heading-color: #271c19;
--main-txt-color: #271c19;
--main-link-color: #9656a1;
} }
@font-face { @font-face {

View File

@ -19,7 +19,9 @@
padding: 0px; padding: 0px;
padding-bottom: 5px; padding-bottom: 5px;
text-align: center; text-align: center;
background-color: var(--accent-color); background-color: var(--second-bg-color);
box-shadow: 0px 3px 2px rgba(0,0,0,0.19);
color: var(--second-txt-color);
} }
h1 { h1 {

View File

@ -39,20 +39,20 @@
height: 42px; height: 42px;
margin: 0; margin: 0;
padding: 0; padding: 0;
background-color: var(--accent-color); background-color: var(--second-bg-color);
} }
nav a { nav a {
float: left; float: left;
display: block; display: block;
color: var(--dark-text-color); color: var(--second-txt-color);
text-align: center; text-align: center;
padding: 10px 15px; padding: 10px 15px;
margin-right: 1px; margin-right: 1px;
text-decoration: none; text-decoration: none;
font-size: 18px; font-size: 18px;
font-family: caprasimo; font-family: caprasimo;
font-weight: bolder; font-weight: normal;
} }
nav a:hover { nav a:hover {

View File

@ -9,15 +9,17 @@
<style> <style>
.tag-link { .tag-link {
text-decoration: none; text-decoration: none;
color: var(--dark-text-color); color: var(--second-txt-color);
padding: 3px 5px 3px 5px; padding: 3px 5px 3px 5px;
margin: 10px; margin: 10px;
background-color: var(--accent-color); background-color: var(--main-link-color);
border-radius: 5px; border-radius: 5px;
box-shadow: 1px 1px 2px rgba(0,0,0,0.19);
} }
.tag-link:hover, .tag-link:hover,
.tag-link:active { .tag-link:active {
background-color: var(--accent-rollover); /*background-color: var(--accent-rollover);*/
box-shadow: 1px 1px 1px rgba(0,0,0,0.19) inset;
} }
</style> </style>

View File

@ -54,17 +54,17 @@
flex-direction: column; /* Start with column layout for mobile */ flex-direction: column; /* Start with column layout for mobile */
align-items: center; align-items: center;
width: 100%; width: 100%;
background-color: var(--main-text-color); background-color: var(--second-txt-color);
color: var(--main-bg-color); color: var(--second-bg-color);
margin: 0; /* Reset margin to ensure full width */ margin: 0; /* Reset margin to ensure full width */
padding: 0; /* Reset padding to ensure full width */ padding: 0; /* Reset padding to ensure full width */
box-sizing: border-box; /* Include padding and border in width calculation */ box-sizing: border-box; /* Include padding and border in width calculation */
box-shadow: 0px 3px 2px rgba(0,0,0,0.19);
} }
#header-text { #header-text {
flex: 1; flex: 1;
max-width: 100%; max-width: 100%;
color: #2b2b2b;
margin: 0; margin: 0;
text-align: center; text-align: center;
} }
@ -92,6 +92,7 @@
border: none; border: none;
max-height: 150px; max-height: 150px;
height: 30vw; height: 30vw;
box-shadow: 1px 1px 5px rgba(0,0,0,0.19);
} }
/* Media query for larger screens */ /* Media query for larger screens */
@ -145,5 +146,6 @@
h1 { h1 {
font-family: caprasimo; font-family: caprasimo;
font-weight: normal;
} }
</style> </style>