c0de/fintic-tracker
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Update style.css

Browse Source
This commit is contained in:
Justin
2022-06-10 17:59:06 +08:00
committed by GitHub
parent db764be44e
commit b7416f5e0a
1 changed files with 442 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

442
static/style.css
View File

@@ -103,6 +103,18 @@ header {
background-color: black; background-color: black;
color: grey; color: grey;
} }
.set-btn:focus,
.fa-chevron-right:focus,
.fa-chevron-left:focus,
.fa-chevron-up:focus,
.fa-chevron-down:focus,
.fa-minus:focus,
.update-btn:focus,
.save-btn:focus {
box-shadow:none;
}
.row-2 { .row-2 {
border-bottom: 2px solid white; border-bottom: 2px solid white;
padding-bottom: 30px; padding-bottom: 30px;
@@ -121,6 +133,12 @@ header {
height: 370px; height: 370px;
overflow-y: scroll; overflow-y: scroll;
} }
.features-div-two ul {
padding:0.8rem;
padding-top:0;
}
.display-features-list { .display-features-list {
list-style-type: none; list-style-type: none;
} }
@@ -383,5 +401,429 @@ li.active {
} }
.main-div {
position: relative;
margin: 10px;
background-color: transparent;
}
.main-div2::before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
-webkit-box-shadow: 0 0 17px 3px #ffff01,0 0 4px 2px #ffff01;
box-shadow: 0 0 17px 3px #ffff01,0 0 4px 2px #ffff01;
z-index: -1;
-webkit-animation-name: gradient-shadow;
animation-name: gradient-shadow;
-webkit-animation-timing-function: ease;
animation-timing-function: ease;
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
}
.main-div3::before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 50%;
height: 100%;
-webkit-box-shadow: 0 0 17px 3px #ffff01,0 0 4px 2px #ffff01;
box-shadow: 0 0 17px 3px #ffff01,0 0 4px 2px #ffff01;
z-index: -1;
-webkit-animation-name: half-yellow-shadow;
animation-name: half-yellow-shadow;
-webkit-animation-timing-function: ease;
animation-timing-function: ease;
-webkit-animation-duration: 5s;
animation-duration: 5s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
}
.main-div3::after {
content: '';
position: absolute;
right: 0;
bottom: 0;
width: 50%;
height: 100%;
-webkit-box-shadow: 0 0 17px 3px #0ff,0 0 4px 2px #0ff;
box-shadow: 0 0 17px 3px #0ff,0 0 4px 2px #0ff;
z-index: -1;
-webkit-animation-name: half-cyan-shadow;
animation-name: half-cyan-shadow;
-webkit-animation-timing-function: ease;
animation-timing-function: ease;
-webkit-animation-duration: 5s;
animation-duration: 5s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
}
h1 {
font-size: 50px;
margin: 0;
position: relative;
z-index: 3;
padding: 20px;
background-color: #060C1F;
color: #fff;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
}
@-webkit-keyframes yellow-shadow {
0% {
top: 0;
left: 0;
}
25% {
top: 50%;
left: 0;
}
50% {
top: 50%;
left: 50%;
}
75% {
top: 0;
left: 50%;
}
100% {
top: 0;
left: 0;
}
}
@keyframes yellow-shadow {
0% {
top: 0;
left: 0;
}
25% {
top: 50%;
left: 0;
}
50% {
top: 50%;
left: 50%;
}
75% {
top: 0;
left: 50%;
}
100% {
top: 0;
left: 0;
}
}
@-webkit-keyframes cyan-shadow {
0% {
right: 0;
bottom: 0;
}
25% {
right: 0;
bottom: 50%;
}
50% {
right: 50%;
bottom: 50%;
}
75% {
right: 50%;
bottom: 0;
}
100% {
right: 0;
bottom: 0;
}
}
@keyframes cyan-shadow {
0% {
right: 0;
bottom: 0;
}
25% {
right: 0;
bottom: 50%;
}
50% {
right: 50%;
bottom: 50%;
}
75% {
right: 50%;
bottom: 0;
}
100% {
right: 0;
bottom: 0;
}
}
@-webkit-keyframes gradient-shadow {
0% {
-webkit-box-shadow: 0 0 17px 3px #C586C0,0 0 4px 2px #C586C0;
box-shadow: 0 0 17px 3px #C586C0,0 0 4px 2px #C586C0;
}
20% {
-webkit-box-shadow: 0 0 17px 3px #0ff,0 0 4px 2px #0ff;
box-shadow: 0 0 17px 3px #0ff,0 0 4px 2px #0ff;
}
40% {
-webkit-box-shadow: 0 0 17px 3px #0f0,0 0 4px 2px #0f0;
box-shadow: 0 0 17px 3px #0f0,0 0 4px 2px #0f0;
}
60% {
-webkit-box-shadow: 0 0 17px 3px #ffff01,0 0 4px 2px #ffff01;
box-shadow: 0 0 17px 3px #ffff01,0 0 4px 2px #ffff01;
}
80% {
-webkit-box-shadow: 0 0 17px 3px #f00,0 0 4px 2px #f00;
box-shadow: 0 0 17px 3px #f00,0 0 4px 2px #f00;
}
100% {
-webkit-box-shadow: 0 0 17px 3px #C586C0,0 0 4px 2px #C586C0;
box-shadow: 0 0 17px 3px #C586C0,0 0 4px 2px #C586C0;
}
}
@keyframes gradient-shadow {
0% {
-webkit-box-shadow: 0 0 17px 3px #C586C0,0 0 4px 2px #C586C0;
box-shadow: 0 0 17px 3px #C586C0,0 0 4px 2px #C586C0;
}
20% {
-webkit-box-shadow: 0 0 17px 3px #0ff,0 0 4px 2px #0ff;
box-shadow: 0 0 17px 3px #0ff,0 0 4px 2px #0ff;
}
40% {
-webkit-box-shadow: 0 0 17px 3px #0f0,0 0 4px 2px #0f0;
box-shadow: 0 0 17px 3px #0f0,0 0 4px 2px #0f0;
}
60% {
-webkit-box-shadow: 0 0 17px 3px #ffff01,0 0 4px 2px #ffff01;
box-shadow: 0 0 17px 3px #ffff01,0 0 4px 2px #ffff01;
}
80% {
-webkit-box-shadow: 0 0 17px 3px #f00,0 0 4px 2px #f00;
box-shadow: 0 0 17px 3px #f00,0 0 4px 2px #f00;
}
100% {
-webkit-box-shadow: 0 0 17px 3px #C586C0,0 0 4px 2px #C586C0;
box-shadow: 0 0 17px 3px #C586C0,0 0 4px 2px #C586C0;
}
}
@-webkit-keyframes half-yellow-shadow {
0% {
top: 0;
left: 0;
height: 50%;
width: 50%;
}
16.66% {
top: 0;
left: 0;
height: 50%;
width: 100%;
}
32.32% {
top: 0;
left: 50%;
height: 50%;
width: 50%;
}
49.98% {
top: 50%;
left: 50%;
height: 50%;
width: 50%;
}
66.64% {
top: 50%;
left: 0;
height: 50%;
width: 100%;
}
83.3% {
top: 50%;
left: 0;
height: 50%;
width: 50%;
}
100% {
top: 0;
left: 0;
height: 50%;
width: 50%;
}
}
@keyframes half-yellow-shadow {
0% {
top: 0;
left: 0;
height: 50%;
width: 50%;
}
16.66% {
top: 0;
left: 0;
height: 50%;
width: 100%;
}
32.32% {
top: 0;
left: 50%;
height: 50%;
width: 50%;
}
49.98% {
top: 50%;
left: 50%;
height: 50%;
width: 50%;
}
66.64% {
top: 50%;
left: 0;
height: 50%;
width: 100%;
}
83.3% {
top: 50%;
left: 0;
height: 50%;
width: 50%;
}
100% {
top: 0;
left: 0;
height: 50%;
width: 50%;
}
}
@-webkit-keyframes half-cyan-shadow {
0% {
bottom: 0;
right: 0;
height: 50%;
width: 50%;
}
16.66% {
bottom: 0;
right: 0;
height: 50%;
width: 100%;
}
32.32% {
bottom: 0;
right: 50%;
height: 50%;
width: 50%;
}
49.98% {
bottom: 50%;
right: 50%;
height: 50%;
width: 50%;
}
66.64% {
bottom: 50%;
right: 0;
height: 50%;
width: 100%;
}
83.3% {
bottom: 50%;
right: 0;
height: 50%;
width: 50%;
}
100% {
bottom: 0;
right: 0;
height: 50%;
width: 50%;
}
}
@keyframes half-cyan-shadow {
0% {
bottom: 0;
right: 0;
height: 50%;
width: 50%;
}
16.66% {
bottom: 0;
right: 0;
height: 50%;
width: 100%;
}
32.32% {
bottom: 0;
right: 50%;
height: 50%;
width: 50%;
}
49.98% {
bottom: 50%;
right: 50%;
height: 50%;
width: 50%;
}
66.64% {
bottom: 50%;
right: 0;
height: 50%;
width: 100%;
}
83.3% {
bottom: 50%;
right: 0;
height: 50%;
width: 50%;
}
100% {
bottom: 0;
right: 0;
height: 50%;
width: 50%;
}
}