Merge pull request #107 from aziontech/no-issue-lineheight-section-heros

feat: update line height
aziontech · Oct 2, 2024 · 1050bf0 · 1050bf0
2 parents 0dd1bfe + 19b38ef
commit 1050bf0
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 14 deletions.
diff --git a/src/templates/contentsection/ContentSection.vue b/src/templates/contentsection/ContentSection.vue
@@ -38,15 +38,15 @@
               <Overline :label="overline" />
             </template>
             <template v-if="title">
-              <h1 v-if="titleTag === 'h1'" class="text-2xl md:text-3xl font-medium text-balance">{{ title }}</h1>
-              <h2 v-if="titleTag === 'h2'" class="text-2xl md:text-3xl font-medium text-balance">{{ title }}</h2>
-              <h3 v-if="titleTag === 'h3'" class="text-2xl md:text-3xl font-medium text-balance">{{ title }}</h3>
-              <h4 v-if="titleTag === 'h4'" class="text-2xl md:text-3xl font-medium text-balance">{{ title }}</h4>
-              <h5 v-if="titleTag === 'h5'" class="text-2xl md:text-3xl font-medium text-balance">{{ title }}</h5>
-              <h6 v-if="titleTag === 'h6'" class="text-2xl md:text-3xl font-medium text-balance">{{ title }}</h6>
+              <h1 v-if="titleTag === 'h1'" class="text-2xl md:text-3xl font-medium text-balance" style="line-height: 125% !important;">{{ title }}</h1>
+              <h2 v-if="titleTag === 'h2'" class="text-2xl md:text-3xl font-medium text-balance" style="line-height: 125% !important;">{{ title }}</h2>
+              <h3 v-if="titleTag === 'h3'" class="text-2xl md:text-3xl font-medium text-balance" style="line-height: 125% !important;">{{ title }}</h3>
+              <h4 v-if="titleTag === 'h4'" class="text-2xl md:text-3xl font-medium text-balance" style="line-height: 125% !important;">{{ title }}</h4>
+              <h5 v-if="titleTag === 'h5'" class="text-2xl md:text-3xl font-medium text-balance" style="line-height: 125% !important;">{{ title }}</h5>
+              <h6 v-if="titleTag === 'h6'" class="text-2xl md:text-3xl font-medium text-balance" style="line-height: 125% !important;">{{ title }}</h6>
             </template>
             <template v-else-if="$slots.title">
-              <div class="text-2xl md:text-3xl lg:text-4xl font-medium text-balance">
+              <div class="text-2xl md:text-3xl lg:text-4xl font-medium text-balance" style="line-height: 125% !important;">
                 <slot name="title" />
               </div>
             </template>

diff --git a/src/templates/herobase/HeroBase.vue b/src/templates/herobase/HeroBase.vue
@@ -39,16 +39,17 @@
           <template v-if="title">
             <h1
               v-if="titleTag === 'h1'"
-              class="font-medium text-3xl md:text-4xl 2xl:text-5xl text-balance"
+              class="leading-loose font-medium text-3xl md:text-4xl 2xl:text-5xl text-balance"
+              style="line-height: 125% !important;"
               :class="[{ 'text-4xl md:text-5xl' : isDisplay }]"
             >
               {{ title }}
             </h1>
-            <h2 v-if="titleTag === 'h2'" class="text-3xl md:text-4xl 2xl:text-5xl font-medium text-balance">{{ title }}</h2>
-            <h3 v-if="titleTag === 'h3'" class="text-3xl md:text-4xl 2xl:text-5xl font-medium text-balance">{{ title }}</h3>
-            <h4 v-if="titleTag === 'h4'" class="text-3xl md:text-4xl 2xl:text-5xl font-medium text-balance">{{ title }}</h4>
-            <h5 v-if="titleTag === 'h5'" class="text-3xl md:text-4xl 2xl:text-5xl font-medium text-balance">{{ title }}</h5>
-            <h6 v-if="titleTag === 'h6'" class="text-3xl md:text-4xl 2xl:text-5xl font-medium text-balance">{{ title }}</h6>
+            <h2 v-if="titleTag === 'h2'" class="text-3xl md:text-4xl 2xl:text-5xl leading-relaxed font-medium text-balance">{{ title }}</h2>
+            <h3 v-if="titleTag === 'h3'" class="text-3xl md:text-4xl 2xl:text-5xl leading-relaxed font-medium text-balance">{{ title }}</h3>
+            <h4 v-if="titleTag === 'h4'" class="text-3xl md:text-4xl 2xl:text-5xl leading-relaxed font-medium text-balance">{{ title }}</h4>
+            <h5 v-if="titleTag === 'h5'" class="text-3xl md:text-4xl 2xl:text-5xl leading-relaxed font-medium text-balance">{{ title }}</h5>
+            <h6 v-if="titleTag === 'h6'" class="text-3xl md:text-4xl 2xl:text-5xl leading-relaxed font-medium text-balance">{{ title }}</h6>
           </template>
           <template v-else>
             <slot name="title" />

diff --git a/src/templates/titlegroup/Titlegroup.vue b/src/templates/titlegroup/Titlegroup.vue
@@ -1,7 +1,7 @@
 <template>
   <hgroup>
     <p class="text-[--surface-700] text-3xl md:text-4xl font-medium">{{ subtitle }}</p>
-    <h1 class="text-3xl md:text-4xl font-medium text-balance">{{ title }}</h1>
+    <h1 class="text-3xl md:text-4xl font-medium text-balance" style="line-height: 125% !important;">{{ title }}</h1>
   </hgroup>
 </template>