nicer
This commit is contained in:
parent
8c2e3178fa
commit
9d27496b27
|
@ -31,12 +31,14 @@ body{
|
|||
}
|
||||
a {
|
||||
color: #0000009f;
|
||||
transition: background-color 0.5s ease-in-out;
|
||||
background-color: rgba(255, 255, 255, 0.705);
|
||||
transition: color 0.5s ease-in-out;
|
||||
border-radius: 3px;
|
||||
}
|
||||
a:hover {
|
||||
background-color: #00000091;
|
||||
transition: background-color 0.5s ease-in-out;
|
||||
transition: color 0.5s ease-in-out;
|
||||
color: #ffffff9f;
|
||||
}
|
||||
#hero {
|
||||
display: flex;
|
||||
|
@ -46,9 +48,9 @@ a:hover {
|
|||
position: relative;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
background: linear-gradient(230deg, rgba(218, 159, 142, 0.8), rgba(236, 0, 228, 0.8), rgba(0, 212, 236, 0.8), rgba(0, 236, 173, 0.8), rgba(110, 0, 236, 0.8));
|
||||
background-size: 1000% 1000%;
|
||||
|
||||
// background: linear-gradient(230deg, rgba(218, 159, 142, 0.8), rgba(236, 0, 228, 0.8), rgba(0, 212, 236, 0.8), rgba(0, 236, 173, 0.8), rgba(110, 0, 236, 0.8));
|
||||
// background-size: 1000% 1000%;
|
||||
background-image: url('/assets/img/header.svg');
|
||||
-webkit-animation: AnimationName 30s ease infinite;
|
||||
-moz-animation: AnimationName 30s ease infinite;
|
||||
animation: AnimationName 30s ease infinite;
|
||||
|
@ -98,6 +100,30 @@ a:hover {
|
|||
font-size: 1em;
|
||||
line-height: .8em;
|
||||
}
|
||||
a {
|
||||
background: linear-gradient(230deg, #ff00ff7f, #426a007f);
|
||||
background-position: center;
|
||||
background-repeat: repeat;
|
||||
-webkit-animation: AnimationName 60s ease infinite;
|
||||
-moz-animation: AnimationName 60s ease infinite;
|
||||
animation: AnimationName 60s ease infinite;
|
||||
|
||||
@-webkit-keyframes AnimationName {
|
||||
0%{background-position:0% 91%}
|
||||
50%{background-position:100% 10%}
|
||||
100%{background-position:0% 91%}
|
||||
}
|
||||
@-moz-keyframes AnimationName {
|
||||
0%{background-position:0% 91%}
|
||||
50%{background-position:100% 10%}
|
||||
100%{background-position:0% 91%}
|
||||
}
|
||||
@keyframes AnimationName {
|
||||
0%{background-position:0% 91%}
|
||||
50%{background-position:100% 10%}
|
||||
100%{background-position:0% 91%}
|
||||
}
|
||||
}
|
||||
.fullscreen-bg {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
|
@ -139,9 +165,7 @@ a:hover {
|
|||
// display: none;
|
||||
// }
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* MUSIC INDEX */
|
||||
|
@ -157,10 +181,10 @@ a:hover {
|
|||
background-repeat: repeat;
|
||||
}
|
||||
.trackcontainer {
|
||||
flex: 1 1 300px;
|
||||
flex: 1 1 360px;
|
||||
padding: 10px;
|
||||
margin: 0;
|
||||
background: linear-gradient(230deg, rgba(218, 159, 142, 0.1), rgba(236, 0, 228, 0.1), rgba(0, 212, 236, 0.1), rgba(0, 236, 173, 0.1), rgba(110, 0, 236, 0.1));
|
||||
// background: linear-gradient(230deg, rgba(218, 159, 142, 0.1), rgba(236, 0, 228, 0.1), rgba(0, 212, 236, 0.1), rgba(0, 236, 173, 0.1), rgba(110, 0, 236, 0.1));
|
||||
background-size: 1000% 1000%;
|
||||
|
||||
-webkit-animation: AnimationName 30s ease infinite;
|
||||
|
@ -238,6 +262,9 @@ a:hover {
|
|||
}
|
||||
|
||||
#controls {
|
||||
a {
|
||||
background-color: transparent;
|
||||
}
|
||||
display: flex;
|
||||
flex: 0 0 200px;
|
||||
flex-wrap: wrap;
|
||||
|
@ -370,6 +397,9 @@ min-height: 80vh;
|
|||
bottom: 10px;
|
||||
right: 10px;
|
||||
opacity: 0;
|
||||
a {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
.aboutflex {
|
||||
display: flex;
|
||||
|
@ -385,9 +415,10 @@ min-height: 80vh;
|
|||
}
|
||||
.logo {
|
||||
flex: 1 0 300px;
|
||||
margin-top: 0px;
|
||||
padding-top: 0px;
|
||||
|
||||
background-size: 100%;
|
||||
background-repeat: repeat;
|
||||
max-width: 300px;
|
||||
max-height: 300px;
|
||||
|
||||
}
|
|
@ -6,7 +6,7 @@ layout: default
|
|||
|
||||
|
||||
<div class="pivot">
|
||||
<h2>About</h2>
|
||||
<a href="{{ site.baseurl }}/"><h2>About</h2></a>
|
||||
<h1>Sakrecoer</h1>
|
||||
</div>
|
||||
<div class="fullscreen-bg">
|
||||
|
|
161
assets/img/header.svg
Normal file
161
assets/img/header.svg
Normal file
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 61 KiB |
21
index.html
21
index.html
|
@ -36,25 +36,8 @@ layout: default
|
|||
|
||||
</div>
|
||||
|
||||
<div class="aboutflex">
|
||||
<div class="trackcontainer logo">
|
||||
|
||||
<div class="track"
|
||||
style="background-image:url('{{ site.baseurl }}/assets/img/sakrecoer-logo.svg');box-shadow:none;">
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="trackcontainer logo">
|
||||
|
||||
<div class="track"
|
||||
style="background-image:url('{{site.baseurl }}/assets/img/basspistol-Patches.svg');box-shadow:none;">
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="trackcontainer logo">
|
||||
<div class="aboutflex" style="background: #fff;">
|
||||
<div class="trackcontainer logo" style="margin-top:0;padding-top:0;">
|
||||
{% include cookiemonster.html %}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -10,7 +10,7 @@ layout: default
|
|||
|
||||
<div class="pivot">
|
||||
|
||||
<h2>Sakrecoer</h2>
|
||||
<a href="{{ site.baseurl }}/"><h2>Sakrecoer</h2></a>
|
||||
<h1>Music</h1>
|
||||
</div>
|
||||
<div class="fullscreen-bg">
|
||||
|
|
Loading…
Reference in a new issue