Fix yuri css

This commit is contained in:
Clove 2026-06-14 03:35:41 +01:00
parent 81588d8de5
commit fc2dbfd7e5
4 changed files with 14 additions and 362 deletions

View File

@ -1,71 +1,43 @@
@font-face {
<<<<<<< HEAD
font-family: "Comic Code";
src:
url("https://fonts.doughmination.co.uk/ComicCode-Regular_2022-05-24-151938_hsmz.woff2")
format("woff2"),
url("https://fonts.doughmination.co.uk/ComicCode-Regular_2022-05-24-151938_hsmz.woff")
format("woff");
=======
font-display: swap;
font-family: 'Comic Code';
src: url('https://fonts.doughmination.co.uk/ComicCode-Regular_2022-05-24-151938_hsmz.woff2') format('woff2'),
url('https://fonts.doughmination.co.uk/ComicCode-Regular_2022-05-24-151938_hsmz.woff') format('woff');
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
font-weight: 400;
font-style: normal;
}
@font-face {
<<<<<<< HEAD
font-family: "Comic Code";
src:
url("https://fonts.doughmination.co.uk/ComicCode-Italic_2022-05-24-151939_rdtu.woff2")
format("woff2"),
url("https://fonts.doughmination.co.uk/ComicCode-Italic_2022-05-24-151939_rdtu.woff")
format("woff");
=======
font-display: swap;
font-family: 'Comic Code';
src: url('https://fonts.doughmination.co.uk/ComicCode-Italic_2022-05-24-151939_rdtu.woff2') format('woff2'),
url('https://fonts.doughmination.co.uk/ComicCode-Italic_2022-05-24-151939_rdtu.woff') format('woff');
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
font-weight: 400;
font-style: italic;
}
@font-face {
<<<<<<< HEAD
font-family: "Comic Code";
src:
url("https://fonts.doughmination.co.uk/ComicCode-Medium_2022-05-24-151941_ugqm.woff2")
format("woff2"),
url("https://fonts.doughmination.co.uk/ComicCode-Medium_2022-05-24-151941_ugqm.woff")
format("woff");
=======
font-display: swap;
font-family: 'Comic Code';
src: url('https://fonts.doughmination.co.uk/ComicCode-Medium_2022-05-24-151941_ugqm.woff2') format('woff2'),
url('https://fonts.doughmination.co.uk/ComicCode-Medium_2022-05-24-151941_ugqm.woff') format('woff');
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
font-weight: 500;
font-style: normal;
}
@font-face {
<<<<<<< HEAD
font-family: "Comic Code";
src:
url("https://fonts.doughmination.co.uk/ComicCode-Bold_2022-05-24-152309_zqkm.woff2")
format("woff2"),
url("https://fonts.doughmination.co.uk/ComicCode-Bold_2022-05-24-152309_zqkm.woff")
format("woff");
=======
font-display: swap;
font-family: 'Comic Code';
src: url('https://fonts.doughmination.co.uk/ComicCode-Bold_2022-05-24-152309_zqkm.woff2') format('woff2'),
url('https://fonts.doughmination.co.uk/ComicCode-Bold_2022-05-24-152309_zqkm.woff') format('woff');
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
font-weight: 700;
font-style: normal;
}

View File

@ -345,3 +345,16 @@ body.message-page {
padding: 1.75rem 1.5rem;
}
}
.yuri-card {
background: var(--surface-0);
padding: 2.5rem;
border-radius: 12px;
max-width: 900px;
width: 100%;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
text-align: center;
line-height: 1.6;
color: var(--text);
border: 1px solid var(--surface-1);
}

View File

@ -1,332 +0,0 @@
/* IMPORTS */
@import url("fonts.css");
@import url(theme-switcher.css);
@import url("picker.css");
@import url(themes/mocha.css);
@import url(themes/macchiato.css);
@import url(themes/frappe.css);
@import url(themes/latte.css);
/* Index.html */
html,
body {
display: flex;
justify-content: center;
align-items: center;
padding: 1.5rem 1rem;
height: 100%;
width: 100%;
overflow: hidden;
font-family: "Comic Code", sans-serif;
overflow-x: hidden;
max-width: 100vw;
margin: 0;
min-height: 100vh;
background: linear-gradient(
135deg,
var(--base) 0%,
var(--mantle) 60%,
var(--crust) 100%
);
color: var(--text);
}
html {
background: linear-gradient(
135deg,
var(--base) 0%,
var(--mantle) 60%,
var(--crust) 100%
);
}
.hub {
position: auto;
z-index: 1;
width: 100%;
max-width: 460px;
}
.pfp {
width: 96px;
height: 96px;
border-radius: 50%;
object-fit: cover;
border: 3px solid var(--mauve);
box-shadow: 0 4px 18px rgba(245, 194, 231, 0.25);
margin-bottom: 0.75rem;
}
.hub-header {
text-align: center;
margin-bottom: 2.25rem;
}
.hub-header h1 {
margin: 0;
font-size: 2rem;
font-weight: 700;
transition: color 0.6s ease;
}
.hey {
color: #ffffff;
}
.name {
color: rgb(var(--accent-rgb));
}
.name::before {
content: " ";
}
.tagline {
margin: 0.35rem 0 0;
color: var(--subtext-0);
font-size: 0.95rem;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.pronouns {
margin: 0.35rem 0 0;
color: var(--mauve);
font-size: 0.95rem;
letter-spacing: 0.04em;
text-transform: lowercase;
}
body::before {
content: "";
position: fixed;
inset: 0;
background: url(/assets/theme/estrogen.svg) center / cover no-repeat;
filter: invert(86%) sepia(8%) saturate(900%) hue-rotate(190deg)
brightness(105%);
opacity: 0.05;
pointer-events: none;
z-index: 0;
}
.badges {
position: fixed;
right: 1rem;
bottom: 1rem;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 0.4rem;
pointer-events: none;
z-index: 5;
}
.badge {
display: inline-flex;
align-items: center;
gap: 0.4rem;
padding: 0.3rem 0.6rem;
border-radius: 999px;
background: var(--surface-0);
border: 1px solid rgba(var(--accent-rgb), 0.45);
color: var(--subtext-1);
font-size: 0.75rem;
white-space: nowrap;
transition:
border-color 0.6s ease,
box-shadow 0.6s ease;
}
.badge:hover {
border-color: rgb(var(--accent-rgb));
box-shadow: 0 4px 14px -6px rgba(var(--accent-rgb), 0.5);
}
.badge-icon {
width: 15px;
height: 15px;
filter: invert(78%) sepia(36%) saturate(640%) hue-rotate(280deg)
brightness(105%);
}
@media (max-width: 600px) {
.intro {
margin-top: 10vh;
color: var(--text);
text-align: center;
padding: 5vh;
}
.intro-text {
margin-top: 1vh;
padding: 1vh;
}
}
@media (min-width: 768px) {
.desktop-break {
display: block;
}
.intro-text {
margin-top: 1vh;
}
}
.gitgay-link {
background-color: var(--mauve);
border: none;
color: black;
padding: 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 15px;
font-family: "Comic Code";
}
.hub-header,
.pfp,
.hey,
.pronouns,
.intro-text,
.gitgay-link {
margin-top: 10px;
margin-bottom: 10px;
}
/* ---- 88x31 button wall (always visible on desktop) ---- */
.button-wall {
position: fixed;
bottom: 1rem;
left: 50%;
transform: translateX(-50%);
z-index: 5;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0.5rem;
max-width: min(90vw, 480px);
}
/* hide on mobile */
@media (max-width: 768px) {
.button-wall {
display: none;
}
}
.button-wall a {
display: block;
line-height: 0;
}
.button-wall img {
width: 88px;
height: 31px;
image-rendering: pixelated;
border: 1px solid var(--surface-1);
border-radius: 2px;
transition:
transform 0.12s ease,
border-color 0.12s ease;
}
.button-wall a:hover img {
transform: translateY(-2px);
border-color: rgb(var(--accent-rgb));
}
/* Coffee/index.html */
.teapot {
font-size: 6vh;
}
/* start of code from security.girlsnetwork.dev/coffee */
body.message-page {
display: flex;
min-height: 100vh;
align-items: center;
justify-content: center;
padding: 1.5rem;
}
.message-card {
background: var(--surface0);
padding: 2.5rem;
border-radius: 12px;
max-width: 520px;
width: 100%;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
text-align: center;
line-height: 1.6;
color: var(--text);
border: 1px solid var(--surface1);
}
.message-card h1 {
margin-top: 0;
color: var(--pink);
letter-spacing: -0.01em;
}
.message-card p {
color: var(--subtext1);
}
.message-card .ok {
color: var(--green);
}
.message-card .err {
color: var(--red);
}
.message-card .warn {
color: var(--yellow);
}
.message-card .muted {
color: var(--overlay1);
font-size: 0.9rem;
margin-top: 1.5rem;
}
.message-card code {
background: var(--mantle);
color: var(--rosewater);
padding: 0.1rem 0.4rem;
border-radius: 6px;
font-size: 0.85em;
}
.message-card a.home-link {
display: inline-block;
margin-top: 1.5rem;
color: var(--pink);
transition: color 0.15s ease;
}
.message-card a.home-link:hover {
color: var(--flamingo);
text-decoration: underline;
}
.message-card .glyph {
font-size: 2.75rem;
line-height: 1;
margin-bottom: 0.5rem;
}
@media (max-width: 540px) {
.message-card {
padding: 1.75rem 1.5rem;
}
}
/* end of code from security.girlsnetwork.dev/coffee */

View File

@ -74,11 +74,10 @@
<meta name="theme-color" content="#cba6f7" />
<link href="/css/index.css" rel="stylesheet" />
<link href="/css/picker.css" rel="stylesheet" />
</head>
<body class="message-page">
<div class="message-card">
<div class="yuri-card">
<pre id="yuri" class="yuri"></pre>
</div>
</body>