fix: Trying to get the sideways text to render in prod
Some checks failed
Publish Svelte Tailwind Library / build-and-publish (push) Has been cancelled
Some checks failed
Publish Svelte Tailwind Library / build-and-publish (push) Has been cancelled
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@luke-else/component-lib",
|
"name": "@luke-else/component-lib",
|
||||||
"version": "1.0.9",
|
"version": "1.1.0",
|
||||||
"description": "",
|
"description": "",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"package": "svelte-package && pnpm run build:css",
|
"package": "svelte-package && pnpm run build:css",
|
||||||
|
@@ -2,12 +2,18 @@
|
|||||||
export let label: string = '';
|
export let label: string = '';
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
#sideway-label {
|
||||||
|
@apply tracking-widest [writing-mode:vertical-rl] [text-orientation:mixed];
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<div id={label} class="relative flex flex-row w-full min-h-[300px] mt-5 mb-25">
|
<div id={label} class="relative flex flex-row w-full min-h-[300px] mt-5 mb-25">
|
||||||
<!-- Sticky/Sliding Label -->
|
<!-- Sticky/Sliding Label -->
|
||||||
<div class="hidden md:flex flex-col items-center mr-6">
|
<div class="hidden md:flex flex-col items-center mr-6">
|
||||||
<div class="sticky top-24 left-0 z-10">
|
<div class="sticky top-24 left-0 z-10">
|
||||||
<span
|
<span id="sideway-label"
|
||||||
class="text-2xl font-bold text-blue-400 tracking-widest [writing-mode:vertical-rl] [text-orientation:mixed]"
|
class="text-2xl font-bold text-blue-400"
|
||||||
>
|
>
|
||||||
{label}
|
{label}
|
||||||
</span>
|
</span>
|
||||||
|
@@ -1 +1,7 @@
|
|||||||
@import "tailwindcss";
|
@import "tailwindcss";
|
||||||
|
|
||||||
|
@layer components {
|
||||||
|
.button {
|
||||||
|
@apply px-4 py-2 rounded-md bg-red-500 text-white;
|
||||||
|
}
|
||||||
|
}
|
Reference in New Issue
Block a user