Merge master

canopas · Feb 13, 2024 · 46f74a5 · 46f74a5
2 parents c098fd5 + 42155e4
commit 46f74a5
Show file tree

Hide file tree

Showing 5 changed files with 1,761 additions and 1,667 deletions.
diff --git a/nuxt-frontend/assets/css/app.css b/nuxt-frontend/assets/css/app.css
@@ -149,3 +149,67 @@
   font-weight: 600;
   src: url(~/assets/fonts/Comme-SemiBold.woff2) format("woff2");
 }
+
+@font-face {
+  font-display: swap;
+  font-family: Source CodePro;
+  font-style: normal;
+  font-weight: 400;
+  src: url(~/assets/fonts/Source-codePro.woff2) format("woff2");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: Poppins Regular;
+  font-style: normal;
+  font-weight: 400;
+  src: url(~/assets/fonts/Poppins-Regular.woff2) format("woff2");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: Poppins Medium;
+  font-style: medium;
+  font-weight: 500;
+  src: url(~/assets/fonts/Poppins-Medium.woff2) format("woff2");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: Inter-ExtraLight;
+  font-style: normal;
+  font-weight: 200;
+  src: url(~/assets/fonts/Inter-ExtraLight.woff2) format("woff2");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: Comme-Light;
+  font-style: normal;
+  font-weight: 300;
+  src: url(~/assets/fonts/Comme-Light.woff2) format("woff2");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: Comme-Regular;
+  font-style: normal;
+  font-weight: 400;
+  src: url(~/assets/fonts/Comme-Regular.woff2) format("woff2");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: Comme-Medium;
+  font-style: normal;
+  font-weight: 500;
+  src: url(~/assets/fonts/Comme-Medium.woff2) format("woff2");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: Comme-SemiBold;
+  font-style: normal;
+  font-weight: 600;
+  src: url(~/assets/fonts/Comme-SemiBold.woff2) format("woff2");
+}
diff --git a/nuxt-frontend/nuxt.config.js b/nuxt-frontend/nuxt.config.js
@@ -61,6 +61,7 @@ export default defineNuxtConfig({
     "/unsubscribe": { prerender: true },
   },
   nitro: {
+    compressPublicAssets: true,
     preset: "aws-lambda",
   },
 });
diff --git a/nuxt-frontend/package.json b/nuxt-frontend/package.json
@@ -11,7 +11,7 @@
   },
   "devDependencies": {
     "@babel/eslint-parser": "^7.22.15",
-    "@canopassoftware/blog-components": "^1.1.6",
+    "@canopassoftware/blog-components": "^1.1.7",
     "@ivanv/vue-collapse-transition": "^1.0.2",
     "@nuxt/devtools": "latest",
     "@vue/cli-plugin-babel": "^5.0.8",

diff --git a/nuxt-frontend/pages/[slug].vue b/nuxt-frontend/pages/[slug].vue
@@ -6,7 +6,6 @@
       :mixpanel="$mixpanel"
       :recaptchaKey="config.VITE_RECAPTCHA_SITE_KEY"
       :post="post"
-      :recommandedPosts="recommandedPosts"
       :websiteUrl="config.BASE_URL"
       :contactApiUrl="config.API_BASE"
     />
@@ -23,11 +22,7 @@
 import Header from "@/components/partials/NewHeader.vue";
 import { useRoute } from "vue-router";
 import config from "@/config";
-import {
-  useBlogDetailStore,
-  useRecommandedBlogStore,
-} from "@/stores/resources";
-import { filterPostsByCategoryAndTag } from "@/utils";
+import { useBlogDetailStore } from "@/stores/resources";
 
 const { $mixpanel } = useNuxtApp();
 const post = ref([]);
@@ -38,10 +33,7 @@ const store = useBlogDetailStore();
 const postData = computed(() => store.item);
 const status = computed(() => store.status);
 
-const recStore = useRecommandedBlogStore();
-const recommandedBlog = computed(() => recStore.items);
-
-let published_time, recommandedPosts;
+let published_time;
 await useAsyncData("blog", () => store.loadResource(slug.value));
 
 if (status.value !== config.SUCCESS) {
@@ -55,15 +47,6 @@ if (status.value !== config.SUCCESS) {
 
 published_time = new Date(post?.value?.published_on).toLocaleTimeString();
 
-await useAsyncData("recommandedBlog", () =>
-  recStore.loadRecommandedBlog(slug.value, config.SHOW_DRAFT_POSTS),
-);
-
-recommandedPosts = filterPostsByCategoryAndTag(
-  post.value,
-  recommandedBlog.value,
-);
-
 useHead({
   script: [
     {
@@ -130,11 +113,12 @@ function getJsonLdSchema() {
   };
 }
 //for copy to clipboard of code blocks
-function copyCode(bash) {
+async function copyCode(bash) {
   const code = bash.querySelector("code");
   const text = code.innerText;
-  navigator.clipboard.writeText(text);
+  await navigator.clipboard.writeText(text);
 }
+
 onMounted(() => {
   const bashes = document.querySelectorAll("pre");
   bashes.forEach((bash) => {
@@ -144,25 +128,33 @@ onMounted(() => {
       wrapperDiv.appendChild(bash);
       wrapperDiv.classList.add("relative");
 
-      const isSingleLine = bash.textContent.trim().split("\n").length === 1;
-      if (isSingleLine) {
-        bash.classList.add("!pr-20");
-      }
       const button = document.createElement("button");
       button.classList.add("copy-btn");
       button.innerText = "copy";
+
       bash.appendChild(button);
+
+      const isSingleLine = bash.textContent.trim().split("\n").length === 1;
+      if (isSingleLine) {
+        bash.classList.add("!pr-20");
+      }
+
       button.addEventListener("click", async () => {
-        await copyCode(bash, button);
+        await copyCode(bash);
         button.innerText = "copied!";
-        button.classList.add("text-green-500");
+        button.classList.add("!text-green-600");
+
+        setTimeout(() => {
+          button.innerText = "copy";
+          button.classList.remove("!text-green-600");
+        }, 2000);
       });
     }
   });
 });
 </script>
 <style lang="postcss">
 .copy-btn {
-  @apply absolute top-3 right-3 border-1 px-2 bg-gray-700 rounded-lg;
+  @apply absolute top-3 right-3 border-1 px-2 bg-white text-[#1f2937] rounded-lg font-semibold;
 }
 </style>