Merge pull request 'Fix commit stages of files and the yuri css' (#5) from doughmination/ari-pages:main into main

Reviewed-on: https://git.gay/ari/pages/pulls/5

css/fonts.css

@@ -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;
 }

css/index.css

@@ -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);
+}

css/yuri.css

@@ -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 */

yuri/index.html

@@ -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>