create-atsdc-stack 1.1.0 → 1.2.0

package/app/src/styles/global.scss

@@ -1,141 +1,141 @@
-// OpenProps - CSS design tokens
-@use 'open-props/style' as *;
-@use 'open-props/normalize' as *;
-
-@use './reset' as *;
-@use './variables/globals' as *;
-@use './variables/mixins' as *;
-
-// Global styles
-:root {
-    // CSS custom properties for runtime theming
-    --color-primary: #{$primary-color};
-    --color-primary-hover: #{$primary-hover};
-    --color-secondary: #{$secondary-color};
-    --color-accent: #{$accent-color};
-    --color-text-primary: #{$text-primary};
-    --color-text-secondary: #{$text-secondary};
-    --color-bg-primary: #{$bg-primary};
-    --color-bg-secondary: #{$bg-secondary};
-}
-
-html {
-    font-family: $font-family-base;
-    font-size: 16px;
-    color: $text-primary;
-    background-color: $bg-primary;
-    @include smooth-scroll;
-}
-
-body {
-    overflow-x: hidden;
-}
-
-// Typography
-h1 {
-    @include heading-1;
-    margin-bottom: $spacing-large;
-}
-
-h2 {
-    @include heading-2;
-    margin-bottom: $spacing-medium;
-}
-
-h3 {
-    @include heading-3;
-    margin-bottom: $spacing-medium;
-}
-
-p {
-    margin-bottom: $spacing-medium;
-    line-height: $line-height-relaxed;
-    color: $text-secondary;
-}
-
-// Links
-a {
-    color: $primary-color;
-    transition: color $transition-fast;
-
-    &:hover {
-        color: $primary-hover;
-    }
-
-    @include focus-visible;
-}
-
-// Utility classes
-.container {
-    @include container;
-}
-
-.flex-center {
-    @include flex-center;
-}
-
-.flex-between {
-    @include flex-between;
-}
-
-.flex-column {
-    @include flex-column;
-}
-
-.card {
-    @include card;
-}
-
-.sr-only {
-    @include visually-hidden;
-}
-
-// Spacing utilities
-.mt-small { margin-top: $spacing-small; }
-.mt-medium { margin-top: $spacing-medium; }
-.mt-large { margin-top: $spacing-large; }
-.mt-extra-large { margin-top: $spacing-extra-large; }
-
-.mb-small { margin-bottom: $spacing-small; }
-.mb-medium { margin-bottom: $spacing-medium; }
-.mb-large { margin-bottom: $spacing-large; }
-.mb-extra-large { margin-bottom: $spacing-extra-large; }
-
-.pt-small { padding-top: $spacing-small; }
-.pt-medium { padding-top: $spacing-medium; }
-.pt-large { padding-top: $spacing-large; }
-.pt-extra-large { padding-top: $spacing-extra-large; }
-
-.pb-small { padding-bottom: $spacing-small; }
-.pb-medium { padding-bottom: $spacing-medium; }
-.pb-large { padding-bottom: $spacing-large; }
-.pb-extra-large { padding-bottom: $spacing-extra-large; }
-
-// Text utilities
-.text-center {
-    text-align: center;
-}
-
-.text-primary {
-    color: $text-primary;
-}
-
-.text-secondary {
-    color: $text-secondary;
-}
-
-.text-light {
-    color: $text-light;
-}
-
-.truncate {
-    @include truncate;
-}
-
-.line-clamp-2 {
-    @include line-clamp(2);
-}
-
-.line-clamp-3 {
-    @include line-clamp(3);
-}
+// OpenProps - CSS design tokens
+@use 'open-props/style' as *;
+@use 'open-props/normalize' as *;
+
+@use './reset' as *;
+@use './variables/globals' as *;
+@use './variables/mixins' as *;
+
+// Global styles
+:root {
+    // CSS custom properties for runtime theming
+    --color-primary: #{$primary-color};
+    --color-primary-hover: #{$primary-hover};
+    --color-secondary: #{$secondary-color};
+    --color-accent: #{$accent-color};
+    --color-text-primary: #{$text-primary};
+    --color-text-secondary: #{$text-secondary};
+    --color-bg-primary: #{$bg-primary};
+    --color-bg-secondary: #{$bg-secondary};
+}
+
+html {
+    font-family: $font-family-base;
+    font-size: 16px;
+    color: $text-primary;
+    background-color: $bg-primary;
+    @include smooth-scroll;
+}
+
+body {
+    overflow-x: hidden;
+}
+
+// Typography
+h1 {
+    @include heading-1;
+    margin-bottom: $spacing-large;
+}
+
+h2 {
+    @include heading-2;
+    margin-bottom: $spacing-medium;
+}
+
+h3 {
+    @include heading-3;
+    margin-bottom: $spacing-medium;
+}
+
+p {
+    margin-bottom: $spacing-medium;
+    line-height: $line-height-relaxed;
+    color: $text-secondary;
+}
+
+// Links
+a {
+    color: $primary-color;
+    transition: color $transition-fast;
+
+    &:hover {
+        color: $primary-hover;
+    }
+
+    @include focus-visible;
+}
+
+// Utility classes
+.container {
+    @include container;
+}
+
+.flex-center {
+    @include flex-center;
+}
+
+.flex-between {
+    @include flex-between;
+}
+
+.flex-column {
+    @include flex-column;
+}
+
+.card {
+    @include card;
+}
+
+.sr-only {
+    @include visually-hidden;
+}
+
+// Spacing utilities
+.mt-small { margin-top: $spacing-small; }
+.mt-medium { margin-top: $spacing-medium; }
+.mt-large { margin-top: $spacing-large; }
+.mt-extra-large { margin-top: $spacing-extra-large; }
+
+.mb-small { margin-bottom: $spacing-small; }
+.mb-medium { margin-bottom: $spacing-medium; }
+.mb-large { margin-bottom: $spacing-large; }
+.mb-extra-large { margin-bottom: $spacing-extra-large; }
+
+.pt-small { padding-top: $spacing-small; }
+.pt-medium { padding-top: $spacing-medium; }
+.pt-large { padding-top: $spacing-large; }
+.pt-extra-large { padding-top: $spacing-extra-large; }
+
+.pb-small { padding-bottom: $spacing-small; }
+.pb-medium { padding-bottom: $spacing-medium; }
+.pb-large { padding-bottom: $spacing-large; }
+.pb-extra-large { padding-bottom: $spacing-extra-large; }
+
+// Text utilities
+.text-center {
+    text-align: center;
+}
+
+.text-primary {
+    color: $text-primary;
+}
+
+.text-secondary {
+    color: $text-secondary;
+}
+
+.text-light {
+    color: $text-light;
+}
+
+.truncate {
+    @include truncate;
+}
+
+.line-clamp-2 {
+    @include line-clamp(2);
+}
+
+.line-clamp-3 {
+    @include line-clamp(3);
+}

package/app/src/styles/pages/index.scss

@@ -1,80 +1,80 @@
-@use '../variables/globals' as *;
-@use '../variables/mixins' as *;
-
-// Home page styles
-.home {
-    padding: $spacing-3x-large 0;
-
-    &__header {
-        text-align: center;
-        margin-bottom: $spacing-3x-large;
-    }
-
-    &__title {
-        @include heading-1;
-        margin-inline: auto;
-        margin-bottom: $spacing-medium;
-        background: linear-gradient(135deg, $primary-color 0%, $secondary-color 100%);
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
-        background-clip: text;
-    }
-
-    &__subtitle {
-        font-size: $font-size-large;
-        color: $text-secondary;
-        max-width: 600px;
-        margin: 0 auto;
-
-        @include desktop {
-            font-size: $font-size-extra-large;
-        }
-    }
-
-    &__features {
-        display: grid;
-        grid-template-columns: 1fr;
-        gap: $spacing-large;
-        margin-bottom: $spacing-3x-large;
-
-        @include tablet {
-            grid-template-columns: repeat(2, 1fr);
-        }
-
-        @include wide {
-            grid-template-columns: repeat(3, 1fr);
-        }
-    }
-
-    &__feature {
-        h3 {
-            font-size: $font-size-extra-large;
-            font-weight: $font-weight-semibold;
-            margin-bottom: $spacing-small;
-            color: $text-primary;
-        }
-
-        p {
-            font-size: $font-size-base;
-            color: $text-secondary;
-            margin-bottom: 0;
-        }
-    }
-
-    &__cta {
-        text-align: center;
-        padding: $spacing-3x-large 0;
-        border-top: 1px solid $border-color;
-
-        h2 {
-            @include heading-2;
-            margin-bottom: $spacing-extra-large;
-        }
-    }
-
-    &__cta-buttons {
-        @include flex-center;
-        gap: $spacing-large;
-        flex-wrap: wrap;
-    }
-}
+@use '../variables/globals' as *;
+@use '../variables/mixins' as *;
+
+// Home page styles
+.home {
+    padding: $spacing-3x-large 0;
+
+    &__header {
+        text-align: center;
+        margin-bottom: $spacing-3x-large;
+    }
+
+    &__title {
+        @include heading-1;
+        margin-inline: auto;
+        margin-bottom: $spacing-medium;
+        background: linear-gradient(135deg, $primary-color 0%, $secondary-color 100%);
+        -webkit-background-clip: text;
+        -webkit-text-fill-color: transparent;
+        background-clip: text;
+    }
+
+    &__subtitle {
+        font-size: $font-size-large;
+        color: $text-secondary;
+        max-width: 600px;
+        margin: 0 auto;
+
+        @include desktop {
+            font-size: $font-size-extra-large;
+        }
+    }
+
+    &__features {
+        display: grid;
+        grid-template-columns: 1fr;
+        gap: $spacing-large;
+        margin-bottom: $spacing-3x-large;
+
+        @include tablet {
+            grid-template-columns: repeat(2, 1fr);
+        }
+
+        @include wide {
+            grid-template-columns: repeat(3, 1fr);
+        }
+    }
+
+    &__feature {
+        h3 {
+            font-size: $font-size-extra-large;
+            font-weight: $font-weight-semibold;
+            margin-bottom: $spacing-small;
+            color: $text-primary;
+        }
+
+        p {
+            font-size: $font-size-base;
+            color: $text-secondary;
+            margin-bottom: 0;
+        }
+    }
+
+    &__cta {
+        text-align: center;
+        padding: $spacing-3x-large 0;
+        border-top: 1px solid $border-color;
+
+        h2 {
+            @include heading-2;
+            margin-bottom: $spacing-extra-large;
+        }
+    }
+
+    &__cta-buttons {
+        @include flex-center;
+        gap: $spacing-large;
+        flex-wrap: wrap;
+    }
+}

package/app/src/styles/reset.scss

@@ -1,83 +1,83 @@
-/* Modern CSS Reset */
-
-*,
-*::before,
-*::after {
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-}
-
-html {
-    -webkit-text-size-adjust: 100%;
-    -moz-text-size-adjust: 100%;
-    text-size-adjust: 100%;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-}
-
-body {
-    min-height: 100vh;
-    text-rendering: optimizeSpeed;
-    line-height: 1.5;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-    font-size: inherit;
-    font-weight: inherit;
-}
-
-ul,
-ol {
-    list-style: none;
-}
-
-img,
-picture,
-video,
-canvas,
-svg {
-    display: block;
-    max-width: 100%;
-    height: auto;
-}
-
-input,
-button,
-textarea,
-select {
-    font: inherit;
-    color: inherit;
-}
-
-button {
-    background: none;
-    border: none;
-    cursor: pointer;
-}
-
-a {
-    color: inherit;
-    text-decoration: none;
-}
-
-table {
-    border-collapse: collapse;
-    border-spacing: 0;
-}
-
-@media (prefers-reduced-motion: reduce) {
-    *,
-    *::before,
-    *::after {
-        animation-duration: 0.01ms !important;
-        animation-iteration-count: 1 !important;
-        transition-duration: 0.01ms !important;
-        scroll-behavior: auto !important;
-    }
-}
+/* Modern CSS Reset */
+
+*,
+*::before,
+*::after {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+}
+
+html {
+    -webkit-text-size-adjust: 100%;
+    -moz-text-size-adjust: 100%;
+    text-size-adjust: 100%;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+
+body {
+    min-height: 100vh;
+    text-rendering: optimizeSpeed;
+    line-height: 1.5;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-size: inherit;
+    font-weight: inherit;
+}
+
+ul,
+ol {
+    list-style: none;
+}
+
+img,
+picture,
+video,
+canvas,
+svg {
+    display: block;
+    max-width: 100%;
+    height: auto;
+}
+
+input,
+button,
+textarea,
+select {
+    font: inherit;
+    color: inherit;
+}
+
+button {
+    background: none;
+    border: none;
+    cursor: pointer;
+}
+
+a {
+    color: inherit;
+    text-decoration: none;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+@media (prefers-reduced-motion: reduce) {
+    *,
+    *::before,
+    *::after {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.01ms !important;
+        scroll-behavior: auto !important;
+    }
+}