Brunobrno/vontor-cz
Template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
David Bruno Vontor
2025-10-01 18:31:30 +02:00
commit 85b035fd27
80 changed files with 6930 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

265
frontend/src/pages/home/Home.module.css Normal file
View File

@@ -0,0 +1,265 @@
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Doto:wght@100..900&family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Doto:wght@300&family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Exo:ital,wght@0,100..900;1,100..900&display=swap');
html{
scroll-behavior: smooth;
}
body{
font-family: "Exo", serif;
font-optical-sizing: auto;
font-weight: 700;
font-style: normal;
}
.wrapper {
position: relative;
width: 100%;
}
.doto-font{
font-family: "Doto", serif;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
font-variation-settings: "ROND" 0;
}
.bebas-neue-regular {
font-family: "Bebas Neue", sans-serif;
font-weight: 400;
font-style: normal;
}
footer a{
color: var(--c-text);
text-decoration: none;
}
footer a i{
color: white;
text-decoration: none;
}
footer{
font-family: "Roboto Mono", monospace;
background-color: var(--c-boxes);
margin-top: 2em;
display: flex;
color: white;
align-items: center;
justify-content: space-evenly;
}
footer address{
padding: 1em;
font-style: normal;
}
footer .contacts{
font-size: 2em;
}
@media only screen and (max-width: 990px){
footer{
flex-direction: column;
padding-bottom: 1em;
padding-top: 1em;
}
}
.introduction {
display: flex;
flex-direction: column;
color: var(--c-text);
padding-bottom: 10em;
margin-top: 6em;
width: 100%;
position: relative;
top:0;
/* gap: 4em;*/
}
.introduction h1{
font-size: 2em;
}
.introduction article {
/*background-color: cadetblue;*/
padding: 2em;
border-radius: 1em;
}
.introduction article header {}
.introduction article:nth-child(1) {
width: 100%;
/* transform: rotate(5deg); */
align-self: center;
text-align: center;
font-size: 2em;
}
/*
.introduction article:nth-child(2) {
width: 50%;
transform: rotate(3deg);
align-self: flex-end;
}
.introduction article:nth-child(3) {
width: 50%;
transform: rotate(-2deg);
align-self: flex-start;
}*/
.animation-introduction{
position: absolute;
width: 100%;
height: 100%;
top: 0;
z-index: -2;
}
.animation-introduction ul{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*overflow: hidden; ZAPNOUT KDYŽ NECHCEŠ ANIMACI PŘECHÁZET DO OSTATNÍCH DIVŮ*/
}
.animation-introduction ul li{
position: absolute;
display: block;
list-style: none;
width: 20px;
height: 20px;
background: rgba(255, 255, 255, 35%);
animation: animate 4s linear infinite;
bottom: -150px;
}
.animation-introduction ul li:nth-child(1){
left: 25%;
width: 80px;
height: 80px;
animation-delay: 0s;
}
.animation-introduction ul li:nth-child(2){
left: 10%;
width: 20px;
height: 20px;
animation-delay: 2s;
animation-duration: 12s;
}
.animation-introduction ul li:nth-child(3){
left: 70%;
width: 20px;
height: 20px;
animation-delay: 4s;
}
.animation-introduction ul li:nth-child(4){
left: 40%;
width: 60px;
height: 60px;
animation-delay: 0s;
animation-duration: 18s;
}
.animation-introduction ul li:nth-child(5){
left: 65%;
width: 20px;
height: 20px;
animation-delay: 0s;
}
.animation-introduction ul li:nth-child(6){
left: 75%;
width: 110px;
height: 110px;
animation-delay: 3s;
}
.animation-introduction ul li:nth-child(7){
left: 35%;
width: 150px;
height: 150px;
animation-delay: 7s;
}
.animation-introduction ul li:nth-child(8){
left: 50%;
width: 25px;
height: 25px;
animation-delay: 15s;
animation-duration: 45s;
}
.animation-introduction ul li:nth-child(9){
left: 20%;
width: 15px;
height: 15px;
animation-delay: 2s;
animation-duration: 35s;
}
.animation-introduction ul li:nth-child(10){
left: 85%;
width: 150px;
height: 150px;
animation-delay: 0s;
animation-duration: 11s;
}
@keyframes animate {
0%{
transform: translateY(0) rotate(0deg);
opacity: 1;
border-radius: 0;
}
100%{
transform: translateY(-1000px) rotate(720deg);
opacity: 0;
border-radius: 50%;
}
}
@media only screen and (max-width: 990px) {
.animation-introduction ul li:nth-child(6){
left: 67%;
}
.animation-introduction ul li:nth-child(10) {
left: 60%;
}
.introduction {
margin: 0;
top: 0;
}
.introduction article {
width: auto !important;
transform: none !important;
align-self: none !important;
}
}