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

upgrade

Browse Source
This commit is contained in:
David Bruno Vontor
2025-11-07 00:46:35 +01:00
parent 2118f002d1
commit c3f837b90f
143 changed files with 4223 additions and 9686 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -0,0 +1,240 @@
@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');
:root{
--c-background: #031D44; /*background*/
--c-background-light: #04395E; /*background-highlight*/
--c-boxes: #24719f;; /*boxes*/
--c-lines: #87a9da; /*lines*/
--c-text: #CAF0F8; /*text*/
--c-other: #70A288; /*other*/
}
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;
}
.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;
}
}