aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/atoms/modal/modal.module.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/atoms/modal/modal.module.scss')
-rw-r--r--src/components/atoms/modal/modal.module.scss66
1 files changed, 0 insertions, 66 deletions
diff --git a/src/components/atoms/modal/modal.module.scss b/src/components/atoms/modal/modal.module.scss
deleted file mode 100644
index 6650235..0000000
--- a/src/components/atoms/modal/modal.module.scss
+++ /dev/null
@@ -1,66 +0,0 @@
-@use "../../../styles/abstracts/functions" as fun;
-@use "../../../styles/abstracts/mixins" as mix;
-
-.modal {
- position: relative;
- box-shadow:
- fun.convert-px(0.2) fun.convert-px(0.2) fun.convert-px(0.3) 0
- var(--color-shadow),
- fun.convert-px(1.5) fun.convert-px(1.5) fun.convert-px(2.5)
- fun.convert-px(-0.3) var(--color-shadow),
- fun.convert-px(4.7) fun.convert-px(4.7) fun.convert-px(8) fun.convert-px(-1)
- var(--color-shadow);
-
- &--primary {
- padding: clamp(var(--spacing-xs), 2.5vw, var(--spacing-md));
- background: var(--color-bg-secondary);
- border: fun.convert-px(3) solid;
- border-image: radial-gradient(
- ellipse at top,
- var(--color-primary-lighter) 20%,
- var(--color-primary) 100%
- )
- 1;
-
- .title {
- margin-bottom: var(--spacing-2xs);
- }
-
- @include mix.media("screen") {
- @include mix.dimensions(null, "sm") {
- border-left: none;
- border-right: none;
- }
- }
- }
-
- &--secondary {
- padding: clamp(var(--spacing-xs), 2.2vw, var(--spacing-sm));
- background: var(--color-bg);
- border: fun.convert-px(2) solid var(--color-primary-dark);
- border-radius: fun.convert-px(3);
-
- .title {
- padding-inline: var(--spacing-xs);
- background: var(--color-bg);
- border: fun.convert-px(1) solid var(--color-primary-dark);
- box-shadow: fun.convert-px(1) fun.convert-px(1) 0 0 var(--color-shadow);
- color: var(--color-primary-darker);
- font-variant: small-caps;
-
- > * {
- margin-block: 0;
- }
- }
- }
-
- &--secondary#{&}--has-title {
- --title-height: #{fun.convert-px(40)};
-
- .title {
- width: fit-content;
- height: var(--title-height);
- margin: calc(var(--title-height) * -1) auto var(--spacing-xs);
- }
- }
-}