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

Only add margin att block end, not start on group elements.

Browse source
This commit is contained in:
Fredrik Jonsson 2023-11-18 16:22:08 +01:00
commit 5ea8ebff46
7 changed files with 23 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

2
assets/sass/base/forms/_forms.scss
View file

@ -4,7 +4,7 @@
form { form {
// Add vertical rhythm margins. // Add vertical rhythm margins.
@include margin-block(1); @include margin-block(0 1);
} }
input, input,

10
assets/sass/base/grouping/_grouping.scss
View file

@ -12,7 +12,7 @@
blockquote { blockquote {
// Add vertical rhythm margins. // Add vertical rhythm margins.
@include margin-block(1); @include margin-block(0 1);
// Also indent the quote on both sides. // Also indent the quote on both sides.
margin-inline: var(--indent-amount); margin-inline: var(--indent-amount);
} }
@ -24,7 +24,7 @@ ol,
ul, ul,
menu { menu {
// Add vertical rhythm margins. // Add vertical rhythm margins.
@include margin-block(1); @include margin-block(0 1);
} }
dd { dd {
@ -57,7 +57,7 @@ li {
figure { figure {
// Add vertical rhythm margins. // Add vertical rhythm margins.
@include margin-block(1); @include margin-block(0 1);
// Remove defult inline margins. // Remove defult inline margins.
@include margin-inline(0); @include margin-inline(0);
@ -74,7 +74,7 @@ hr {
p { p {
// Add vertical rhythm margins. // Add vertical rhythm margins.
@include margin-block(.75); @include margin-block(0 .75);
// Set max text line width in main for readability. // Set max text line width in main for readability.
.main & { .main & {
@ -86,7 +86,7 @@ p {
pre { pre {
// Add vertical rhythm margins. // Add vertical rhythm margins.
@include margin-block(.75); @include margin-block(0 .75);
font-family: var(--ff-monospace); font-family: var(--ff-monospace);
} }

22
assets/sass/base/headings/_headings.scss
View file

@ -15,7 +15,7 @@ h5,
%h5, %h5,
h6, h6,
%h6 { %h6 {
@include margin-block(1 0, 'em'); @include margin-block(1 0.375, 'em');
color: var(--color-headings); color: var(--color-headings);
font-family: var(--ff-headings); font-family: var(--ff-headings);
font-weight: var(--fw-headings); font-weight: var(--fw-headings);
@ -28,26 +28,6 @@ h6,
} }
} }
// Move content closer up to related header.
h2,
%h2,
h3,
%h3,
h4,
%h4,
h5,
%h5,
h6,
%h6 {
& + :is(p, ul, ol) {
@include margin-block-start(0.375);
}
& + & {
@include margin-block-start(0.5);
}
}
h1, h1,
%h1 { %h1 {
// h1 only on top of page so different margins. // h1 only on top of page so different margins.

22
assets/sass/base/images/_images.scss
View file

@ -3,7 +3,7 @@
figure, figure,
img { img {
&.image { &.image {
--padding: .75rem; --image-padding: .75rem;
@include respond-to(s) { @include respond-to(s) {
&.center { &.center {
@ -11,16 +11,16 @@ img {
} }
&.left { &.left {
padding-inline-end: var(--padding); padding-inline-end: var(--image-padding);
padding-block-end: var(--padding); padding-block-end: var(--image-padding);
margin: 0; margin: 0;
float: left; float: left;
clear: both; clear: both;
} }
&.right { &.right {
padding-inline-start: var(--padding); padding-inline-start: var(--image-padding);
padding-block-end: var(--padding); padding-block-end: var(--image-padding);
margin: 0; margin: 0;
float: right; float: right;
clear: both; clear: both;
@ -31,10 +31,8 @@ img {
figure { figure {
&.image { &.image {
--padding: .75rem;
figcaption { figcaption {
padding-block-start: var(--padding); padding-block-start: var(--image-padding);
@include respond-to(s) { @include respond-to(s) {
display: table-caption; display: table-caption;
@ -52,15 +50,15 @@ figure {
&.left { &.left {
figcaption { figcaption {
padding-inline-end: var(--padding); padding-inline-end: var(--image-padding);
padding-block-end: var(--padding); padding-block-end: var(--image-padding);
} }
} }
&.right { &.right {
figcaption { figcaption {
padding-inline-start: var(--padding); padding-inline-start: var(--image-padding);
padding-block-end: var(--padding); padding-block-end: var(--image-padding);
} }
} }
} }

2
assets/sass/base/tables/_tables.scss
View file

@ -4,7 +4,7 @@
table { table {
// Add vertical rhythm margins. // Add vertical rhythm margins.
@include margin-block(1); @include margin-block(0 1);
// Remove default spacing between table cells. // Remove default spacing between table cells.
border-collapse: collapse; border-collapse: collapse;
// Prevent cramped-looking tables // Prevent cramped-looking tables

4
assets/sass/components/spacing/_spacing.scss
View file

@ -1,10 +1,10 @@
@each $name, $space in $spacing { @each $name, $space in $spacing {
.mt--#{$name} { .mt--#{$name} {
@include margin-top($space); @include margin-block-start($space);
} }
.mb--#{$name} { .mb--#{$name} {
@include margin-bottom($space); @include margin-block-end($space);
} }
.mtb--#{$name} { .mtb--#{$name} {

6
assets/sass/components/tables/_tables.scss
View file

@ -1,14 +1,14 @@
.zebra-table, .zebra-table,
%zebra-table { %zebra-table {
--padding: .5rem; --cell-padding: .5rem;
@include respond-to-max(s) { @include respond-to-max(s) {
--padding: .3rem; --cell-padding: .3rem;
} }
th, th,
td { td {
padding: var(--padding); padding: var(--cell-padding);
} }
thead { thead {