refactor
This commit is contained in:
+300
@@ -0,0 +1,300 @@
|
||||
body {
|
||||
background-color: #dedede;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
hr {
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
button {
|
||||
border: solid 1pt #B0B0B0;
|
||||
font-family: MS Sans Serif, sans-serif;
|
||||
font-size: 11px;
|
||||
color: #191970;
|
||||
padding: 2px 7px 2px 7px;
|
||||
}
|
||||
|
||||
button:active {
|
||||
padding: 3px 6px 1px 8px;
|
||||
}
|
||||
|
||||
.ttl_css {
|
||||
position: absolute;
|
||||
text-shadow: 0 0 2px #fff;
|
||||
padding: 4px 8px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.25);
|
||||
background-color: #cfcfcf;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
box-shadow: 0 0 3px #000000;
|
||||
-webkit-box-shadow: 0 0 3px #000000;
|
||||
-moz-box-shadow: 0 0 3px #000000;
|
||||
|
||||
}
|
||||
|
||||
.findlg {
|
||||
filter: alpha(opacity=37);
|
||||
opacity: 0.37;
|
||||
-moz-opacity: 0.37;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.findlg:hover {
|
||||
filter: alpha(opacity=100);
|
||||
opacity: 1.00;
|
||||
-moz-opacity: 1.00;
|
||||
}
|
||||
|
||||
.gifin {
|
||||
position: absolute;
|
||||
left: 112px;
|
||||
top: 428px;
|
||||
padding: 5px;
|
||||
background-color: #fcfef3;
|
||||
border: 1px solid #6e6960;
|
||||
font-size: 12px;
|
||||
max-width: 300px;
|
||||
min-height: 100px;
|
||||
min-width: 150px;
|
||||
}
|
||||
|
||||
.pg_btn1 {
|
||||
width: 27px;
|
||||
height: 78px;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.pg_btn1:hover {
|
||||
background-position: -27px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.pg_btn1:active {
|
||||
background-position: -55px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.pg_btn2 {
|
||||
background-position: -54px;
|
||||
width: 27px;
|
||||
height: 78px;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.pg_btn2:hover {
|
||||
background-position: -27px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.pg_btn2:active {
|
||||
background-position: 1px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
progress {
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
.prog0 {
|
||||
width: 10em;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.prog0::-webkit-progress-bar {
|
||||
background-color: #eee;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
|
||||
}
|
||||
|
||||
.prog0[value]::-webkit-progress-value {
|
||||
background-image: -webkit-linear-gradient(-45deg,
|
||||
transparent 33%, rgba(0, 0, 0, .1) 33%,
|
||||
rgba(0, 0, 0, .1) 66%, transparent 66%),
|
||||
-webkit-linear-gradient(top,
|
||||
rgba(255, 255, 255, .25),
|
||||
rgba(0, 0, 0, .25)),
|
||||
-webkit-linear-gradient(left, #09c, #7FFFD4);
|
||||
|
||||
border-radius: 2px;
|
||||
background-size: 35px 20px, 100% 100%, 100% 100%;
|
||||
}
|
||||
|
||||
.prog1 {
|
||||
width: 10em;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.prog1::-webkit-progress-bar {
|
||||
background-color: #eee;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
|
||||
}
|
||||
|
||||
.prog1[value]::-webkit-progress-value {
|
||||
background-image: -webkit-linear-gradient(-45deg,
|
||||
transparent 33%, rgba(0, 0, 0, .1) 33%,
|
||||
rgba(0, 0, 0, .1) 66%, transparent 66%),
|
||||
-webkit-linear-gradient(top,
|
||||
rgba(255, 255, 255, .25),
|
||||
rgba(0, 0, 0, .25)),
|
||||
-webkit-linear-gradient(left, #7FFFD4, #F4A460);
|
||||
|
||||
border-radius: 2px;
|
||||
background-size: 35px 20px, 100% 100%, 100% 100%;
|
||||
}
|
||||
|
||||
.prog2 {
|
||||
width: 10em;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.prog2::-webkit-progress-bar {
|
||||
background-color: #eee;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
|
||||
}
|
||||
|
||||
.prog2[value]::-webkit-progress-value {
|
||||
background-image: -webkit-linear-gradient(-45deg,
|
||||
transparent 33%, rgba(0, 0, 0, .1) 33%,
|
||||
rgba(0, 0, 0, .1) 66%, transparent 66%),
|
||||
-webkit-linear-gradient(top,
|
||||
rgba(255, 255, 255, .25),
|
||||
rgba(0, 0, 0, .25)),
|
||||
-webkit-linear-gradient(left, #F4A460, #FFC0CB);
|
||||
|
||||
border-radius: 2px;
|
||||
background-size: 35px 20px, 100% 100%, 100% 100%;
|
||||
}
|
||||
|
||||
.prog3 {
|
||||
width: 10em;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.prog3::-webkit-progress-bar {
|
||||
background-color: #eee;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
|
||||
}
|
||||
|
||||
.prog3[value]::-webkit-progress-value {
|
||||
background-image: -webkit-linear-gradient(-45deg,
|
||||
transparent 33%, rgba(0, 0, 0, .1) 33%,
|
||||
rgba(0, 0, 0, .1) 66%, transparent 66%),
|
||||
-webkit-linear-gradient(top,
|
||||
rgba(255, 255, 255, .25),
|
||||
rgba(0, 0, 0, .25)),
|
||||
-webkit-linear-gradient(left, #FFC0CB, #FFD700);
|
||||
|
||||
border-radius: 2px;
|
||||
background-size: 35px 20px, 100% 100%, 100% 100%;
|
||||
}
|
||||
|
||||
.prog4 {
|
||||
width: 10em;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.prog4::-webkit-progress-bar {
|
||||
background-color: #eee;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
|
||||
}
|
||||
|
||||
.prog4[value]::-webkit-progress-value {
|
||||
background-image: -webkit-linear-gradient(-45deg,
|
||||
transparent 33%, rgba(0, 0, 0, .1) 33%,
|
||||
rgba(0, 0, 0, .1) 66%, transparent 66%),
|
||||
-webkit-linear-gradient(top,
|
||||
rgba(255, 255, 255, .25),
|
||||
rgba(0, 0, 0, .25)),
|
||||
-webkit-linear-gradient(left, #FFD700, #FF0000);
|
||||
|
||||
border-radius: 2px;
|
||||
background-size: 35px 20px, 100% 100%, 100% 100%;
|
||||
}
|
||||
|
||||
.prog5 {
|
||||
width: 10em;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.prog5::-webkit-progress-bar {
|
||||
background-color: #eee;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
|
||||
}
|
||||
|
||||
.prog5[value]::-webkit-progress-value {
|
||||
background-image: -webkit-linear-gradient(-45deg,
|
||||
transparent 33%, rgba(0, 0, 0, .1) 33%,
|
||||
rgba(0, 0, 0, .1) 66%, transparent 66%),
|
||||
-webkit-linear-gradient(top,
|
||||
rgba(255, 255, 255, .25),
|
||||
rgba(0, 0, 0, .25)),
|
||||
-webkit-linear-gradient(left, #FF0000, #FF0000);
|
||||
|
||||
border-radius: 2px;
|
||||
background-size: 35px 20px, 100% 100%, 100% 100%;
|
||||
}
|
||||
|
||||
.dvfirs {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
float: left;
|
||||
margin-left: 20px;
|
||||
width: 350px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.dvsec {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
float: left;
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.dvtre {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
float: left;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
div.grid-container-main {
|
||||
display: grid;
|
||||
grid-template-columns: 265px auto 111px;
|
||||
gap: 10px 5px;
|
||||
grid-template-areas:
|
||||
' . . .'
|
||||
'footer footer footer';
|
||||
}
|
||||
|
||||
div.grid-container-main > div {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
div.grid-container-main > div.bottom {
|
||||
grid-area: footer;
|
||||
}
|
||||
|
||||
div.grid-container-main > div.center {
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
span.donatedEkr {
|
||||
background-color: lightyellow;
|
||||
padding: 2px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user