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

Cookie concent feature.

Browse source
This commit is contained in:
Fredrik Jonsson 2021-01-29 14:53:38 +01:00
commit 79b366cb18
4 changed files with 236 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

7
assets/sass/components/button/_button.scss
View file

@ -74,6 +74,13 @@ button,
// Add button variations here.
.button,
%button {
&--small {
@include type-layout(xs, 1);
@include margin-right(.3);
@include margin-bottom(.3);
padding: 0 6px;
}
&--variant-name {
// Add styles here.
}

32
assets/sass/components/cookieconsent/_cookieconsent.scss Normal file
View file

@ -0,0 +1,32 @@
// Cookieconsent
.cookieconsent {
@include type-layout(s, 1);
position: sticky;
bottom: 0;
width: 100%;
color: $warning;
background-color: $warning-bg;
border-top: 4px solid $warning-border;
text-align: center;
transform: translateY(100vh);
transition: all 130ms ease-in;
a {
color: inherit;
}
}
.button {
&--accept {
border-color: $status;
}
&--decline {
border-color: $warning-border;
}
}
.js-cookieconsent-open {
transform: translateY(0);
}

22
assets/sass/layouts/_layouts.scss
View file

@ -17,7 +17,8 @@
&__first-sidebar,
&__second-sidebar,
&__page-top,
&__page-bottom {
&__page-bottom,
&__cookieconsent {
padding: 0 $zen-gutters / 2;
min-width: 0; // With display grid defaults to auto, making <pre> overflow.
@ -39,7 +40,8 @@
'side1'
'side2'
'bottom'
'foot';
'foot'
'notice';
grid-template-rows: auto
auto
auto
@ -47,6 +49,7 @@
auto
auto
auto
auto
auto;
grid-template-columns: 1fr;
}
@ -58,6 +61,7 @@
auto
1fr
auto
auto
auto;
}
@ -67,7 +71,8 @@
'side1 top'
'side1 main'
'side1 bottom'
'foot foot';
'foot foot'
'notice notice';
grid-template-columns: 1fr
2fr;
}
@ -78,7 +83,8 @@
'top side2'
'main side2'
'bottom side2'
'foot foot';
'foot foot'
'notice notice';
grid-template-columns: 2fr
1fr;
}
@ -89,7 +95,8 @@
'side1 top side2'
'side1 main side2'
'side1 bottom side2'
'foot foot foot';
'foot foot foot'
'notice notice notice';
grid-template-columns: 1fr
2fr
1fr;
@ -127,6 +134,11 @@
&__footer {
grid-area: foot;
}
&__cookieconsent {
grid-area: notice;
}
}
}

1
assets/sass/styles.scss
View file

@ -36,6 +36,7 @@
@import 'components/box/box';
@import 'components/clearfix/clearfix';
@import 'components/cookieconsent/cookieconsent';
@import 'components/header/header';
@import 'components/hidden/hidden';
@import 'components/highlight-mark/highlight-mark';