f0ckv2/public/css/f0ck.css
Flummi c95e0d82f1 modified: public/css/f0ck.css
new file:   public/js/f0ck.js
	modified:   src/inc/routes/api.mjs
	modified:   src/inc/routes/index.mjs
modified:   src/websrv.mjs
	modified:   views/index.html.tpl
2019-04-26 04:19:20 +00:00

134 lines
2.4 KiB
CSS

/* f0ck.me Stylesheet v2 */
/* Created in April of 2019 by the notorious and super sexy Alman Abu Ottermann */
/* This style makes use of the Milligram CSS framework and might not work as expected without! */
/* Contact: sirx @ f0ck . it */
/* This style is not meant to be used anywhere else than on f0ck.me or any other f0ck related website! */
/*Theming*/
:root {
--primary-color: #302AE6;
--secondary-color: #536390;
--font-color: #424242;
--bg-color: #090f13;
--heading-color: #292922;
}
[data-theme="light"] {
--primary-color: #9A97F3;
--secondary-color: #818cab;
--font-color: #e1e1ff;
--bg-color: black;
--heading-color: #818cab;
}
/*End of Theming*/
/* Body */
body {
background-color: var(--bg-color);
color: var(--font-color);
/*overflow: hidden;*/
}
/* End of Body */
/* Fieldset & Legend
legend {
border-radius: 2px;
background: black;
font-family: monospace;
border: 1px white solid;
color: white;
}
fieldset {
border: 1px solid white;
padding: 20px;
background: black;
}
End of Fieldset & Legend */
/* NAV */
button {
background: #000101;
border: 1px solid white;
border-radius: 0px;
vertical-align: bottom !important;
}
img.logo {
height: 48px;
}
/* END OF NAV */
/* f0ck Grid! */
.f0ckgrid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
grid-gap: 20px;
align-items: stretch;
}
.f0ckgrid img {
box-shadow: 2px 2px 6px 0px rgb(0, 0, 0);
max-width: 100%;
}
/* End of f0ck Grid! */
/* Image Thumbs */
a img.thumb {
border: 2px solid black;
transition: .1s ease-out;
}
img.thumb:hover {
box-shadow: 0px 0px 0px 2px #dac8d2;
border-radius: 5px;
transition: .1s ease-in;
}
/* End of Image Thumbs */
/* List Styling
ul.f0ck-links {
list-style: none;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
}
li.post {
width: 128px;
height: 128px;
margin-top: 5px;
line-height: 128px;
float: left;
margin: 5px;
transition: .1s ease-out;
}
li.post:hover {
box-shadow: 0px 0px 0px 2px #dac8d2;
border-radius: 5px;
transition: .1s ease-in;
}
li.post:hover img {
border-radius: 5px;
opacity: 0.8;
}
End of List Styling */
/* MISC */
::-webkit-scrollbar {
width: 12px;
}
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}