From 7dc550291ef206c77451c6c8bcada252ca6a00f4 Mon Sep 17 00:00:00 2001 From: Henrik Larsson Date: Fri, 5 May 2023 12:02:25 +0200 Subject: [PATCH] Revert to global CSS --- app/[locale]/globals.css | 63 +++++++++++++++++++ .../dynamic-content-manager.tsx | 1 - .../dynamic-content.css | 23 ------- components/modules/carousel/carousel.css | 37 ----------- components/modules/carousel/carousel.tsx | 1 - 5 files changed, 63 insertions(+), 62 deletions(-) delete mode 100644 components/layout/dynamic-content-manager/dynamic-content.css delete mode 100644 components/modules/carousel/carousel.css diff --git a/app/[locale]/globals.css b/app/[locale]/globals.css index f82a0ee9b..d66461eab 100644 --- a/app/[locale]/globals.css +++ b/app/[locale]/globals.css @@ -36,4 +36,67 @@ body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overscroll-behavior-x: none; +} + +/* DYNAMIC CONTENT MANAGER */ +.dynamic-content > :not(.hero) { + @apply my-16 lg:my-24; +} + +.dynamic-content > :first-child { + @apply mt-0 md:mt-0 lg:mt-0; +} + +.dynamic-content > :last-child { + @apply mb-16 lg:mb-24; +} + +.dynamic-content .dynamic-content { + @apply px-0 md:px-0; +} + +.dynamic-content .dynamic-content > { + @apply my-0 md:my-0 lg:my-0; +} + +.dynamic-content .dynamic-content > :last-child { + @apply my-0 md:my-0 lg:my-0; +} + +/* GLIDER SLIDER */ +.glider { + scrollbar-width: none; + -ms-overflow-style: none; +} + +.glider::-webkit-scrollbar { + display: none; +} + +.glider-dots { + @apply flex !space-x-[2px] !mt-8; +} + +.glider-dot { + @apply !m-0 !rounded-none !w-12 !h-4 !bg-transparent after:content-[''] after:block after:w-12 after:h-[3px] after:bg-ui-border 2xl:!w-16 2xl:after:w-16; +} + +.glider-dot.active { + @apply after:!bg-high-contrast; +} + +.glider-prev { + @apply text-high-contrast !right-12 !-top-10 !left-auto lg:!right-16 lg:!-top-12 2xl:!-top-16 2xl:!right-[100px] !transition-transform !duration-100 hover:!text-high-contrast hover:scale-110; +} + +.glider-next { + @apply text-high-contrast !right-4 !-top-10 lg:!right-8 lg:!-top-12 2xl:!-top-16 2xl:!right-16 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-110; +} + +.pdp .glider-prev { + @apply text-high-contrast absolute !left-4 !top-1/2 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-100 lg:hidden; +} + +.pdp .glider-next { + @apply text-high-contrast absolute !right-4 !top-1/2 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-100 lg:hidden; } \ No newline at end of file diff --git a/components/layout/dynamic-content-manager/dynamic-content-manager.tsx b/components/layout/dynamic-content-manager/dynamic-content-manager.tsx index a38a22f41..0dfbe6883 100644 --- a/components/layout/dynamic-content-manager/dynamic-content-manager.tsx +++ b/components/layout/dynamic-content-manager/dynamic-content-manager.tsx @@ -2,7 +2,6 @@ import { Info } from 'lucide-react'; import dynamic from 'next/dynamic'; -import './dynamic-content.css'; import Hero from 'components/modules/hero'; const Slider = dynamic(() => import('components/modules/slider')) diff --git a/components/layout/dynamic-content-manager/dynamic-content.css b/components/layout/dynamic-content-manager/dynamic-content.css deleted file mode 100644 index 644427af9..000000000 --- a/components/layout/dynamic-content-manager/dynamic-content.css +++ /dev/null @@ -1,23 +0,0 @@ -.dynamic-content > :not(.hero) { - @apply my-16 lg:my-24; -} - -.dynamic-content > :first-child { - @apply mt-0 md:mt-0 lg:mt-0; -} - -.dynamic-content > :last-child { - @apply mb-16 lg:mb-24; -} - -.dynamic-content .dynamic-content { - @apply px-0 md:px-0; -} - -.dynamic-content .dynamic-content > { - @apply my-0 md:my-0 lg:my-0; -} - -.dynamic-content .dynamic-content > :last-child { - @apply my-0 md:my-0 lg:my-0; -} \ No newline at end of file diff --git a/components/modules/carousel/carousel.css b/components/modules/carousel/carousel.css deleted file mode 100644 index 27f162498..000000000 --- a/components/modules/carousel/carousel.css +++ /dev/null @@ -1,37 +0,0 @@ -/* Glider slider. */ -.glider { - scrollbar-width: none; - -ms-overflow-style: none; -} - -.glider::-webkit-scrollbar { - display: none; -} - -.glider-dots { - @apply flex !space-x-[2px] !mt-8; -} - -.glider-dot { - @apply !m-0 !rounded-none !w-12 !h-4 !bg-transparent after:content-[''] after:block after:w-12 after:h-[3px] after:bg-ui-border 2xl:!w-16 2xl:after:w-16; -} - -.glider-dot.active { - @apply after:!bg-high-contrast; -} - -.glider-prev { - @apply text-high-contrast !right-12 !-top-10 !left-auto lg:!right-16 lg:!-top-12 2xl:!-top-16 2xl:!right-[100px] !transition-transform !duration-100 hover:!text-high-contrast hover:scale-110; -} - -.glider-next { - @apply text-high-contrast !right-4 !-top-10 lg:!right-8 lg:!-top-12 2xl:!-top-16 2xl:!right-16 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-110; -} - -.pdp .glider-prev { - @apply text-high-contrast absolute !left-4 !top-1/2 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-100 lg:hidden; -} - -.pdp .glider-next { - @apply text-high-contrast absolute !right-4 !top-1/2 !transition-transform !duration-100 hover:!text-high-contrast hover:scale-100 lg:hidden; -} \ No newline at end of file diff --git a/components/modules/carousel/carousel.tsx b/components/modules/carousel/carousel.tsx index 0d04c18bf..105bfccf1 100644 --- a/components/modules/carousel/carousel.tsx +++ b/components/modules/carousel/carousel.tsx @@ -2,7 +2,6 @@ import 'glider-js/glider.min.css'; import { ArrowLeft, ArrowRight } from 'lucide-react'; import React from 'react'; import Glider from 'react-glider'; -import './carousel.css'; export interface CarouselItemProps { children: React.ReactNode