diff options
| author | Mitja Felicijan <mitja.felicijan@gmail.com> | 2022-08-28 05:39:44 +0200 |
|---|---|---|
| committer | Mitja Felicijan <mitja.felicijan@gmail.com> | 2022-08-28 05:39:44 +0200 |
| commit | 70baaeb4e78d12c329a03e929fd30d41730ed2b1 (patch) | |
| tree | 74e0b2998455894762b6910ef4008d43f5dc9366 /themes/simple/layouts/partials/tailwind.html | |
| parent | b1d9aefd2a9fa0074f8d18fa2410cdd53d4c8de6 (diff) | |
| download | mitjafelicijan.com-70baaeb4e78d12c329a03e929fd30d41730ed2b1.tar.gz | |
Moved statis assets and converted all CSS to Tailwind
Diffstat (limited to 'themes/simple/layouts/partials/tailwind.html')
| -rw-r--r-- | themes/simple/layouts/partials/tailwind.html | 106 |
1 files changed, 106 insertions, 0 deletions
diff --git a/themes/simple/layouts/partials/tailwind.html b/themes/simple/layouts/partials/tailwind.html new file mode 100644 index 0000000..078882c --- /dev/null +++ b/themes/simple/layouts/partials/tailwind.html | |||
| @@ -0,0 +1,106 @@ | |||
| 1 | <style type="text/tailwindcss"> | ||
| 2 | @layer utilities { | ||
| 3 | |||
| 4 | /* Container */ | ||
| 5 | .container-blog { | ||
| 6 | max-width: 640px; | ||
| 7 | margin: 0 auto; | ||
| 8 | } | ||
| 9 | |||
| 10 | /* User text selection */ | ||
| 11 | ::selection { | ||
| 12 | @apply bg-yellow-100 text-black; | ||
| 13 | } | ||
| 14 | |||
| 15 | ::-moz-selection { | ||
| 16 | @apply bg-yellow-100 text-black; | ||
| 17 | } | ||
| 18 | |||
| 19 | /* Headings */ | ||
| 20 | article.single h2 { | ||
| 21 | @apply text-2xl font-bold mb-4 mt-8; | ||
| 22 | } | ||
| 23 | |||
| 24 | article.single h3 { | ||
| 25 | @apply text-xl font-bold mb-4 mt-8; | ||
| 26 | } | ||
| 27 | |||
| 28 | article.single h4 { | ||
| 29 | @apply text-lg font-bold mb-4 mt-8; | ||
| 30 | } | ||
| 31 | |||
| 32 | /* Paragraph */ | ||
| 33 | article.single p { | ||
| 34 | @apply mb-5; | ||
| 35 | } | ||
| 36 | |||
| 37 | /* Links */ | ||
| 38 | article.single a { | ||
| 39 | @apply underline hover:bg-yellow-200; | ||
| 40 | } | ||
| 41 | |||
| 42 | /* Blockquote */ | ||
| 43 | article.single blockquote { | ||
| 44 | background-image: url('/general/alert-light.svg'); | ||
| 45 | background-size: 30px 30px; | ||
| 46 | background-repeat: no-repeat; | ||
| 47 | background-position: 0 5px; | ||
| 48 | @apply pl-12 my-8; | ||
| 49 | } | ||
| 50 | |||
| 51 | /* Media: Images, audio, video */ | ||
| 52 | article.single img { | ||
| 53 | @apply rounded w-full !bg-gray-50 my-8; | ||
| 54 | } | ||
| 55 | |||
| 56 | article.single video { | ||
| 57 | @apply rounded w-full !bg-gray-50; | ||
| 58 | } | ||
| 59 | |||
| 60 | article.single audio { | ||
| 61 | @apply w-full mb-6; | ||
| 62 | } | ||
| 63 | |||
| 64 | /* Code */ | ||
| 65 | article.single code { | ||
| 66 | @apply bg-yellow-200 rounded px-2 py-1 text-xs font-medium; | ||
| 67 | } | ||
| 68 | |||
| 69 | article.single pre { | ||
| 70 | @apply !bg-gray-50 rounded text-xs p-4 mb-6 overflow-x-auto; | ||
| 71 | } | ||
| 72 | |||
| 73 | article.single pre code { | ||
| 74 | background: unset; | ||
| 75 | padding: unset; | ||
| 76 | @apply leading-relaxed; | ||
| 77 | } | ||
| 78 | |||
| 79 | /* Tables */ | ||
| 80 | article.single table { | ||
| 81 | @apply w-full border border-black border-collapse mb-4; | ||
| 82 | } | ||
| 83 | |||
| 84 | article.single table tr, | ||
| 85 | article.single table td, | ||
| 86 | article.single table th { | ||
| 87 | @apply px-4 py-2 border text-left; | ||
| 88 | } | ||
| 89 | |||
| 90 | /* Unordered list */ | ||
| 91 | article.single ul { | ||
| 92 | @apply list-disc pl-6 md:pl-10 mb-6; | ||
| 93 | } | ||
| 94 | |||
| 95 | /* Ordered list */ | ||
| 96 | article.single ol { | ||
| 97 | @apply list-decimal pl-8 md:pl-10; | ||
| 98 | } | ||
| 99 | |||
| 100 | /* Katex */ | ||
| 101 | article.single .katex-display { | ||
| 102 | @apply my-10; | ||
| 103 | } | ||
| 104 | |||
| 105 | } | ||
| 106 | </style> | ||
