ViMaSter/hackertours-theme
Watch
0
0
Fork
You've already forked hackertours-theme
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implement new css.Build.

Browse source
This commit is contained in:
Fredrik Jonsson 2026-04-08 11:17:24 +02:00
commit d984bcaf5d
1 changed files with 1681 additions and 1695 deletions
Download patch file Download diff file Expand all files Collapse all files

88
assets/css/components/_box.css
View file

@ -1,66 +1,64 @@
/* Box */
@layer components {
.box {
/* Add vertical rhythm margins. */
margin-block: var(--spacing-m);
padding: var(--spacing-xs);
border: 5px solid var(--color-border);
.box {
/* Add vertical rhythm margins. */
margin-block: var(--spacing-m);
padding: var(--spacing-xs);
border: 5px solid var(--color-border);
.box__title,
.title {
.box__title,
.title {
margin-block-start: 0;
}
& > * {
&:first-child {
margin-block-start: 0;
}
& > * {
&:first-child {
margin-block-start: 0;
}
&:last-child {
margin-block-end: 0;
}
&:last-child {
margin-block-end: 0;
}
}
}
.box--highlight {
border-color: var(--color-highlight);
}
.box--highlight {
border-color: var(--color-highlight);
}
.box--fit {
width: fit-content;
}
.box--fit {
width: fit-content;
}
.box--gutter {
padding-inline: var(--gutters);
}
.box--gutter {
padding-inline: var(--gutters);
}
.box--inverted {
background: var(--color-border);
color: var(--color-text-bg);
.box--inverted {
background: var(--color-border);
/* Make sure headings etc. also gets inverted. */
* {
color: var(--color-text-bg);
}
/* Make sure headings etc. also gets inverted. */
* {
color: var(--color-text-bg);
a {
&:link {
color: var(--color-link-inverted);
}
a {
&:link {
color: var(--color-link-inverted);
}
&:visited {
color: var(--color-link-visited-inverted);
}
&:visited {
color: var(--color-link-visited-inverted);
}
&:hover,
&:focus {
color: var(--color-link-hover-inverted);
}
&:hover,
&:focus {
color: var(--color-link-hover-inverted);
}
&:active {
color: var(--color-link-active-inverted);
}
&:active {
color: var(--color-link-active-inverted);
}
}
}