mirror of
https://github.com/Rushilwiz/campaign.git
synced 2025-04-03 20:10:20 -04:00
feat: added landing
This commit is contained in:
parent
d3bc8d7067
commit
addf3d075b
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
*.map
|
||||
22
index.html
22
index.html
|
|
@ -1,2 +1,20 @@
|
|||
<h1>ru4u?</h1>
|
||||
<p>vote rushil umaretiya for sga president</p>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>RU4U?</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="seal"></div>
|
||||
<section class="landing">
|
||||
<h1>Rushil<br>Umaretiya<br></h1>
|
||||
<p class="subtitle">for sga president</p>
|
||||
</section>
|
||||
<!-- <section class="about">
|
||||
|
||||
</section> -->
|
||||
</body>
|
||||
</html>
|
||||
BIN
res/banner.png
Normal file
BIN
res/banner.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 MiB |
BIN
res/seal.png
Normal file
BIN
res/seal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
107
style.css
Normal file
107
style.css
Normal file
|
|
@ -0,0 +1,107 @@
|
|||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.seal {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
z-index: 999;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
margin-right: 15px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.seal::before {
|
||||
-webkit-animation: spin 20s 10s infinite;
|
||||
animation: spin 20s 10s infinite;
|
||||
content: '';
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
background-image: url("/res/seal.png");
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
@media (max-width: 786px) {
|
||||
.seal {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes spin {
|
||||
from {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
from {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
section {
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.landing {
|
||||
-webkit-box-align: start;
|
||||
-ms-flex-align: start;
|
||||
align-items: flex-start;
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
padding-left: 5vw;
|
||||
font-size: 4rem;
|
||||
font-family: "Cooper Black", "Arial Black", sans-serif;
|
||||
color: #DA3252;
|
||||
line-height: 1;
|
||||
background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(245, 246, 252, 0.52)), to(rgba(255, 255, 255, 0))), url("/res/banner.png");
|
||||
background-image: linear-gradient(to right, rgba(245, 246, 252, 0.52) 50%, rgba(255, 255, 255, 0)), url("/res/banner.png");
|
||||
text-shadow: 3px 3px #000;
|
||||
}
|
||||
|
||||
@media (max-width: 786px) {
|
||||
.landing {
|
||||
padding-left: 0;
|
||||
font-size: 2rem;
|
||||
text-align: center;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
background: rgba(245, 246, 252, 0.52);
|
||||
}
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
color: #5d8db9;
|
||||
font-family: "Fugaz One", cursive;
|
||||
}
|
||||
/*# sourceMappingURL=style.css.map */
|
||||
75
style.sass
Normal file
75
style.sass
Normal file
|
|
@ -0,0 +1,75 @@
|
|||
@mixin mobile
|
||||
@media (max-width: 786px)
|
||||
@content
|
||||
|
||||
|
||||
*
|
||||
margin: 0
|
||||
padding: 0
|
||||
box-sizing: border-box
|
||||
|
||||
body
|
||||
overflow-x: hidden
|
||||
|
||||
.seal
|
||||
width: 100px
|
||||
height: 100px
|
||||
z-index: 999
|
||||
position: fixed
|
||||
right: 0
|
||||
margin-right: 15px
|
||||
margin-top: 15px
|
||||
|
||||
&::before
|
||||
animation: spin 20s 10s infinite
|
||||
content: ''
|
||||
width: 100%
|
||||
height: 100%
|
||||
position: absolute
|
||||
background-image: url('/res/seal.png')
|
||||
background-size: cover
|
||||
|
||||
@include mobile
|
||||
display: none
|
||||
|
||||
@keyframes spin
|
||||
from
|
||||
transform: rotate(0deg)
|
||||
to
|
||||
transform: rotate(360deg)
|
||||
|
||||
|
||||
|
||||
section
|
||||
height: 100vh
|
||||
width: 100vw
|
||||
display: flex
|
||||
z-index: 1
|
||||
|
||||
.landing
|
||||
align-items: flex-start
|
||||
justify-content: center
|
||||
flex-direction: column
|
||||
padding-left: 5vw
|
||||
font-size: 4rem
|
||||
font-family: "Cooper Black", "Arial Black", sans-serif
|
||||
color: #DA3252
|
||||
line-height: 1
|
||||
background-image: linear-gradient(to right, rgba(245, 246, 252, 0.52) 50%, rgba(255, 255, 255, 0)), url("/res/banner.png")
|
||||
text-shadow: 3px 3px #000
|
||||
|
||||
@include mobile
|
||||
padding-left: 0
|
||||
font-size: 2rem
|
||||
text-align: center
|
||||
align-items: center
|
||||
background: rgba(245, 246, 252, 0.52)
|
||||
|
||||
.subtitle
|
||||
color: #5d8db9
|
||||
font-family: "Fugaz One", cursive
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user