update text styling

Author: aguingand

resources/css/content.css

@@ -2,28 +2,28 @@
 @layer components {
   .content {
     > :where(h1) {
-      @apply mt-6 border-b pb-2 text-3xl font-semibold tracking-tight;
+      @apply mb-3 text-xl font-semibold tracking-tight border-b pb-0.5;
     }
     > :where(h2) {
-      @apply mt-6 text-2xl font-semibold tracking-tight;
+      @apply mb-2 text-lg font-semibold tracking-tight;
     }
     > :where(h3) {
-      @apply mt-4 text-xl font-semibold tracking-tight;
+      @apply mb-1.5 text-sm font-semibold tracking-tight;
     }
     > :where(h4, h5, h6) {
-      @apply mt-4 font-semibold;
+      @apply mb-1 font-semibold;
     }
     > :where(p) {
-      @apply mt-4;
+      @apply mb-4;
     }
     > :where(ul) {
-      @apply mt-4 ml-6 list-disc [&>li]:mt-2;
+      @apply mb-4 ml-6 list-disc [&>li]:mt-2;
     }
     > :where(ol) {
-      @apply mt-4 ml-6 list-decimal [&>li]:mt-2;
+      @apply mb-4 ml-6 list-decimal [&>li]:mt-2;
     }
     > :where(blockquote) {
-      @apply mt-4 relative flow-root pl-4 border-l-2 before:block before:-mt-0.5;
+      @apply mb-4 relative flow-root pl-4 border-l-2 before:block before:-mt-0.5;
       > :where(p,ul,ol) {
         @apply mt-2;
       }
@@ -35,7 +35,7 @@
       }
     }
     > :where(table) {
-      @apply mt-4 w-full;
+      @apply mb-4 w-full;
       :where(tr) {
         @apply m-0 border-t p-0 even:bg-muted;
       }
@@ -50,13 +50,13 @@
       @apply rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm;
     }
     > :where(pre) {
-      @apply mt-4 !whitespace-pre overflow-x-auto;
+      @apply mb-4 !whitespace-pre overflow-x-auto;
       > :where(code) {
           @apply block py-2 px-4 bg-muted rounded-md [font-size:inherit];
       }
     }
     > :where(hr) {
-      @apply mt-4;
+      @apply mb-4;
     }
     :where(a:not([style],[class])) {
       @apply relative p-1.5 -m-1.5 text-primary underline underline-offset-4 decoration-primary/20 hover:decoration-inherit;

resources/js/show/components/fields/text/Text.vue

@@ -73,13 +73,13 @@
     <ShowFieldLayout v-bind="props">
         <template v-if="currentContent && field.html">
             <TextRenderer
-                class="content content-sm text-sm"
+                class="content content-sm text-sm [:where(&)_:where(h1,h2,h3)]:text-foreground/75"
                 :content="currentContent"
                 :field="field"
             />
         </template>
         <template v-else>
-            <div class="content content-sm text-sm">
+            <div class="text-sm">
                 {{ currentContent }}
             </div>
         </template>

vite.config.js

@@ -49,7 +49,7 @@ export default defineConfig(({ mode, command }) => {
                 ],
                 publicDirectory: '/dist',
                 refresh: [
-                    'demo/app/Sharp/**/*.php',
+                    // 'demo/app/Sharp/**/*.php',
                 ],
                 // refresh: true,
                 detectTls: env.APP_URL?.startsWith('https')