fix overflow on body

feature/oscar-theme
Segundo Fdez 2022-03-08 21:30:08 +01:00
parent 6152c84675
commit 63b3abdaef
3 changed files with 23 additions and 15 deletions

View File

@ -361,7 +361,6 @@ body {
text-rendering: auto;
background-color: var(--background-main);
color: var(--color-main);
overflow: hidden;
}
a {
color: var(--color-link);
@ -390,11 +389,15 @@ i, em {
margin-top: var(--spacing-6);
padding: var(--spacing-3);
}
.back-circle {
.back-forms {
position: absolute;
inset: 0 0 0 0;
z-index: -1;
overflow: hidden;
}
.back-circle {
left: 80vw;
opacity: .02;
z-index: -1;
fill: var(--color-main);
animation: back-circle 65s infinite linear;
}
@ -404,13 +407,13 @@ i, em {
transform-origin: center center;
}
25% {
transform: translateX(-45vw) translateY(50vh);
transform: translateX(45vw) translateY(50vh);
}
50% {
transform: translateX(35vw) translateY(30vh);
transform: translateX(105vw) translateY(30vh);
}
75% {
transform: translateX(5vw) translateY(20vh);
transform: translateX(-15vw) translateY(20vh);
}
100% {
transform: translateY(-20vh);

View File

@ -10,7 +10,6 @@ body {
text-rendering: auto;
background-color: var(--background-main);
color: var(--color-main);
overflow: hidden;
}
a {
color: var(--color-link);
@ -41,11 +40,15 @@ i, em {
padding: var(--spacing-3);
}
.back-circle {
.back-forms {
position: absolute;
inset: 0 0 0 0;
z-index: -1;
overflow: hidden;
}
.back-circle {
left: 80vw;
opacity: .02;
z-index: -1;
fill: var(--color-main);
animation: back-circle 65s infinite linear;
}
@ -56,13 +59,13 @@ i, em {
transform-origin: center center;
}
25% {
transform: translateX(-45vw) translateY(50vh);
transform: translateX(45vw) translateY(50vh);
}
50% {
transform: translateX(35vw) translateY(30vh);
transform: translateX(105vw) translateY(30vh);
}
75% {
transform: translateX(5vw) translateY(20vh);
transform: translateX(-15vw) translateY(20vh);
}
100% {
transform: translateY(-20vh);

View File

@ -2,9 +2,11 @@
<html lang="{{ .Site.LanguageCode | default "en" }}">
{{ partial "metas.html" . }}
<body>
<svg class="back-circle" width="357" height="357" viewBox="0 0 357 357" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="178.5" cy="178.5" r="178.5" fill="white"/>
</svg>
<div class="back-forms">
<svg class="back-circle" width="357" height="357" viewBox="0 0 357 357" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="178.5" cy="178.5" r="178.5" fill="white"/>
</svg>
</div>
{{ partial "header.html" . }}
{{ block "main" . }}{{ end }}
{{ partial "footer.html" . }}