mirror of
https://github.com/selenite-cc/flasharchive.git
synced 2025-01-22 12:42:53 -03:00
Update style.css
This commit is contained in:
parent
a17b331743
commit
b23e8fccfe
1 changed files with 54 additions and 26 deletions
|
@ -2,25 +2,57 @@
|
|||
font-family: 'Amaranth', sans-serif;
|
||||
}
|
||||
|
||||
@keyframes bg-gradient {
|
||||
0% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%;
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
}
|
||||
@keyframes fadeIn {
|
||||
0% {opacity:0;}
|
||||
10% {opacity:0.4;}
|
||||
50% {opacity:0.8}
|
||||
100% {opacity:1;}
|
||||
}
|
||||
|
||||
body {
|
||||
background: #3e3f57
|
||||
background: linear-gradient(-45deg, #349ef0, #7a4abe, #349ef0);
|
||||
background-size: 400% 400%;
|
||||
animation: bg-gradient 15s ease infinite;
|
||||
}
|
||||
|
||||
p {
|
||||
color:#b5b7eb;
|
||||
animation: fadeIn ease-out 0.8s;
|
||||
}
|
||||
|
||||
h1 {
|
||||
position:relative;
|
||||
left:80px;
|
||||
color:#b5b7eb;
|
||||
animation: fadeIn ease-out 0.8s;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: #515357;
|
||||
color: #a0b4db;
|
||||
border-radius: 5px;
|
||||
padding: 3px 1%
|
||||
background-color: rgba(255,255,255,0.3);
|
||||
color: #232f42;
|
||||
border: 2.5px solid #6186c2;
|
||||
border-radius: 10px;
|
||||
padding: 5px 13px;
|
||||
margin-bottom: 6px;
|
||||
transition-duration: 0.45s;
|
||||
animation: fadeIn ease-out 0.8s;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color:rgba(0,0,0,0.2);
|
||||
border: 2.5px solid #81a1d6;
|
||||
color: #9dade3;
|
||||
}
|
||||
|
||||
a:link {
|
||||
|
@ -36,6 +68,13 @@ header {
|
|||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 15px 10%;
|
||||
background: linear-gradient(-45deg, #626ce0, #349ef0, #626ce0);
|
||||
background-size: 400% 400%;
|
||||
animation: bg-gradient 15s ease infinite;
|
||||
border-radius:100px;
|
||||
border: linear-gradient(90deg, rgba(52,158,240,1) 0%, rgba(74,87,191,1) 100%);
|
||||
border: 10px solid #4f71b0;
|
||||
animation: fadeIn ease-out 0.8s;
|
||||
}
|
||||
|
||||
.logo {
|
||||
|
@ -49,23 +88,14 @@ header {
|
|||
.nav__links button {
|
||||
display: inline-block;
|
||||
padding: 10px 10px;
|
||||
border: 0px solid #6186c2;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
font-size: 20px;
|
||||
color: #b5b7eb;
|
||||
}
|
||||
|
||||
.nav__links li a {
|
||||
transition: all 0.3s ease 0s;
|
||||
}
|
||||
|
||||
.nav__links li a:hover {
|
||||
color:
|
||||
}
|
||||
|
||||
.divider {
|
||||
width:5px;
|
||||
height:auto;
|
||||
display:inline-block;
|
||||
}
|
||||
.divide {
|
||||
margin-left:100px;
|
||||
.nav__links button:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
|
||||
|
@ -73,5 +103,3 @@ p1 {
|
|||
font-size: 1.75em;
|
||||
color:#b5b7eb;
|
||||
}
|
||||
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue