Optimalisatie structuur van stylesheets en opmaak iconen
This commit is contained in:
parent
d783d6c763
commit
5326fe77f4
19
themes/nluug/assets/scss/_colors.scss
Normal file
19
themes/nluug/assets/scss/_colors.scss
Normal 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;
|
||||||
|
|
|
@ -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%;
|
||||||
}
|
}
|
||||||
|
|
29
themes/nluug/assets/scss/styles_images.scss
Normal file
29
themes/nluug/assets/scss/styles_images.scss
Normal 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;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
Reference in a new issue