Add Typography Preview

templaza · Nov 7, 2023 · b37383a · b37383a
1 parent f0c9e12
commit b37383a
Show file tree

Hide file tree

Showing 9 changed files with 120 additions and 93 deletions.
diff --git a/assets/vendor/manager/dist/index.html b/assets/vendor/manager/dist/index.html
diff --git a/assets/vendor/manager/dist/index.js b/assets/vendor/manager/dist/index.js
diff --git a/assets/vendor/manager/index.html b/assets/vendor/manager/index.html
diff --git a/assets/vendor/manager/package-lock.json b/assets/vendor/manager/package-lock.json
diff --git a/assets/vendor/manager/package.json b/assets/vendor/manager/package.json
@@ -18,7 +18,7 @@
     "@vuepic/vue-datepicker": "^6.1.0",
     "axios": "^1.4.0",
     "bootstrap": "^5.3.0",
-    "vue": "^3.3.4",
+    "vue": "^3.3.8",
     "vue-color-kit": "^1.0.6",
     "vue-search-select": "^3.1.2",
     "vue3-dropzone": "^2.0.1",

diff --git a/assets/vendor/manager/src/components/helpers/Typography.vue b/assets/vendor/manager/src/components/helpers/Typography.vue
@@ -240,4 +240,20 @@ function changeColor(color) {
             </div>
         </div>
     </div>
+    <div class="typography-preview">
+        <link v-if="font_type === `google` && (typeof options[font_type].find((font) => font.value === fontSelected.value) !== 'undefined') && fontSelected.value !== `` && fontSelected.value !== `__default` && fontSelected.value.search(/^library-font-/) === -1" :href="`https://fonts.googleapis.com/css?family=`+fontSelected.value" rel="stylesheet" />
+        <div class="card card-default card-body mt-4" :style="
+            {
+            'font-family' : fontSelected.text,
+            'font-weight' : props.modelValue['font_weight'],
+            'text-transform': props.modelValue['text_transform'],
+            'font-size' : props.modelValue['font_size'][currentDevice]+props.modelValue['font_size_unit'][currentDevice],
+            'line-height' : props.modelValue['line_height'][currentDevice]+props.modelValue['line_height_unit'][currentDevice],
+            'letter-spacing' : props.modelValue['letter_spacing'][currentDevice]+props.modelValue['letter_spacing_unit'][currentDevice],
+            }">
+            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ut rutrum est, quis aliquet est. Vivamus in blandit purus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
+            <p>Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz</p>
+            <p class="mb-0">0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20</p>
+        </div>
+    </div>
 </template>
diff --git a/framework/library/astroid/Admin.php b/framework/library/astroid/Admin.php
@@ -249,6 +249,7 @@ protected function manager()
         // styles
         $stylesheets = ['vendor/manager/dist/index.css', 'media/astroid/assets/vendor/fontawesome/css/all.min.css'];
         $document->addStyleSheet($stylesheets);
+        $document->addStyleSheet('https://fonts.gstatic.com', ['rel' => 'preconnect']);
 
         Helper::triggerEvent('onBeforeAstroidAdminRender', [&$template]);
 

diff --git a/framework/library/vendor/matthiasmullie/minify/bin/minifycss b/framework/library/vendor/matthiasmullie/minify/bin/minifycss
diff --git a/framework/library/vendor/matthiasmullie/minify/bin/minifyjs b/framework/library/vendor/matthiasmullie/minify/bin/minifyjs