diff --git a/pages/_app.tsx b/pages/_app.tsx index 2ccbe35d..aa65d576 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -1,4 +1,6 @@ import 'src/style.css' +import 'src/style/kazimir/image.css' +import 'src/style/kazimir/video.css' import 'src/style/style.scss' import App from 'next/app' diff --git a/src/style/kazimir/image.scss b/src/style/kazimir/image.css similarity index 66% rename from src/style/kazimir/image.scss rename to src/style/kazimir/image.css index 1c0a3ea8..88edc60b 100644 --- a/src/style/kazimir/image.scss +++ b/src/style/kazimir/image.css @@ -1,24 +1,25 @@ .kazimir__image { - --kazimir-caption-margin: 20px; + --kazimir-caption-margin: 20px; +} - p { +.kazimir__image p { margin-left: 0; margin-right: 0; - } +} - img { +.kazimir__image img { border-radius: 3px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15); max-width: 100%; max-height: 35em; - } +} - figure { +.kazimir__image figure { margin: 0 0 var(--single-margin); - } +} - figcaption { +.kazimir__image figcaption { margin-left: var(--kazimir-caption-margin); font-size: 16px; @@ -26,11 +27,10 @@ color: #999; font-weight: 100; - } } @media screen and (max-width: var(--mobile-width)) { - .kazimir__image { - --kazimir-caption-margin: 10px; - } + .kazimir__image { + --kazimir-caption-margin: 10px; + } } diff --git a/src/style/kazimir/video.css b/src/style/kazimir/video.css new file mode 100644 index 00000000..23ffdaf8 --- /dev/null +++ b/src/style/kazimir/video.css @@ -0,0 +1,14 @@ +.kazimir__video { + width: 100%; + height: 0; + position: relative; + padding-bottom: var(--embed-video-ratio); + + margin-bottom: var(--single-margin); +} + +.kazimir__video iframe { + width: 100%; + height: 100%; + position: absolute; +} diff --git a/src/style/kazimir/video.scss b/src/style/kazimir/video.scss deleted file mode 100644 index b15f5710..00000000 --- a/src/style/kazimir/video.scss +++ /dev/null @@ -1,14 +0,0 @@ -.kazimir__video { - width: 100%; - height: 0; - position: relative; - padding-bottom: var(--embed-video-ratio); - - margin-bottom: var(--single-margin); - - iframe { - width: 100%; - height: 100%; - position: absolute; - } -} diff --git a/src/style/style.scss b/src/style/style.scss index fc2389e2..2e430ed0 100644 --- a/src/style/style.scss +++ b/src/style/style.scss @@ -16,6 +16,3 @@ @import "themes/theme-default"; @import "marker/MarkerTable"; - -@import "kazimir/video"; -@import "kazimir/image";