app

commit 5e553bf4767108d59ae9f6b350b10e70f6381953
parent 16a7bee0a03a4f67c1178f290342c7d4602314d2
Author: triesap <triesap@radroots.dev>
Date:   Thu, 22 Jan 2026 16:12:05 +0000

app: harmonize imported css layers

- drop duplicated utilities from app/app.css in favor of apps-ui/base
- keep only app-specific overlays and shared ui surface helpers
- align base stylesheet background to tokens
- preserve list and theme layering order

Diffstat:
M
app/app.css
 | 
231
-------------------------------------------------------------------------------
M
app/stylesheets/apps-base.css
 | 
2
+-

2 files changed, 1 insertion(+), 232 deletions(-)
diff --git a/app/app.css b/app/app.css
@@ -46,22 +46,6 @@
     pointer-events: none;
   }
 
-  button:focus,
-  select:focus {
-    outline: none;
-  }
-
-  select {
-    appearance: none;
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    background: transparent;
-    background-image: none;
-  }
-
-  select::-ms-expand {
-    display: none;
-  }
 }
 
 @layer components {
@@ -97,35 +81,6 @@
     backdrop-filter: blur(18px) saturate(180%);
   }
 
-  .scroll-hide::-webkit-scrollbar {
-    display: none;
-  }
-
-  .scroll-hide {
-    -ms-overflow-style: none;
-    scrollbar-width: none;
-  }
-
-  .fade-in {
-    opacity: 0;
-    animation: fade-in 250ms ease-in-out forwards;
-  }
-
-  .fade-in-long {
-    opacity: 0;
-    animation: fade-in 350ms ease-in-out forwards;
-  }
-
-  .pre-wrap-text {
-    white-space: pre-wrap;
-  }
-
-  .flex-fluid {
-    width: 100%;
-    height: 100%;
-    flex: 1 0 100%;
-  }
-
   .rounded-touch {
     border-radius: var(--radius-xl);
   }
@@ -140,165 +95,6 @@
     min-height: var(--size-line-button);
   }
 
-  .carousel-container {
-    display: flex;
-    flex-grow: 1;
-    overflow-x: hidden;
-    scroll-snap-type: x mandatory;
-    list-style: none;
-    scroll-behavior: smooth;
-    -webkit-overflow-scrolling: touch;
-  }
-
-  .carousel-item {
-    scroll-snap-align: start;
-  }
-
-  .carousel-container-trellis {
-    display: flex;
-    flex-grow: 1;
-    height: 100%;
-    width: 100%;
-  }
-
-  .carousel-item-trellis {
-    display: flex;
-    flex-direction: column;
-    width: fit-content;
-    padding: 0 var(--space-4);
-    gap: var(--space-4);
-    justify-content: flex-start;
-    align-items: center;
-  }
-
-  .entry-line-fluid {
-    width: 100%;
-    height: 100%;
-    border-radius: var(--radius-xl);
-  }
-
-  .entry-textarea-wrap {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    align-items: center;
-    border-radius: var(--radius-xl);
-  }
-
-  .entry-line-wrap {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    padding: 0 var(--space-2);
-    align-items: center;
-  }
-
-  .button-base {
-    display: flex;
-    flex-direction: row;
-    justify-content: center;
-    align-items: center;
-    font: var(--type-subheadline);
-    text-transform: lowercase;
-    transition: all var(--dur-2) var(--ease-ios);
-    user-select: none;
-    cursor: pointer;
-  }
-
-  .button-simple {
-    height: var(--size-line-button);
-    background: var(--bg-elevated);
-    color: var(--text-primary);
-  }
-
-  .button-submit {
-    height: var(--size-line-button);
-    min-width: 82px;
-    border-radius: var(--radius-xl);
-    background: var(--accent);
-    color: var(--accent-contrast);
-  }
-
-  .spinner8 {
-    position: relative;
-    display: inline-block;
-    width: 1em;
-    height: 1em;
-  }
-
-  .spinner8.center {
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
-    margin: auto;
-  }
-
-  .spinner8 .spinner8-blade {
-    position: absolute;
-    left: 0.4629em;
-    bottom: 0;
-    width: 0.1em;
-    height: 0.2777em;
-    border-radius: 0.0555em;
-    background-color: transparent;
-    transform-origin: center -0.2222em;
-    animation: spinner-fade-base 1s infinite linear;
-  }
-
-  .spinner8-white .spinner8-blade-white {
-    position: absolute;
-    left: 0.4629em;
-    bottom: 0;
-    width: 0.1em;
-    height: 0.2777em;
-    border-radius: 0.0555em;
-    background-color: transparent;
-    transform-origin: center -0.2222em;
-    animation: spinner-fade-white 1s infinite linear;
-  }
-
-  .spinner8 .spinner8-blade:nth-child(1) {
-    animation-delay: 0s;
-    transform: rotate(0deg);
-  }
-
-  .spinner8 .spinner8-blade:nth-child(2) {
-    animation-delay: 0.125s;
-    transform: rotate(45deg);
-  }
-
-  .spinner8 .spinner8-blade:nth-child(3) {
-    animation-delay: 0.25s;
-    transform: rotate(90deg);
-  }
-
-  .spinner8 .spinner8-blade:nth-child(4) {
-    animation-delay: 0.375s;
-    transform: rotate(135deg);
-  }
-
-  .spinner8 .spinner8-blade:nth-child(5) {
-    animation-delay: 0.5s;
-    transform: rotate(180deg);
-  }
-
-  .spinner8 .spinner8-blade:nth-child(6) {
-    animation-delay: 0.625s;
-    transform: rotate(225deg);
-  }
-
-  .spinner8 .spinner8-blade:nth-child(7) {
-    animation-delay: 0.75s;
-    transform: rotate(270deg);
-  }
-
-  .spinner8 .spinner8-blade:nth-child(8) {
-    animation-delay: 0.875s;
-    transform: rotate(315deg);
-  }
-
   [data-ui="dialog-overlay"],
   [data-ui="sheet-overlay"] {
     position: fixed;
@@ -368,33 +164,6 @@
   }
 }
 
-@keyframes fade-in {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes spinner-fade-white {
-  0% {
-    background-color: #ffffff;
-  }
-  100% {
-    background-color: transparent;
-  }
-}
-
-@keyframes spinner-fade-base {
-  0% {
-    background-color: var(--text-secondary);
-  }
-  100% {
-    background-color: transparent;
-  }
-}
-
 @keyframes sheet-slide-in {
   0% {
     transform: translateY(110%);
diff --git a/app/stylesheets/apps-base.css b/app/stylesheets/apps-base.css
@@ -1,5 +1,5 @@
 :root {
-    background-color: #000000;
+    background-color: var(--bg-app);
 }
 
 html {