diff --git a/layouts/shortcodes/boxes.html b/layouts/shortcodes/boxes.html
index eead05c..b19ba4e 100644
--- a/layouts/shortcodes/boxes.html
+++ b/layouts/shortcodes/boxes.html
@@ -6,7 +6,7 @@
{{- range $index, $box := .Scratch.Get $group }}
{{ if or $box.Title $box.Icon }}
diff --git a/src/sass/_base.scss b/src/sass/_base.scss
index 330378c..46d89a3 100644
--- a/src/sass/_base.scss
+++ b/src/sass/_base.scss
@@ -115,7 +115,7 @@ h6 {
h4,
h5,
h6 {
- font-size: 1rem !important;
+ font-size: $font-size-16 !important;
}
a {
@@ -179,8 +179,8 @@ img {
svg.gblog-icon {
display: inline-block;
- width: 1.3em;
- height: 1.3em;
+ width: $padding-24;
+ height: $padding-24;
vertical-align: middle;
stroke-width: 0;
stroke: currentColor;
@@ -224,8 +224,8 @@ svg.gblog-icon {
&__img {
margin-right: $padding-16;
- width: 60px;
- height: 60px;
+ width: $padding-32;
+ height: $padding-32;
}
}
@@ -244,7 +244,7 @@ svg.gblog-icon {
}
&__entry {
- line-height: 1.3em;
+ line-height: $padding-24;
color: $gray-100;
text-decoration: none;
padding: $padding-4 $padding-8;
@@ -340,7 +340,8 @@ svg.gblog-icon {
margin-left: $padding-8;
svg.gblog-icon {
- font-size: $font-size-20;
+ width: 1.25em;
+ height: 1.25em;
color: transparent;
}
@@ -370,7 +371,6 @@ svg.gblog-icon {
bottom: 0;
right: 0;
padding: $padding-4 $padding-8;
- font-size: 0.8em;
color: $gray-100;
border-radius: $border-radius 0;
}
@@ -404,7 +404,7 @@ svg.gblog-icon {
}
svg.gblog-icon {
- font-size: 1.2em;
+ font-size: $font-size-20;
}
.gblog-button {
@@ -456,14 +456,14 @@ svg.gblog-icon {
&__codecopy {
visibility: hidden;
position: absolute;
- top: 0.5rem;
- right: 1rem;
+ top: $padding-8;
+ right: $padding-8;
border: $border-2 solid var(--code-copy-border-color);
border-radius: $border-radius;
background: var(--code-copy-background);
- width: 2.2rem;
- height: 2.2rem;
+ width: $padding-32;
+ height: $padding-32;
svg.gblog-icon {
top: 0;
@@ -495,7 +495,7 @@ svg.gblog-icon {
}
&__item {
- line-height: 2em;
+ line-height: $padding-32;
&--row {
margin-right: $padding-16;
@@ -576,6 +576,8 @@ svg.gblog-icon {
}
.gblog-toc {
+ margin: $padding-16 0;
+
// Classes to hide nested levels of ToC/Menu
&__level--1 ul ul,
&__level--2 ul ul ul,
diff --git a/src/sass/_chroma_base.scss b/src/sass/_chroma_base.scss
index bc3ee8c..18e0780 100644
--- a/src/sass/_chroma_base.scss
+++ b/src/sass/_chroma_base.scss
@@ -10,7 +10,6 @@
.highlight {
pre.chroma {
- margin: 0;
width: 100%;
overflow: auto;
max-height: var(--code-max-height);
@@ -32,6 +31,7 @@
pre.chroma {
max-height: none;
border-radius: 0;
+ margin: 0;
}
}
.chroma .lntable td:first-child {
@@ -45,6 +45,6 @@
}
.chroma .lntable td:nth-child(2) {
width: 100%;
- margin-left: 2em;
+ margin-left: $padding-32;
}
}
diff --git a/src/sass/_markdown.scss b/src/sass/_markdown.scss
index 14fab41..6119b45 100644
--- a/src/sass/_markdown.scss
+++ b/src/sass/_markdown.scss
@@ -1,23 +1,5 @@
.gblog-markdown {
- line-height: 1.6em;
-
- > :first-child {
- margin-top: 0 !important;
- }
-
- &--nested {
- :first-child {
- margin-top: 0;
- }
-
- > pre {
- margin-top: 0 !important;
- }
-
- > :last-child {
- margin-bottom: 0;
- }
- }
+ line-height: $padding-24;
h1,
h2,
@@ -29,7 +11,7 @@
> code {
border-top: $border-4 solid var(--accent-color);
- font-size: 0.75em !important;
+ font-size: $font-size-12 !important;
}
}
@@ -37,7 +19,7 @@
h5,
h6 {
> code {
- font-size: 0.8rem !important;
+ font-size: $font-size-14 !important;
}
}
@@ -91,21 +73,13 @@
border-left: $border-4 solid var(--accent-color);
border-radius: $border-radius;
-
- :first-child {
- margin-top: 0;
- }
- :last-child {
- margin-bottom: 0;
- }
}
table:not(.lntable) {
display: table;
border-spacing: 0;
border-collapse: collapse;
- margin-top: $padding-16;
- margin-bottom: $padding-16;
+ margin: $padding-16 0;
width: 100%;
text-align: left;
@@ -149,12 +123,8 @@
}
}
- pre {
- margin: 1rem 0;
- }
-
code {
- padding: 0.2em 0.4em;
+ padding: $padding-4 $padding-8;
}
pre,
@@ -162,13 +132,13 @@
background-color: var(--code-background);
border-radius: $border-radius;
color: var(--code-font-color);
- font-size: 0.85rem;
- line-height: 1.45em;
+ font-size: $font-size-14;
+ line-height: $padding-16;
}
pre code {
display: block;
- padding: 1rem;
+ padding: $padding-16;
width: 100%;
}
@@ -177,7 +147,7 @@
}
section.footnotes {
- margin-top: 3rem;
+ margin-top: $padding-32;
color: var(--body-font-color);
font-size: $font-size-14;
}
diff --git a/src/sass/_shortcodes.scss b/src/sass/_shortcodes.scss
index ab94157..fb7f5e4 100644
--- a/src/sass/_shortcodes.scss
+++ b/src/sass/_shortcodes.scss
@@ -1,7 +1,6 @@
// {{< expand "Label" "icon" >}}
.gblog-expand {
- margin-top: $padding-16;
- margin-bottom: $padding-16;
+ margin: $padding-16 0;
border: $border-1 solid var(--accent-color);
border-radius: $border-radius;
@@ -17,7 +16,7 @@
&__content {
display: none;
- padding: $padding-16;
+ padding: 0 $padding-16;
}
&__control:checked + &__content {
@@ -31,8 +30,7 @@
// {{< tabs >}}
.gblog-tabs {
- margin-top: $padding-16;
- margin-bottom: $padding-16;
+ margin: $padding-16 0;
border: $border-1 solid var(--accent-color);
border-radius: $border-radius;
@@ -54,7 +52,7 @@
order: 999; //Move content blocks to the end
width: 100%;
border-top: $border-1 solid var(--accent-color-lite);
- padding: $padding-16;
+ padding: 0 $padding-16;
display: none;
}
@@ -72,6 +70,8 @@
// {{< columns >}}
.gblog-columns {
+ margin: $padding-16 0;
+
&--regular > :first-child {
flex: 1;
}
@@ -88,7 +88,6 @@
&__content {
flex: 1 1;
- margin: $padding-16 0;
min-width: $body-min-width * 0.66;
padding: 0;
}
@@ -101,12 +100,12 @@
// {{< button >}}
.gblog-button {
$root: &;
+ margin: $padding-16 0;
display: inline-block;
background: var(--accent-color-lite);
border: $border-1 solid var(--accent-color);
border-radius: $border-radius;
- margin: $padding-8 0;
cursor: pointer;
user-select: none;
@@ -146,6 +145,7 @@
// {{< box >}}
.gblog-box {
+ flex-direction: column;
background: var(--accent-color-lite);
border: $border-1 solid var(--accent-color);
border-radius: $border-radius;
@@ -170,9 +170,9 @@
gap: $padding-8;
svg.gblog-icon {
- width: 1.3rem;
- height: 1.3rem;
- min-width: 1.3rem;
+ width: $padding-24;
+ height: $padding-24;
+ min-width: $padding-24;
}
}
diff --git a/src/sass/_utils.scss b/src/sass/_utils.scss
index bdd50b4..dfe3bcb 100644
--- a/src/sass/_utils.scss
+++ b/src/sass/_utils.scss
@@ -83,4 +83,9 @@
.table-wrap {
overflow: auto;
+ margin: $padding-16 0;
+
+ > table {
+ margin: 0 !important;
+ }
}