remove alternate stylesheet
This commit is contained in:
parent
e8bd20c896
commit
3242975db3
|
|
@ -30,7 +30,6 @@ make' (GalleryInfo {title, prefix, filters, hidden}) infos = [b|@0
|
|||
<html lang=en>
|
||||
<meta charset=utf-8>
|
||||
<link rel=stylesheet href=/style/shiny/gallery.css title=shiny>
|
||||
<link rel='alternate stylesheet' href=/style/tum/gallery.css title=tummy>
|
||||
<link rel=alternate href=rss.xml type=application/rss+xml>
|
||||
|
||||
<script async src=/script/gallery.js></script>
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@ make' (IndexInfo {title, galleries, links, footer}) = [b|@0
|
|||
<html lang=en>
|
||||
<meta charset=utf-8>
|
||||
<link rel=stylesheet href=/style/shiny/index.css title=shiny>
|
||||
<link rel='alternate stylesheet' href=/style/tum/index.css title=tummy>
|
||||
|
||||
<title>$*title</title>
|
||||
|
||||
|
|
|
|||
|
|
@ -33,7 +33,6 @@ make' nsfw dir info@(Info {date, title, artist}) = [b|@0
|
|||
<meta charset=utf-8>
|
||||
<meta name=viewport content='width=1200,viewport-fit=cover'>
|
||||
<link rel=stylesheet href=/style/shiny/single.css title=shiny>
|
||||
<link rel='alternate stylesheet' href=/style/tum/single.css title=tummy>
|
||||
|
||||
<script async src=/script/single.js></script>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,131 +0,0 @@
|
|||
@import url(/fonts/muller/muller.css);
|
||||
|
||||
html {
|
||||
--thumb-size: 200px;
|
||||
--page-size: 1000px;
|
||||
|
||||
--back-dark: hsl(129, 54%, 54%);
|
||||
--back-light: hsl(119, 69%, 69%);
|
||||
--dark-tum: hsl(41, 41%, 79%);
|
||||
--light-tum: hsl(47, 59%, 85%);
|
||||
--lighter-tum: hsl(47, 74%, 89%);
|
||||
--text-hue: 42;
|
||||
--text: hsl(var(--text-hue), 25%, 24%);
|
||||
--text-link: hsl(111, 30%, 42%);
|
||||
--shadow: hsla(42, 25%, 24%, 60%);
|
||||
--bheight: 121px;
|
||||
--bplacement: 60vh;
|
||||
|
||||
background:
|
||||
url(border.png) left 0% bottom calc(var(--bplacement) - var(--bheight))
|
||||
repeat-x fixed,
|
||||
linear-gradient(to top,
|
||||
transparent var(--bplacement),
|
||||
var(--back-light) var(--bplacement),
|
||||
var(--back-dark))
|
||||
fixed,
|
||||
url(spots.png) repeat fixed,
|
||||
linear-gradient(to top,
|
||||
var(--dark-tum) 0vh,
|
||||
var(--lighter-tum) var(--bplacement))
|
||||
fixed;
|
||||
|
||||
color: var(--text);
|
||||
font-family: Muller;
|
||||
font-size: 16pt;
|
||||
|
||||
--red: hsl(347, 90%, 85%);
|
||||
--green: hsl(93, 80%, 73%);
|
||||
--yellow: hsl(60, 80%, 72%);
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
margin: 2rem auto;
|
||||
padding: 1em 1em 1.5em 1em;
|
||||
border: 5px solid var(--dark-tum);
|
||||
box-shadow: 0px 0px 50px var(--shadow);
|
||||
background: var(--lighter-tum);
|
||||
}
|
||||
|
||||
.corner {
|
||||
font-weight: 400;
|
||||
position: absolute;
|
||||
top: -0.5em;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 100%;
|
||||
}
|
||||
|
||||
.left.corner { left: -0.4em; }
|
||||
.right.corner { right: -0.4em; }
|
||||
|
||||
|
||||
b { font-weight: 600; }
|
||||
b b { font-weight: 900; }
|
||||
|
||||
h1, h2, h3 { font-weight: 900; }
|
||||
h1 { font-size: 150%; }
|
||||
h2 { font-size: 130%; }
|
||||
h3 { font-size: 100%; }
|
||||
h4 { font-size: 100%; font-weight: 600; }
|
||||
|
||||
header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
margin: 0 0 1em 0;
|
||||
--small: 90%;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
font-size: 300%;
|
||||
font-weight: 100;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
color: var(--text-link);
|
||||
font-weight: 500;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
ul > li {
|
||||
list-style: '— ';
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
section + section { margin-top: 1em; }
|
||||
section > section + section { margin-top: 0.75em; }
|
||||
|
||||
h1[id] a, h2[id] a, h3[id] a, h4[id] a, h5[id] a {
|
||||
color: inherit;
|
||||
font-weight: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
h1[id]:hover::after,
|
||||
h2[id]:hover::after,
|
||||
h3[id]:hover::after,
|
||||
h4[id]:hover::after,
|
||||
h5[id]:hover::after {
|
||||
content: ' §';
|
||||
opacity: 60%;
|
||||
}
|
||||
|
||||
b {
|
||||
/* rather than always 600 or whatever it does */
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.emoji {
|
||||
text-align: baseline;
|
||||
height: 1em;
|
||||
}
|
||||
BIN
style/tum/border.png (Stored with Git LFS)
BIN
style/tum/border.png (Stored with Git LFS)
Binary file not shown.
|
|
@ -1,172 +0,0 @@
|
|||
@import url(base.css);
|
||||
|
||||
body {
|
||||
--image-size: 200px;
|
||||
--grid-gap: 1.5em;
|
||||
--max-cols: 4;
|
||||
|
||||
max-width:
|
||||
calc(var(--max-cols) * var(--image-size) +
|
||||
(var(--max-cols) - 1) * var(--grid-gap) +
|
||||
4em);
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, var(--image-size));
|
||||
grid-gap: var(--grid-gap);
|
||||
justify-content: center;
|
||||
justify-items: center;
|
||||
align-items: start;
|
||||
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.item {
|
||||
--shadow-size: 10px;
|
||||
--border-thickness: 2px;
|
||||
|
||||
position: relative;
|
||||
width: var(--image-size);
|
||||
height: var(--image-size);
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
list-style: none;
|
||||
|
||||
box-shadow: 0 0 var(--shadow-size) var(--shadow);
|
||||
border: var(--border-thickness) solid var(--text);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.item.nsfw::after {
|
||||
--size: calc(1/4 * var(--image-size));
|
||||
content: url(../18_plus_white.svg);
|
||||
height: var(--size);
|
||||
width: var(--size);
|
||||
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
right: 3px;
|
||||
|
||||
transform: rotate(30deg);
|
||||
mix-blend-mode: multiply;
|
||||
}
|
||||
|
||||
figure {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.item figcaption {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: var(--border-thickness);
|
||||
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
|
||||
font-size: 80%;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
|
||||
background: hsla(47, 74%, 89%, 87%);
|
||||
text-shadow:
|
||||
-1px -1px 1px hsla(47, 74%, 89%, 87%),
|
||||
1px -1px 1px hsla(47, 74%, 89%, 87%),
|
||||
-1px 1px 1px hsla(47, 74%, 89%, 87%),
|
||||
1px 1px 1px hsla(47, 74%, 89%, 87%);
|
||||
border-top: 2px solid var(--text);
|
||||
}
|
||||
|
||||
.year-marker {
|
||||
background: var(--text);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
grid-area: auto / 1 / auto / auto;
|
||||
}
|
||||
|
||||
.year-text {
|
||||
color: var(--lighter-tum);
|
||||
transform: rotate(-45deg);
|
||||
font-weight: 900;
|
||||
font-size: 300%;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size: 90%;
|
||||
text-align: center;
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
|
||||
@media (hover) {
|
||||
.item:not(.year-marker):hover {
|
||||
--shadow-size: 20px;
|
||||
}
|
||||
|
||||
.item:hover figcaption {
|
||||
opacity: 20%;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion) {
|
||||
.item:hover figcaption {
|
||||
transform: translateY(80%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
.item:hover img {
|
||||
filter: contrast(120%);
|
||||
}
|
||||
|
||||
.item:hover figcaption {
|
||||
transform: translate(-20%, 80%) rotateZ(7deg);
|
||||
}
|
||||
|
||||
.item, .item figcaption, .item img {
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (hover: none) {
|
||||
.item:not(.year-marker) {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.item a {
|
||||
display: block;
|
||||
margin: 0;
|
||||
height: var(--image-size);
|
||||
}
|
||||
|
||||
.item img {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.item figcaption {
|
||||
position: static;
|
||||
background: hsl(0, 0%, 100%, 50%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-transparency) {
|
||||
.item figcaption {
|
||||
background: hsl(47, 74%, 89%);
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.item:hover figcaption {
|
||||
opacity: 100%;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,113 +0,0 @@
|
|||
@import url(base.css);
|
||||
|
||||
body {
|
||||
width: 40em;
|
||||
}
|
||||
|
||||
.list {
|
||||
display: grid;
|
||||
align-items: center;
|
||||
--gap: 0.05em;
|
||||
grid-gap: var(--gap);
|
||||
background: var(--text);
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
font-size: 150%;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
#gallery-list {
|
||||
grid-template-columns: repeat(2, 50%);
|
||||
}
|
||||
|
||||
#link-list {
|
||||
grid-template-columns: 100%;
|
||||
}
|
||||
|
||||
#gallery-list + #link-list {
|
||||
padding-top: var(--gap);
|
||||
}
|
||||
|
||||
.list a {
|
||||
display: block;
|
||||
font-weight: inherit;
|
||||
color: var(--text);
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.list a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.list li {
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#gallery-list li {
|
||||
background: var(--green);
|
||||
}
|
||||
|
||||
li.nsfw {
|
||||
background: var(--red);
|
||||
}
|
||||
|
||||
.link-list li {
|
||||
background: var(--yellow);
|
||||
}
|
||||
|
||||
@media screen {
|
||||
.nsfw a::after {
|
||||
content: url(../18_plus.svg);
|
||||
display: inline-block;
|
||||
width: 1em; height: 1em;
|
||||
padding-left: 0.15em;
|
||||
vertical-align: -0.1em;
|
||||
}
|
||||
}
|
||||
@media speech {
|
||||
.nsfw::after {
|
||||
content: ' (some nsfw)';
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
margin: 1.5em auto 0;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
#mutstd-note {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#peace-sign {
|
||||
display: block;
|
||||
height: 2em;
|
||||
padding-left: 0.5em;
|
||||
transform: rotate(20deg);
|
||||
}
|
||||
|
||||
@media (hover) and (prefers-reduced-motion: no-preference) {
|
||||
main a:hover {
|
||||
transform: scale(110%);
|
||||
transition: transform 0.25s ease-in-out;
|
||||
}
|
||||
}
|
||||
|
||||
@media (pointer: coarse) {
|
||||
main {
|
||||
font-size: 300%;
|
||||
}
|
||||
|
||||
.nsfw a::after {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,164 +0,0 @@
|
|||
@import url(base.css);
|
||||
|
||||
body {
|
||||
max-width: calc(var(--page-size) + 200px);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#date, #artist {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
#mainfig {
|
||||
justify-content: center;
|
||||
border: 2px solid var(--text);
|
||||
box-shadow: 0 0 30px var(--shadow);
|
||||
margin: auto;
|
||||
height: min-content;
|
||||
width: min-content;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#mainimg {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#cw {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
|
||||
background: hsla(var(--text-hue), 35%, 15%, 80%);
|
||||
mix-blend-mode: multiply;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#cw-text {
|
||||
font-size: 300%;
|
||||
font-weight: 600;
|
||||
color: white;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
|
||||
#cw + * img {
|
||||
filter: blur(50px);
|
||||
opacity: 75%;
|
||||
background: var(--text);
|
||||
}
|
||||
|
||||
figcaption p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.info {
|
||||
margin: 1em auto;
|
||||
width: var(--page-size);
|
||||
}
|
||||
|
||||
.info > section {
|
||||
display: grid;
|
||||
--grid-gap: 1em;
|
||||
grid-gap: var(--grid-gap);
|
||||
grid-template-columns:
|
||||
calc(20% - var(--grid-gap) / 2) calc(80% - var(--grid-gap) / 2);
|
||||
justify-content: center;
|
||||
align-items: baseline;
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
.info h2 {
|
||||
font-size: inherit;
|
||||
font-weight: 500;
|
||||
margin: 0;
|
||||
justify-self: end;
|
||||
}
|
||||
|
||||
.info ul, .alts ul {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: -0.5em;
|
||||
}
|
||||
|
||||
.alts ul {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.alts [type=checkbox], .alts [type=radio] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.alts :checked + label {
|
||||
background: var(--yellow);
|
||||
border-color: var(--text);
|
||||
}
|
||||
|
||||
.alts .nsfw label::after {
|
||||
content: url(../18_plus.svg);
|
||||
display: inline-block;
|
||||
height: 0.8em; width: 0.8em;
|
||||
vertical-align: -0.1em;
|
||||
padding-left: 0.15em;
|
||||
}
|
||||
|
||||
.info ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.info li, .alts li {
|
||||
list-style: none;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.info li, .alts label {
|
||||
padding: 0 0.5em;
|
||||
margin: 0 0.25em;
|
||||
background: var(--light-tum);
|
||||
border: 1px solid var(--dark-tum);
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.info p:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.info p {
|
||||
margin: 0.25em 0;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size: 90%;
|
||||
font-style: italic;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
@media (pointer: coarse) {
|
||||
.info, .alts {
|
||||
font-size: 200%;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size: 150%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-transparency) {
|
||||
#cw {
|
||||
background: hsl(var(--text-hue), 35%, 15%);
|
||||
mix-blend-mode: normal;
|
||||
}
|
||||
|
||||
#cw + * img {
|
||||
filter: initial;
|
||||
}
|
||||
}
|
||||
BIN
style/tum/spots.png (Stored with Git LFS)
BIN
style/tum/spots.png (Stored with Git LFS)
Binary file not shown.
Loading…
Reference in New Issue