6
0
Fork 0

Optimalisatie structuur van stylesheets en opmaak iconen

This commit is contained in:
Michael Boelen 2023-05-22 10:53:03 +02:00
parent d783d6c763
commit 5326fe77f4
3 changed files with 48 additions and 45 deletions

View file

@ -0,0 +1,19 @@
// purple: #6A2060
// light purple-grey: #DCC9DB
// darkblue: #1D3160
$color-button: #1D3160;
$color-button-hover: #17274d;
$color-button-call-to-action: #138808;
$color-button-call-to-action-hover: #0F6D06; // %25 donkerder dan #138808 met encycolorpedia
$color-header: #6A2060;
$color-highlight-box-other-border: #99AFE2;
$color-highlight-box-other-background: #E3E9F7;
$color-highlight-box-nluug-border: #6A2060;
$color-highlight-box-nluug-background: #EBBCE5; // omgezet naar lichtere kleur via https://encycolorpedia.com/6a2060
$color-border: #6A2060;
$color-text-inverse: white;
$color-tags-background: #6A2060;
$color-tags-text: white;

View file

@ -1,23 +1,3 @@
// purple: #6A2060
// light purple-grey: #DCC9DB
// darkblue: #1D3160
$color-button: #1D3160;
$color-button-hover: #17274d;
$color-button-call-to-action: #138808;
$color-button-call-to-action-hover: #0F6D06; // %25 donkerder dan #138808 met encycolorpedia
$color-header: #6A2060;
$color-highlight-box-other-border: #99AFE2;
$color-highlight-box-other-background: #E3E9F7;
$color-highlight-box-nluug-border: #6A2060;
$color-highlight-box-nluug-background: #EBBCE5; // omgezet naar lichtere kleur via https://encycolorpedia.com/6a2060
$color-border: #6A2060;
$color-text-inverse: white;
$color-tags-background: #6A2060;
$color-tags-text: white;
*, :after, :before { *, :after, :before {
box-sizing: border-box; box-sizing: border-box;
padding: 0; padding: 0;
@ -128,22 +108,6 @@ a.button:hover, a.button:active {
background-color: $color-button-hover; background-color: $color-button-hover;
} }
.icon {
margin: 3px;
}
.icon:link {
text-decoration: none;
}
.icon:visited {
text-decoration: none;
}
.icon:hover {
text-decoration: none;
}
.icon:active {
text-decoration: none;
}
// Button // Button
.btn:link, .btn:visited { .btn:link, .btn:visited {
border-radius: 4px; border-radius: 4px;
@ -265,15 +229,6 @@ ul, ol {
margin: 1rem; margin: 1rem;
} }
img {
max-width: 100%;
height: auto;
}
img.shownormal {
max-width: initial;
}
.post-date { .post-date {
margin: 5% 0 5%; margin: 5% 0 5%;
} }

View file

@ -0,0 +1,29 @@
img {
max-width: 100%;
height: auto;
}
img.shownormal {
max-width: initial;
}
.icon {
filter: invert(18%) sepia(32%) saturate(1326%) hue-rotate(183deg) brightness(93%) contrast(95%);
margin: 3px;
}
.icon:link {
text-decoration: none;
}
.icon:visited {
text-decoration: none;
}
.icon:hover {
filter: invert(0%) sepia(0%) saturate(7500%) hue-rotate(338deg) brightness(106%) contrast(109%);
text-decoration: none;
}
.icon:active {
text-decoration: none;
}