From 4b79bca8147090e760a9f76efa74d993486b22f6 Mon Sep 17 00:00:00 2001
From: Melnyk Mykhailo <m.melnyk.ia12@kpi.ua>
Date: Sat, 3 Feb 2024 23:10:28 +0200
Subject: [PATCH] remove danger style property aka star code

---
 src/app/auth/page.tsx         |  2 +-
 src/app/globals.css           | 34 ++++++++++++++++++++++++++++++++++
 src/app/profile/page.tsx      |  2 +-
 src/app/verification/page.tsx |  2 +-
 4 files changed, 37 insertions(+), 3 deletions(-)

diff --git a/src/app/auth/page.tsx b/src/app/auth/page.tsx
index 3eef63c..dfaa933 100644
--- a/src/app/auth/page.tsx
+++ b/src/app/auth/page.tsx
@@ -6,7 +6,7 @@ import { ThemeToggler } from '@/components/ui/theme-toggler'
 
 export default function Auth() {
   return (
-    <AuthContent className="*:*:pt-36 md:*:*:pt-10">
+    <AuthContent className="auth-page">
       <ImageCard className="-my-[4.375rem] hidden md:flex">
         <Icons.golub />
       </ImageCard>
diff --git a/src/app/globals.css b/src/app/globals.css
index dfa32ea..118134c 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -95,3 +95,37 @@
     @apply text-xs uppercase;
   }
 }
+
+.auth-page section {
+  padding-top: 9rem;
+  padding-bottom: 9rem;
+}
+
+@media (min-width: theme('screens.md')) {
+  .auth-page section {
+    padding-top: 2.5rem;
+    padding-bottom: 2.5rem;
+  }
+}
+
+.profile-page section {
+  flex-direction: column;
+  flex-grow: 1;
+}
+
+@media (min-width: theme('screens.md')) {
+  .profile-page section {
+    flex-direction: row;
+    flex-grow: 0;
+  }
+}
+
+.verification-page section {
+  flex-direction: column;
+}
+
+@media (min-width: theme('screens.md')) {
+  .verification-page section {
+    flex-direction: row;
+  }
+}
diff --git a/src/app/profile/page.tsx b/src/app/profile/page.tsx
index e601122..a185d04 100644
--- a/src/app/profile/page.tsx
+++ b/src/app/profile/page.tsx
@@ -6,7 +6,7 @@ import { ThemeToggler } from '@/components/ui/theme-toggler'
 
 export default function Profile() {
   return (
-    <AuthContent className="*:*:flex-col *:*:grow bg-white md:*:*:grow-0 md:*:*:flex-row md:bg-gradient-blue-white">
+    <AuthContent className="profile-page bg-white md:bg-gradient-blue-white">
       <h3 className="text-lg font-medium text-center py-[0.4375rem] md:hidden">
         Profile
       </h3>
diff --git a/src/app/verification/page.tsx b/src/app/verification/page.tsx
index 37f5bf1..3e459f1 100644
--- a/src/app/verification/page.tsx
+++ b/src/app/verification/page.tsx
@@ -6,7 +6,7 @@ import { ThemeToggler } from '@/components/ui/theme-toggler'
 
 export default function Verification() {
   return (
-    <AuthContent className="*:*:flex-col md:*:*:flex-row">
+    <AuthContent className="verification-page">
       <ImageCard className="bg-none px-0 pb-[0.625rem] pt-[2.75rem] md:pt-10 md:hidden">
         <Icons.messages />
       </ImageCard>