fix page css

Author: recursivezero

app/static/css/tiny.css

@@ -1,3 +1,17 @@
+html,
+body {
+  height: 100%;
+  margin: 0;
+  font-family: Arial;
+  padding: 0;
+  font-family: "Poppins", system-ui, Arial, sans-serif;
+  background: var(--bg);
+  background-size: cover;
+  background-position: center;
+  background-size: cover;
+  background-position: center;
+}
+
 :root {
   --bg: #0a0a0c;
   --glass: rgba(255, 255, 255, 0.03);
@@ -13,10 +27,8 @@ body {
   font-family: "Inter", system-ui, sans-serif;
   margin: 0;
   overflow-x: hidden;
-  background-image: radial-gradient(circle at 50% -20%, #1e1e2e 0%, transparent 50%);
 }
 
-
 body.light-theme {
   --bg: #f9fafb;
   --glass: rgba(0, 0, 0, 0.03);
@@ -29,23 +41,21 @@ body.light-theme {
   background-image: none;
 }
 
+.container {
+  display: grid;
+  grid-template-rows: auto 1fr auto;
+  min-height: 100vh;
+}
+
 .main-layout {
-  max-width: 940px;
-  margin: 0 auto;
-  padding: 6rem 1rem 4rem;
+  width: 90%;
+  margin: 2rem auto;
   display: flex;
   flex-direction: column;
-  gap: 2rem;
-}
-
-.page {
-  padding-top: 6rem;
+  gap: 1rem;
 }
 
 .app-header {
-  position: fixed;
-  top: 0;
-  left: 0;
   width: 100%;
   height: 55px;
   display: flex;
@@ -146,7 +156,6 @@ body.dark-theme .app-header {
   width: 100%;
 }
 
-
 .dark-theme .nav-link.active::after {
   background: #f8fafc;
 }
@@ -212,7 +221,7 @@ body.dark-theme .app-header {
   border: 1px solid var(--glass-border);
   border-radius: 1.5rem;
   padding: 1rem;
-  font-size: 1rem;
+  font-size: 2rem;
   color: var(--text-primary);
 }
 
@@ -225,6 +234,7 @@ body.dark-theme .app-header {
   border: none;
   cursor: pointer;
   transition: background 0.3s;
+  font-size: larger;
 }
 
 .btn-primary:hover {
@@ -247,7 +257,6 @@ body.dark-theme .app-header {
   cursor: pointer;
 }
 
-
 .result-card {
   width: 100%;
   background: linear-gradient(145deg, rgba(99, 102, 241, 0.1), rgba(0, 0, 0, 0));
@@ -334,7 +343,6 @@ body.dark-theme .app-header {
   align-items: center;
 }
 
-
 .scroll-container {
   display: flex;
   gap: 1rem;
@@ -559,7 +567,6 @@ body.dark-theme .app-header {
   border-bottom: 1px solid var(--glass-border);
 }
 
-
 @media (max-width: 1024px) {
   .recent-page-container {
     padding: 0 18px;
@@ -584,6 +591,9 @@ footer.big-footer {
   border-top: 1px solid var(--glass-border);
   padding: 4rem 1rem 2rem;
   margin-top: 4rem;
+  position: fixed;
+  bottom: 0;
+  width: 100%;
 }
 
 .footer-grid {
@@ -731,7 +741,6 @@ body.dark-theme .footer-bottom a {
 
 .recent-tray .recent-item .original-url,
 .recent-tray .recent-item .original-url a {
-
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
@@ -767,4 +776,4 @@ body.light-theme .history-link {
 
 .history-link:hover {
   opacity: 0.7;
-}
+}