Updated styles of category header

Author: Okeanij

Client/src/css/app.scss

@@ -64,6 +64,10 @@ $q-field-color: #00c63b;
     padding: 4px 0 4px 20px;
 }
 
+.category-header {
+    margin-top: -14px;
+}
+
 // ——— Buttons ————————————————————————————————————
 
 .post-btn {

Client/src/modules/articles/ArticlesPage.vue

@@ -13,8 +13,9 @@
                 {{category.subTitle}}
             </div>
         </div>
-        <div v-if="category.header" class="q-mb-sm page-padding" v-html="category.header"></div>
-
+        <div class="page-padding" v-if="category.header">
+            <div v-if="category.header" class="category-header" v-html="category.header"></div>
+        </div>
 
         <ArticlesList v-if="articles" :articles="articles"/>
 

Client/src/modules/blog/BlogMultiCatPage.vue

@@ -4,9 +4,8 @@
             <h1 class="page-title">
                 {{title}}
             </h1>
-            <q-btn v-if="canPost" no-caps class="post-btn"
-                   @click="$router.push( {name:'CreateMaterial',params:{categoriesNames: component.settings.CategoriesNames}})"
-                   :label="addButtonLabel" icon="fas fa-plus"/>
+            <q-btn v-if="canPost" no-caps class="post-btn" :label="addButtonLabel" icon="fas fa-plus"
+                   @click="$router.push( {name:'CreateMaterial',params:{categoriesNames: component.settings.CategoriesNames}})"/>
         </div>
 
         <div class="page-padding">
@@ -15,7 +14,7 @@
             </div>
         </div>
 
-        <div v-if="component.settings.Header" class="q-mb-lg text-grey-9" style="margin-top: -14px"
+        <div v-if="component.settings.Header" class="q-mb-lg text-grey-9"
              v-html="component.settings.Header"></div>
 
         <PostsMultiCat :componentName="componentName"/>

Client/src/modules/blog/BlogPage.vue

@@ -14,8 +14,9 @@
                {{category.subTitle}}
             </div>
         </div>
-
-        <div v-html="category.header" v-if="category.header" class="q-mb-sm"></div>
+        <div class="page-padding" v-if="category.header">
+            <div v-html="category.header" v-if="category.header" class="category-header"></div>
+        </div>
 
         <PostsList v-if="posts" :posts="posts"/>
 

Client/src/modules/forum/Thread.vue

@@ -14,7 +14,9 @@
                 {{category.subTitle}}
             </div>
         </div>
-        <div v-if="category.header" class="q-mb-sm" v-html="category.header"></div>
+        <div class="page-padding" v-if="category.header">
+            <div v-if="category.header" class="category-header" v-html="category.header"></div>
+        </div>
 
         <LoaderWait ref="loader" v-if="!topics.items"/>