Move from pico.css to mirageCSS (#1)
UI/UX changes: PicoCSS -> mirageCSS, rice-box.go removed and placed on .gitignore (since it is generated anyway), update templates. Signed-off-by: Aoi K <koizumi.aoi@kyoko-project.wer.ee> Co-authored-by: Aoi K <koizumi.aoi@kyoko-project.wer.ee> Reviewed-on: https://git.mills.io/prologic/spyda/pulls/1 Co-authored-by: Aoi Koizumi (古泉 あおい) <novaburst@noreply@mills.io> Co-committed-by: Aoi Koizumi (古泉 あおい) <novaburst@noreply@mills.io>
This commit is contained in:
Aoi Koizumi (古泉 あおい)
committed by
James Mills
James Mills
parent
a6d10baaf3
commit
7001f3bf51
547
internal/static/css/01-mirage.css
Normal file
547
internal/static/css/01-mirage.css
Normal file
@@ -0,0 +1,547 @@
|
||||
@charset "UTF-8";
|
||||
/*
|
||||
* Make web 2.0 websites without JavaScript!!
|
||||
* Developers : KiddyTheKid & Aoi Koizumi
|
||||
* Licensed under GNU Affero General Public License version 3
|
||||
* Version : 1.1.5
|
||||
* Modified for use with KyokoNet/spyda
|
||||
*/
|
||||
@keyframes anim-nova-toggle {
|
||||
from {
|
||||
max-height: 0px; }
|
||||
to {
|
||||
max-height: 500px; } }
|
||||
|
||||
* {
|
||||
font-family: 'Oswald', sans-serif, monospace, 'Segoe UI Emoji';
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
*:root {
|
||||
background: #000000;
|
||||
color: #A9A9A9; }
|
||||
|
||||
address, area, article, aside, audio, blockquote, datalist,
|
||||
dl, details, fieldset, figure, form, input, iframe, meter,
|
||||
nav, ol, optgroup, option, output, p, pre, progress, ruby,
|
||||
section {
|
||||
margin-bottom: 1rem; }
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box; }
|
||||
@media (min-width: 400px) {
|
||||
.container {
|
||||
width: 85%;
|
||||
padding: 0; } }
|
||||
@media (min-width: 550px) {
|
||||
.container {
|
||||
width: 80%; } }
|
||||
.row .col {
|
||||
width: 100%;
|
||||
float: left;
|
||||
box-sizing: border-box; }
|
||||
@media (min-width: 550px) {
|
||||
.row .col {
|
||||
margin-left: 4%; }
|
||||
.row .col:first-child, .row .col:first-child {
|
||||
margin-left: 0; } }
|
||||
@media (min-width: 550px) {
|
||||
.row .one {
|
||||
width: 4.66666666667%; }
|
||||
.row .two {
|
||||
width: 13.3333333333%; }
|
||||
.row .three {
|
||||
width: 22%; }
|
||||
.row .four {
|
||||
width: 30.6666666667%; }
|
||||
.row .five {
|
||||
width: 39.3333333333%; }
|
||||
.row .six {
|
||||
width: 48%; }
|
||||
.row .seven {
|
||||
width: 56.6666666667%; }
|
||||
.row .eight {
|
||||
width: 65.3333333333%; }
|
||||
.row .nine {
|
||||
width: 74.0%; }
|
||||
.row .ten {
|
||||
width: 82.6666666667%; }
|
||||
.row .eleven {
|
||||
width: 91.3333333333%; }
|
||||
.row .twelve {
|
||||
width: 100%;
|
||||
margin-left: 0; }
|
||||
.row .fill-one {
|
||||
margin-left: 8.66666666667%; }
|
||||
.row .fill-two {
|
||||
margin-left: 17.3333333333%; }
|
||||
.row .fill-three {
|
||||
margin-left: 26%; }
|
||||
.row .fill-four {
|
||||
margin-left: 34.6666666667%; }
|
||||
.row .fill-five {
|
||||
margin-left: 43.3333333333%; }
|
||||
.row .fill-six {
|
||||
margin-left: 52%; }
|
||||
.row .fill-seven {
|
||||
margin-left: 60.6666666667%; }
|
||||
.row .fill-eight {
|
||||
margin-left: 69.3333333333%; }
|
||||
.row .fill-nine {
|
||||
margin-left: 78.0%; }
|
||||
.row .fill-ten {
|
||||
margin-left: 86.6666666667%; }
|
||||
.row .fill-eleven {
|
||||
margin-left: 95.3333333333%; } }
|
||||
|
||||
blockquote {
|
||||
padding: 1.5rem;
|
||||
background: #111111;
|
||||
border-left: 5px solid #222222; }
|
||||
blockquote *:last-child {
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 0; }
|
||||
|
||||
fieldset {
|
||||
margin-top: 1rem;
|
||||
padding: 2rem;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px; }
|
||||
|
||||
input {
|
||||
font-family: "Oswald", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Comic Mono";
|
||||
padding: 6px 12px;
|
||||
margin-bottom: .5rem;
|
||||
background: #111111;
|
||||
color: #eeeeee;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box; }
|
||||
|
||||
img {
|
||||
margin-bottom: 1rem;
|
||||
max-width: 100%; }
|
||||
|
||||
ol {
|
||||
padding-left: 2rem; }
|
||||
ol ul {
|
||||
margin-bottom: 0; }
|
||||
ol ol {
|
||||
margin-bottom: 0; }
|
||||
|
||||
pre {
|
||||
font-family: Consolas, monaco, "Ubuntu Mono", "Liberation Mono", "Courier New", Courier, monospace;
|
||||
background: #111111;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px;
|
||||
padding: 3px 6px;
|
||||
font-size: 0.9em;
|
||||
padding: 1rem 1.4rem;
|
||||
max-width: 100%;
|
||||
overflow: auto; }
|
||||
pre code {
|
||||
background: inherit;
|
||||
font-size: inherit;
|
||||
color: inherit;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0; }
|
||||
|
||||
table {
|
||||
margin-bottom: 1rem;
|
||||
border-collapse: collapse;
|
||||
width: 100%; }
|
||||
table caption {
|
||||
font-weight: bold;
|
||||
margin-bottom: .5rem; }
|
||||
|
||||
textarea {
|
||||
margin-bottom: 1rem;
|
||||
max-width: 100%;
|
||||
padding: 6px 12px;
|
||||
margin-bottom: .5rem;
|
||||
background: #111111;
|
||||
color: #eeeeee;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box; }
|
||||
|
||||
ul {
|
||||
margin-bottom: 1rem;
|
||||
padding-left: 2rem; }
|
||||
ul ul {
|
||||
margin-bottom: 0; }
|
||||
ul ol {
|
||||
margin-bottom: 0; }
|
||||
|
||||
video {
|
||||
margin-bottom: 1rem; }
|
||||
|
||||
html {
|
||||
font-family: "Oswald", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Comic Mono"; }
|
||||
|
||||
select {
|
||||
font-family: "Oswald", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Comic Mono";
|
||||
padding: 6px 12px;
|
||||
margin-bottom: .5rem;
|
||||
background: #111111;
|
||||
color: #eeeeee;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box; }
|
||||
|
||||
button {
|
||||
font-family: "Oswald", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Comic Mono";
|
||||
font-size: 1rem;
|
||||
display: inline-block;
|
||||
padding: 6px 12px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
background: #FFFFFF;
|
||||
color: #000000;
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
color: #000000; }
|
||||
button:focus {
|
||||
background: #FFFFFF; }
|
||||
button:enabled:hover {
|
||||
background: #FFFFFF; }
|
||||
|
||||
body {
|
||||
margin: 0 auto;
|
||||
padding: 2rem;
|
||||
border-radius: 6px;
|
||||
overflow-x: hidden;
|
||||
word-break: break-word;
|
||||
overflow-wrap: break-word;
|
||||
color: #eeeeee;
|
||||
font-size: 1.03rem;
|
||||
line-height: 1.5; }
|
||||
body::selection {
|
||||
background: #FFFFFF;
|
||||
color: #FFFFFF; }
|
||||
|
||||
h1 {
|
||||
line-height: 1;
|
||||
color: #ffffff;
|
||||
padding-top: .875rem;
|
||||
padding-bottom: 2px;
|
||||
margin-bottom: 8px;
|
||||
border-bottom: 1px solid #111111;
|
||||
font-size: 2.25rem; }
|
||||
|
||||
h2 {
|
||||
line-height: 1;
|
||||
color: #ffffff;
|
||||
padding-top: .875rem;
|
||||
padding-bottom: 2px;
|
||||
margin-bottom: 8px;
|
||||
border-bottom: 1px solid #111111;
|
||||
font-size: 1.85rem; }
|
||||
|
||||
h3 {
|
||||
line-height: 1;
|
||||
color: #ffffff;
|
||||
padding-top: .875rem;
|
||||
color: #ffffff;
|
||||
padding-bottom: 2px;
|
||||
margin-bottom: 8px;
|
||||
border-bottom: 1px solid #111111;
|
||||
font-size: 1.55rem; }
|
||||
|
||||
h4 {
|
||||
line-height: 1;
|
||||
color: #ffffff;
|
||||
padding-top: .875rem;
|
||||
margin-bottom: .3rem;
|
||||
font-size: 1.25rem; }
|
||||
|
||||
h5 {
|
||||
line-height: 1;
|
||||
color: #ffffff;
|
||||
padding-top: .875rem;
|
||||
margin-bottom: .3rem;
|
||||
font-size: 1rem; }
|
||||
|
||||
h6 {
|
||||
line-height: 1;
|
||||
color: #ffffff;
|
||||
padding-top: .875rem;
|
||||
margin-bottom: .3rem;
|
||||
font-size: .875rem; }
|
||||
|
||||
a {
|
||||
color: #FFFFFF; }
|
||||
a:hover {
|
||||
color: #FFFFFF; }
|
||||
a button {
|
||||
font-size: 1rem;
|
||||
display: inline-block;
|
||||
padding: 6px 12px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
background: #FFFFFF;
|
||||
color: #000000;
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
color: #000000; }
|
||||
a button[disabled] {
|
||||
cursor: default;
|
||||
opacity: .5;
|
||||
cursor: not-allowed; }
|
||||
|
||||
abbr {
|
||||
cursor: help; }
|
||||
abbr:hover {
|
||||
cursor: help; }
|
||||
|
||||
header {
|
||||
background: #111111;
|
||||
border-bottom: 1px solid #222222;
|
||||
padding: 2rem 1.5rem;
|
||||
margin: -2rem calc(0px - (50vw - 50%)) 2rem;
|
||||
padding-left: calc(50vw - 50%);
|
||||
padding-right: calc(50vw - 50%); }
|
||||
header h1 {
|
||||
padding-bottom: 0;
|
||||
border-bottom: 0; }
|
||||
header h2 {
|
||||
padding-bottom: 0;
|
||||
border-bottom: 0; }
|
||||
header h3 {
|
||||
padding-bottom: 0;
|
||||
border-bottom: 0; }
|
||||
header > *:first-child {
|
||||
margin-top: 0;
|
||||
padding-top: 0; }
|
||||
header > *:last-child {
|
||||
margin-bottom: 0; }
|
||||
|
||||
input[type="submit"] {
|
||||
font-size: 1rem;
|
||||
display: inline-block;
|
||||
padding: 6px 12px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
background: #FFFFFF;
|
||||
color: #000000;
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
color: #000000; }
|
||||
input[type="submit"]:focus {
|
||||
background: #FFFFFF; }
|
||||
input[type="submit"]:enabled:hover {
|
||||
background: #FFFFFF; }
|
||||
|
||||
input[type="reset"] {
|
||||
font-size: 1rem;
|
||||
display: inline-block;
|
||||
padding: 6px 12px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
background: #FFFFFF;
|
||||
color: #000000;
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
color: #000000; }
|
||||
input[type="reset"]:focus {
|
||||
background: #FFFFFF; }
|
||||
input[type="reset"]:enabled:hover {
|
||||
background: #FFFFFF; }
|
||||
|
||||
input[type="button"] {
|
||||
font-size: 1rem;
|
||||
display: inline-block;
|
||||
padding: 6px 12px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
background: #FFFFFF;
|
||||
color: #000000;
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
color: #000000; }
|
||||
input[type="button"]:focus {
|
||||
background: #FFFFFF; }
|
||||
input[type="button"]:enabled:hover {
|
||||
background: #FFFFFF; }
|
||||
|
||||
button[disabled] {
|
||||
cursor: default;
|
||||
opacity: .5;
|
||||
cursor: not-allowed; }
|
||||
|
||||
input[type="submit"][disabled] {
|
||||
cursor: default;
|
||||
opacity: .5;
|
||||
cursor: not-allowed; }
|
||||
|
||||
input[type="reset"][disabled] {
|
||||
cursor: default;
|
||||
opacity: .5;
|
||||
cursor: not-allowed; }
|
||||
|
||||
input[type="button"][disabled] {
|
||||
cursor: default;
|
||||
opacity: .5;
|
||||
cursor: not-allowed; }
|
||||
|
||||
.button:focus {
|
||||
background: #FFFFFF; }
|
||||
|
||||
.button:enabled:hover {
|
||||
background: #FFFFFF; }
|
||||
|
||||
code {
|
||||
font-family: Consolas, monaco, "Ubuntu Mono", "Liberation Mono", "Courier New", Courier, monospace;
|
||||
background: #111111;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px;
|
||||
padding: 3px 6px;
|
||||
font-size: 0.9em; }
|
||||
code pre {
|
||||
display: inline;
|
||||
background: inherit;
|
||||
font-size: inherit;
|
||||
color: inherit;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0; }
|
||||
|
||||
kbd {
|
||||
font-family: Consolas, monaco, "Ubuntu Mono", "Liberation Mono", "Courier New", Courier, monospace;
|
||||
background: #111111;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px;
|
||||
padding: 3px 6px;
|
||||
font-size: 0.9em;
|
||||
border-bottom: 3px solid #222222; }
|
||||
|
||||
samp {
|
||||
font-family: Consolas, monaco, "Ubuntu Mono", "Liberation Mono", "Courier New", Courier, monospace;
|
||||
background: #111111;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px;
|
||||
padding: 3px 6px;
|
||||
font-size: 0.9em; }
|
||||
|
||||
.nova-menu-button {
|
||||
padding: .6rem 1rem;
|
||||
background: #111111;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px;
|
||||
display: block;
|
||||
position: relative;
|
||||
text-align: center; }
|
||||
.nova-menu-button summary::marker {
|
||||
content: '' !important;
|
||||
display: none !important; }
|
||||
@media (min-width: 550px) {
|
||||
.nova-menu-button {
|
||||
display: none; } }
|
||||
.nova-menu-list {
|
||||
display: none;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding-left: 0;
|
||||
overflow: hidden; }
|
||||
.nova-menu-list li {
|
||||
display: block;
|
||||
position: relative; }
|
||||
@media (min-width: 550px) {
|
||||
.nova-menu-list {
|
||||
display: block;
|
||||
text-align: left; }
|
||||
.nova-menu-list li {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
margin: auto 12px; } }
|
||||
.nova-menu-button[open] + .nova-menu-list {
|
||||
display: block;
|
||||
max-height: 0px;
|
||||
padding-bottom: 15px;
|
||||
background: #111111;
|
||||
border: 1px solid #222222;
|
||||
border-radius: 4px;
|
||||
animation-name: anim-nova-toggle;
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode: forwards; }
|
||||
|
||||
dt {
|
||||
font-weight: bold; }
|
||||
|
||||
dd::before {
|
||||
content: '→ '; }
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
border-bottom: 1px solid #222222;
|
||||
margin: 1rem auto; }
|
||||
|
||||
legend {
|
||||
padding: auto .5rem; }
|
||||
|
||||
td {
|
||||
border: 1px solid #222222;
|
||||
text-align: left;
|
||||
padding: .5rem; }
|
||||
|
||||
th {
|
||||
border: 1px solid #222222;
|
||||
text-align: left;
|
||||
padding: .5rem;
|
||||
background: #111111; }
|
||||
|
||||
tr:nth-child(even) {
|
||||
background: #111111; }
|
||||
|
||||
li {
|
||||
margin-top: .4rem; }
|
||||
|
||||
mark {
|
||||
padding: 3px 6px;
|
||||
background: #FFFFFF;
|
||||
color: #FFFFFF; }
|
||||
|
||||
footer {
|
||||
text-align: center; }
|
||||
|
||||
.container:after, .row:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both; }
|
||||
|
||||
.full-width {
|
||||
width: 100%;
|
||||
box-sizing: border-box; }
|
||||
|
||||
.nova-brand-logo {
|
||||
display: block;
|
||||
position: relative;
|
||||
text-align: center; }
|
||||
.nova-brand-logo img {
|
||||
width: 85%; }
|
||||
@media (min-width: 550px) {
|
||||
.nova-brand-logo {
|
||||
width: 120px; } }
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,229 +0,0 @@
|
||||
|
||||
i[class*="icss-"] {
|
||||
position: relative;
|
||||
display:inline-block;
|
||||
font-style: normal;
|
||||
background-color:currentColor;
|
||||
box-sizing: border-box;
|
||||
vertical-align: middle;
|
||||
}
|
||||
i[class*="icss-"]:before,
|
||||
i[class*="icss-"]:after {
|
||||
content: "";
|
||||
border-width: 0;
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Size */
|
||||
[class*="icss-"].xxsmall {
|
||||
font-size: .45em;
|
||||
}
|
||||
[class*="icss-"].xsmall {
|
||||
font-size: .5em;
|
||||
}
|
||||
[class*="icss-"].small {
|
||||
font-size: .65em;
|
||||
}
|
||||
[class*="icss-"].x1_5 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
[class*="icss-"].x2 {
|
||||
font-size: 2em;
|
||||
}
|
||||
[class*="icss-"].x2_5 {
|
||||
font-size: 2.5em;
|
||||
}
|
||||
[class*="icss-"].x3 {
|
||||
font-size: 3em;
|
||||
}
|
||||
[class*="icss-"].x4 {
|
||||
font-size: 4em;
|
||||
}
|
||||
[class*="icss-"].x5 {
|
||||
font-size: 5em;
|
||||
}
|
||||
|
||||
/* Align text-bottom */
|
||||
i[class*="icss-"].bottom {
|
||||
vertical-align:text-bottom;
|
||||
}
|
||||
|
||||
/* flip */
|
||||
.flip {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
/* rotate */
|
||||
i[class*="icss-"].rot10 {
|
||||
transform: rotate(10deg);
|
||||
}
|
||||
i[class*="icss-"].rot-10 {
|
||||
transform: rotate(-10deg);
|
||||
}
|
||||
i[class*="icss-"].rot20 {
|
||||
transform: rotate(20deg);
|
||||
}
|
||||
i[class*="icss-"].rot-20 {
|
||||
transform: rotate(-20deg);
|
||||
}
|
||||
i[class*="icss-"].rot45 {
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
i[class*="icss-"].rot-45 {
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
i[class*="icss-"].rot90 {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
i[class*="icss-"].rot-90 {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
i[class*="icss-"].rot180 {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
i[class*="icss-"].rot-180 {
|
||||
transform: rotate(-180deg);
|
||||
}
|
||||
|
||||
/* force animation */
|
||||
i.icss-anim,
|
||||
i.icss-anim:before,
|
||||
i.icss-anim:after {
|
||||
transition: all 1s;
|
||||
}
|
||||
|
||||
/* Spin */
|
||||
.icss-spin {
|
||||
animation: spin 2s infinite linear;
|
||||
}
|
||||
.icss-pulse {
|
||||
animation: spin 1s infinite steps(8);
|
||||
}
|
||||
|
||||
.icss-spin-hover:hover {
|
||||
animation: spin 2s infinite linear;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
|
||||
/* BELL */
|
||||
@keyframes ring {
|
||||
0%{transform:rotate(-15deg)}
|
||||
2%{transform:rotate(15deg)}
|
||||
4%{transform:rotate(-18deg)}
|
||||
6%{transform:rotate(18deg)}
|
||||
8%{transform:rotate(-22deg)}
|
||||
10%{transform:rotate(22deg)}
|
||||
12%{transform:rotate(-18deg)}
|
||||
14%{transform:rotate(18deg)}
|
||||
16%{transform:rotate(-12deg)}
|
||||
18%{transform:rotate(12deg)}
|
||||
20%,100%{transform:rotate(0deg)}
|
||||
}
|
||||
|
||||
.icss-ring {
|
||||
animation: ring 2s infinite ease;
|
||||
}
|
||||
.icss-ring-hover:hover {
|
||||
animation: ring 2s infinite ease;
|
||||
}
|
||||
|
||||
/* VERTICAL */
|
||||
@keyframes vertical {
|
||||
0%{transform:translate(0,-3px)}
|
||||
4%{transform:translate(0,3px)}
|
||||
8%{transform:translate(0,-3px)}
|
||||
12%{transform:translate(0,3px)}
|
||||
16%{transform:translate(0,-3px)}
|
||||
20%{transform:translate(0,3px)}
|
||||
22%,100%{transform:translate(0,0)}
|
||||
}
|
||||
.icss-vibes,
|
||||
.icss-vibes-hover:hover {
|
||||
animation: vertical 2s ease infinite;
|
||||
}
|
||||
|
||||
/* HORIZONTAL */
|
||||
@keyframes horizontal {
|
||||
0%{transform:translate(0,0)}
|
||||
6%{transform:translate(5px,0)}
|
||||
12%{transform:translate(0,0)}
|
||||
18%{transform:translate(5px,0)}
|
||||
24%{transform:translate(0,0)}
|
||||
30%{transform:translate(5px,0)}
|
||||
36%,100%{transform:translate(0,0)}
|
||||
}
|
||||
.icss-shake,
|
||||
.icss-shake-hover:hover {
|
||||
animation: horizontal 2s ease infinite;
|
||||
}
|
||||
|
||||
/* TADA */
|
||||
@keyframes tada {
|
||||
0% {transform: scale(1)}
|
||||
10%,20% {transform:scale(.9) rotate(-8deg);}
|
||||
30%,50%,70% {transform:scale(1.3) rotate(8deg)}
|
||||
40%,60% {transform:scale(1.3) rotate(-8deg)}
|
||||
80%,100% {transform:scale(1) rotate(0)}
|
||||
}
|
||||
|
||||
.icss-tada,
|
||||
.icss-tada-hover:hover{
|
||||
animation: tada 2s linear infinite;
|
||||
}
|
||||
|
||||
/* Reverse animation */
|
||||
.icss-reverse {
|
||||
animation-direction: reverse;
|
||||
}
|
||||
[class*="-hover"].icss-reverse:hover {
|
||||
animation-direction: reverse;
|
||||
}
|
||||
|
||||
/* Stack icons */
|
||||
.icss-stack {
|
||||
position: relative;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.icss-stack i[class*="icss-"] {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-.5em, -.5em);
|
||||
}
|
||||
|
||||
.icss-stack i[class*="icss-"].bottom {
|
||||
bottom: 0;
|
||||
top: auto;
|
||||
}
|
||||
|
||||
/* shadow icon */
|
||||
.icss-shadow {
|
||||
position: relative;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.icss-shadow i[class*="icss-"] {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-.5em, -.5em);
|
||||
}
|
||||
|
||||
.icss-shadow i[class*="icss-"]:first-child {
|
||||
top: 54%;
|
||||
left: 54%;
|
||||
}
|
||||
@@ -1,157 +0,0 @@
|
||||
i.icss-plus {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
background-color: transparent;
|
||||
margin: 0;
|
||||
}
|
||||
i.icss-plus:before,
|
||||
i.icss-plus:after {
|
||||
width: 1em;
|
||||
height: .18em;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
border-radius: .06em;
|
||||
background-color: currentColor;
|
||||
}
|
||||
|
||||
i.icss-plus:before {
|
||||
transform: translate(-50%, -50%) rotate(-180deg)
|
||||
}
|
||||
i.icss-plus:after{
|
||||
transform: translate(-50%, -50%) rotate(90deg)
|
||||
}
|
||||
i.icss-search {
|
||||
width: .73em;
|
||||
height: .73em;
|
||||
background-color: transparent;
|
||||
border-width: .12em;
|
||||
border-style: solid;
|
||||
border-radius: 100%;
|
||||
margin: 0 .27em .27em 0;
|
||||
}
|
||||
i.icss-search:before {
|
||||
top: .635em;
|
||||
left: .485em;
|
||||
border-width: .08em .23em;
|
||||
border-style: solid;
|
||||
border-radius: .03em;
|
||||
transform: rotate(45deg);
|
||||
box-shadow: -.18em 0 0 -.03em
|
||||
}
|
||||
i.icss-search:after {
|
||||
|
||||
}
|
||||
i.icss-key {
|
||||
height: .55em;
|
||||
width: .5em;
|
||||
background: transparent;
|
||||
border-radius: 50% / 47%;
|
||||
box-shadow: inset -.05em 0 0 .18em;
|
||||
margin: .225em .45em .225em .05em;
|
||||
transform: rotate(45deg);
|
||||
transform-origin: .5em 50%;
|
||||
}
|
||||
.icss-stack i.icss-key {
|
||||
transform: translate(-.5em, -.5em) rotate(45deg);
|
||||
}
|
||||
i.icss-key:before {
|
||||
width: .14em;
|
||||
height: .14em;
|
||||
box-shadow: inset .5em .5em,
|
||||
-.09em .09em,
|
||||
-.18em .18em,
|
||||
-.27em .27em
|
||||
;
|
||||
top: 50%;
|
||||
left: .84em;
|
||||
transform: translateY(-50%) scaleX(.95) rotate(45deg);
|
||||
}
|
||||
i.icss-key:after {
|
||||
width: .61em;
|
||||
height: .2em;
|
||||
box-shadow: inset .27em -.13em;
|
||||
top: 50%;
|
||||
left: .3em;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
i.icss-gear {
|
||||
width: .5em;
|
||||
height: .5em;
|
||||
position: relative;
|
||||
border-radius: 100%;
|
||||
background-color: transparent;
|
||||
border-width: .07em;
|
||||
border-style: solid;
|
||||
border-color: transparent;
|
||||
margin: .25em;
|
||||
box-shadow: 0 0 0 .1em, inset 0 0 0 .3em;
|
||||
}
|
||||
i.icss-gear:before {
|
||||
width: .18em;
|
||||
height: .18em;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
box-shadow: .41em 0, -.41em 0, 0 .41em, 0 -.41em;
|
||||
}
|
||||
|
||||
i.icss-gear:after {
|
||||
width: .18em;
|
||||
height: .18em;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%) rotate(45deg);
|
||||
box-shadow: .42em 0, -.42em 0, 0 .42em, 0 -.42em;
|
||||
}
|
||||
i.icss-exit {
|
||||
width: .6em;
|
||||
height: .8em;
|
||||
background-color: transparent;
|
||||
box-shadow: inset 0 0 0 .065em;
|
||||
border-radius: .05em;
|
||||
margin: .1em .3em .1em .1em;
|
||||
}
|
||||
i.icss-exit:before {
|
||||
width: .4em;
|
||||
height: .8em;
|
||||
transform: perspective(1em) rotateY(-30deg);
|
||||
transform-origin: 0 50%;
|
||||
box-shadow:
|
||||
inset -.06em .37em,
|
||||
inset .24em .37em,
|
||||
inset -.06em -.36em,
|
||||
inset .24em -.36em;
|
||||
border-radius: .03em;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
i.icss-exit:after {
|
||||
width: .36em;
|
||||
height: .36em;
|
||||
border: .18em solid transparent;
|
||||
border-right-color: currentColor;
|
||||
transform: translateY(-50%);
|
||||
box-shadow: .16em 0 0 -.08em;
|
||||
top: 50%;
|
||||
left: .45em;
|
||||
}
|
||||
i.icss-bars{
|
||||
margin: .41em 0;
|
||||
}
|
||||
i.icss-bars,
|
||||
i.icss-bars:before,
|
||||
i.icss-bars:after {
|
||||
width: 1em;
|
||||
height: .18em;
|
||||
border-radius: .06em;
|
||||
background-color: currentColor;
|
||||
}
|
||||
|
||||
i.icss-bars:before {
|
||||
top: -0.36em;
|
||||
left: 0;
|
||||
}
|
||||
i.icss-bars:after{
|
||||
top: 0.36em;
|
||||
left: 0;
|
||||
}
|
||||
@@ -1,154 +0,0 @@
|
||||
body, html {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
article p img {
|
||||
display: block;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
article hgroup h3 {
|
||||
margin-left: 60px;
|
||||
}
|
||||
|
||||
article hgroup footer {
|
||||
margin-left: 60px;
|
||||
}
|
||||
|
||||
.invisible {
|
||||
visibility:hidden;
|
||||
width:0;
|
||||
height:0;
|
||||
}
|
||||
.invisible.width-none{
|
||||
width: 0px !important;
|
||||
}
|
||||
|
||||
.nav {
|
||||
z-index: 1050;
|
||||
}
|
||||
|
||||
.captchaInput {
|
||||
width: 50% !important;
|
||||
}
|
||||
|
||||
/* Fix spacing for Search/Go button and icons */
|
||||
.icss-search {
|
||||
margin-right:20px !important;
|
||||
}
|
||||
|
||||
#cookie-law{
|
||||
background-color: rgb(50, 50, 50) !important;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
#cookie-law p{
|
||||
color: #ffffff;
|
||||
font-size: 13px;
|
||||
text-align: center;
|
||||
background-color: rgb(50, 50, 50) !important;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
#cookie-law p a[role=button]{
|
||||
margin: 10px 0px 0px 10px;
|
||||
padding: 5px 15px;
|
||||
font-size: 13px;
|
||||
color: #dcdcdc !important;
|
||||
border-color: 1px solid var(--primary) !important;
|
||||
border-radius: 0.25rem !important;
|
||||
}
|
||||
|
||||
/* Footer Style */
|
||||
footer{
|
||||
border-top: 1px solid var(--primary);
|
||||
background-color: rgba(234, 232, 232, 0.1);
|
||||
font-size: 85%;
|
||||
}
|
||||
@media (min-width: 576px) {
|
||||
footer {
|
||||
font-size: 83%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
footer {
|
||||
font-size: 81%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) {
|
||||
footer {
|
||||
font-size: 79%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
footer {
|
||||
font-size: 77%;
|
||||
}
|
||||
}
|
||||
body > footer{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-content: center;
|
||||
}
|
||||
footer .footer-menu{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
footer .footer-menu a{
|
||||
margin-right: 10px;
|
||||
padding-right: 10px;
|
||||
position: relative;
|
||||
}
|
||||
footer .footer-menu a::after{
|
||||
content: '';
|
||||
height: 12px;
|
||||
width: 1px;
|
||||
background-color: #929292;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
bottom: 4px;
|
||||
}
|
||||
footer .footer-menu a:last-child{
|
||||
border: none;
|
||||
padding-right: 0px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
footer .footer-menu a:last-child::after{
|
||||
content: none;
|
||||
}
|
||||
|
||||
@media (max-width: 576px) {
|
||||
nav{
|
||||
justify-content: unset;
|
||||
-webkit-justify-content: unset;
|
||||
-moz-justify-content: unset;
|
||||
-ms-justify-content: unset;
|
||||
}
|
||||
[data-tooltip]:not(a):not(button):not(input){
|
||||
border-bottom: none;
|
||||
}
|
||||
#cookie-law p a[role=button]{
|
||||
display: block;
|
||||
width: 20%;
|
||||
margin: 10px auto 0px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
nav.pagination-nav{
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
@media (max-width: 1200px) {
|
||||
/* Footer Style */
|
||||
body > footer{
|
||||
text-align: center;
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
footer .footer-copyright{
|
||||
margin-top: 10px;
|
||||
}
|
||||
footer .footer-menu{
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
3
internal/static/css/spyda.min.css
vendored
3
internal/static/css/spyda.min.css
vendored
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user