From 506d97a7d16fa186beee3eda314492d9297e90c5 Mon Sep 17 00:00:00 2001 From: Kyren223 Date: Tue, 12 Nov 2024 18:44:51 +0200 Subject: Added blog and changed some other stuff --- src/styles/markdown/util.css | 61 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 61 insertions(+) create mode 100644 src/styles/markdown/util.css (limited to 'src/styles/markdown/util.css') diff --git a/src/styles/markdown/util.css b/src/styles/markdown/util.css new file mode 100644 index 0000000..63ede50 --- /dev/null +++ b/src/styles/markdown/util.css @@ -0,0 +1,61 @@ +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border-width: 0; +} + +.sl-hidden { + display: none; +} +.sl-flex { + display: flex; +} +.sl-block { + display: block; +} +@media (min-width: 50rem) { + .md\:sl-hidden { + display: none; + } + .md\:sl-flex { + display: flex; + } + .md\:sl-block { + display: block; + } +} +@media (min-width: 72rem) { + .lg\:sl-hidden { + display: none; + } + .lg\:sl-flex { + display: flex; + } + .lg\:sl-block { + display: block; + } +} +[data-theme="light"] .light\:sl-hidden { + display: none; +} +[data-theme="dark"] .dark\:sl-hidden { + display: none; +} + +/* +Flip an element around the y-axis when in an RTL context. +Primarily useful for things where we can’t rely on writing direction like icons. + + + +In a LTR context: → In a RTL context: ← +*/ +[dir="rtl"] .rtl\:flip:not(:where([dir="rtl"] [dir="ltr"] *)) { + transform: matrix(-1, 0, 0, 1, 0, 0); +} -- cgit v1.3.1