Skip to content

Commit

Permalink
Extract and reuse the h1 margin on regular pages
Browse files Browse the repository at this point in the history
  • Loading branch information
Perlence committed Dec 9, 2024
1 parent 3db0425 commit 786680a
Show file tree
Hide file tree
Showing 6 changed files with 58 additions and 85 deletions.
12 changes: 0 additions & 12 deletions assets/sass/_contact.scss
Original file line number Diff line number Diff line change
Expand Up @@ -6,26 +6,14 @@
margin: 0;
}

&--title {
color: $primary-violet;
overflow: hidden;
}

&--address {
&-wrapper {
border: 1px solid $border-color-default;
display: flex;
flex-direction: column;
margin-top: 2rem;
@include media-up(md) {
flex-direction: row;
}
@include media-up(lg) {
margin-top: 3rem;
}
@include media-up(xl) {
margin-top: 3.75rem;
}
}

&-item {
Expand Down
13 changes: 0 additions & 13 deletions assets/sass/_privacy.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,6 @@
@import './mixins';

.privacy {
h1 {
color: $primary-violet;
overflow: hidden;

margin-bottom: 2rem;
@include media-up(lg) {
margin-bottom: 3rem;
}
@include media-up(xl) {
margin-bottom: 3.75rem;
}
}

h3 {
margin-top: 1rem;
@include media-up(lg) {
Expand Down
27 changes: 6 additions & 21 deletions assets/sass/_teamplify.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,28 +2,13 @@
@import './mixins';

.teamplify {
&--title {
color: $primary-violet;
overflow: hidden;

&-ico > svg {
height: auto;
margin-right: 0.75rem;
margin-top: -0.1em;
width: 0.75em;
@include media-up(xl) {
margin-right: 1.5rem;
}
}
}

&--wrapper {
margin-top: 2rem;
@include media-up(lg) {
margin-top: 3rem;
}
&--title-ico > svg {
height: auto;
margin-right: 0.75rem;
margin-top: -0.1em;
width: 0.75em;
@include media-up(xl) {
margin-top: 3.75rem;
margin-right: 1.5rem;
}
}

Expand Down
32 changes: 32 additions & 0 deletions assets/sass/_typography.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,23 @@
@import './vars';
@import './mixins';

.page {
margin-top: 6.25rem;
@include media-up(md) {
margin-top: 8.75rem;
}
@include media-up(xl) {
margin-top: 12.5rem;
}
}

.container {
margin: 0 auto;
max-width: $container-default-max-width;
padding: 0 1.25rem;
width: 100%;
}

@mixin a-no-underline {
background-size: 0 1px;
}
Expand Down Expand Up @@ -53,6 +70,21 @@ h1 {
}
}

.page {
h1 {
color: $primary-violet;
overflow: hidden;

margin-bottom: 2rem;
@include media-up(lg) {
margin-bottom: 3rem;
}
@include media-up(xl) {
margin-bottom: 3.75rem;
}
}
}

h2 {
font-size: 2rem;
line-height: 1.4;
Expand Down
17 changes: 0 additions & 17 deletions assets/sass/main.scss
Original file line number Diff line number Diff line change
Expand Up @@ -44,20 +44,3 @@ textarea {
line-height: inherit;
margin: 0;
}

.page {
margin-top: 6.25rem;
@include media-up(md) {
margin-top: 8.75rem;
}
@include media-up(xl) {
margin-top: 12.5rem;
}
}

.container {
margin: 0 auto;
max-width: $container-default-max-width;
padding: 0 1.25rem;
width: 100%;
}
42 changes: 20 additions & 22 deletions layouts/teamplify/teamplify.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,32 +8,30 @@ <h1 class="teamplify--title">
| safeHTML
}}</span>Teamplify
</h1>
<div class="teamplify--wrapper">
<div class="teamplify--tagline">
{{- .Content -}}
<div class="teamplify--tagline">
{{- .Content -}}
</div>
<div class="teamplify--grid">
<div class="teamplify--illustration">
<img
src="{{ (.Resources.Get "img/missing-piece.svg").RelPermalink }}"
alt="Teamplify is the missing piece that focuses on people."
class="teamplify--illustration-text"
/><img
class="teamplify--illustration-image"
src="{{ (.Resources.Get "img/teamplify.svg").RelPermalink }}"
alt="The missing piece that focuses on people"
/>
</div>
<div class="teamplify--grid">
<div class="teamplify--illustration">
<div class="teamplify--description">
<div class="teamplify--piece">
<img
src="{{ (.Resources.Get "img/missing-piece.svg").RelPermalink }}"
src="{{ (.Resources.Get "img/puzzle.svg").RelPermalink }}"
alt="Teamplify is the missing piece that focuses on people."
class="teamplify--illustration-text"
/><img
class="teamplify--illustration-image"
src="{{ (.Resources.Get "img/teamplify.svg").RelPermalink }}"
alt="The missing piece that focuses on people"
/>
/>{{- (.GetPage "team-management").Content }}
</div>
<div class="teamplify--description">
<div class="teamplify--piece">
<img
src="{{ (.Resources.Get "img/puzzle.svg").RelPermalink }}"
alt="Teamplify is the missing piece that focuses on people."
/>{{- (.GetPage "team-management").Content }}
</div>
<div class="teamplify--text">
{{- (.GetPage "insights").Content }}
</div>
<div class="teamplify--text">
{{- (.GetPage "insights").Content }}
</div>
</div>
</div>
Expand Down

0 comments on commit 786680a

Please sign in to comment.