Moving some CSS to their own files

This commit is contained in:
Michael Boelen 2024-11-19 10:17:02 +00:00
parent bbcb85caa7
commit f30d9551f3
2 changed files with 84 additions and 0 deletions

View file

@ -0,0 +1,17 @@
// Highlight-box om bijvoorbeeld onze evenementen opvallend op homepage te laten zien
.highlight-box {
border-radius: 5px;
margin: 2px;
padding: 20px;
}
// Events voor alleen NLUUG-leden krijgen een andere kleur dan events in samenwerking met of die extra aandacht nodig hebben.
.highlight-box-nluug {
background-color: $color-highlight-box-nluug-background;
border: 1px solid $color-highlight-box-nluug-border;
}
.highlight-box-other {
background-color: $color-highlight-box-other-background;
border: 1px solid $color-highlight-box-other-border;
}

View file

@ -0,0 +1,67 @@
.link {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-decoration: none;
}
a.button:link, a.button:visited {
background-color: $color-button;
border-radius: 4px;
color: white;
padding: 14px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
}
a.button:hover, a.button:active {
background-color: $color-button-hover;
}
// Button
.btn:link, .btn:visited {
border-radius: 4px;
color: white;
padding: 14px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
}
// Button voor call-to-action, <a href="#" class="btn btn-cta">#</a>
.btn-cta:link, .btn-cta:visited {
background-color: $color-button-call-to-action;
}
.btn-cta:hover, .btn-cta:active {
background-color: $color-button-call-to-action-hover;
}
// Button voor call-to-action, tweede kleurstelling
.btn-cta2:link, .btn-cta2:visited {
background-color: $color-button-call-to-action2;
font-weight: bold;
}
.btn-cta2:hover, .btn-cta2:active {
background-color: $color-button-call-to-action2-hover;
}
a,
a:visited {
color: inherit;
}
a:hover,
a.heading-link {
color: inherit;
text-decoration: underline;
}
a.event {
color: $magenta-dark;
font-weight: bold;
text-decoration: none;
}