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

View File

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

View File

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