@@ -1,5 +1,7 @@
|
|||||||
@import url("https://fonts.googleapis.com/css2?family=Fira+Sans:wght@100;200;400;600&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
|
@import url("https://fonts.googleapis.com/css2?family=Fira+Sans:wght@100;200;400;600&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
|
||||||
|
|
||||||
|
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&display=swap");
|
||||||
|
|
||||||
@tailwind base;
|
@tailwind base;
|
||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="px-5 font-mono mb-5">
|
<div class="px-5 font-ibmmono mb-5">
|
||||||
<h4 class="font-semibold text-slate-800 text-xl antialiased p-2">
|
<h4 class="font-semibold text-slate-800 text-xl antialiased p-2">
|
||||||
Typescript
|
Typescript
|
||||||
</h4>
|
</h4>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="font-mono">
|
<div class="font-ibmmono">
|
||||||
<nuxt-link class="flex items-baseline space-x-3 space-y-2" to="/">
|
<nuxt-link class="flex items-baseline space-x-3 space-y-2" to="/">
|
||||||
<icon name="arcticons:blogger" />
|
<icon name="arcticons:blogger" />
|
||||||
<h4 class="text-blue-600 hover:underline">
|
<h4 class="text-blue-600 hover:underline">
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ const theme = ref("light");
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<footer class="p-3 mt-10 bg-[#a2d9ff] font-poppins">
|
<footer class="p-3 mt-10 bg-[#a2d9ff] font-ibmmono">
|
||||||
<div class="container px-4 mx-auto max-w-6xl flex justify-center">
|
<div class="container px-4 mx-auto max-w-6xl flex justify-center">
|
||||||
<ul class="flex space-x-2 text-sm text-slate-800 items-end justify-start">
|
<ul class="flex space-x-2 text-sm text-slate-800 items-end justify-start">
|
||||||
<li>Copyright © 2022 - Present</li>
|
<li>Copyright © 2022 - Present</li>
|
||||||
|
|||||||
@@ -11,22 +11,11 @@ const activeNavbar = computed(() => {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<header class="sticky top-0 p-3 bg-[#a2d9ff] font-poppins">
|
<header class="sticky top-0 p-3 bg-[#a2d9ff] font-ibmmono">
|
||||||
<div class="container px-4 mx-auto max-w-6xl flex justify-between">
|
<div class="container px-4 mx-auto max-w-6xl flex justify-between">
|
||||||
<ul class="flex space-x-8 items-end justify-start">
|
<ul class="flex space-x-8 items-end justify-start">
|
||||||
<li class="align">
|
<li class="align">
|
||||||
<nuxt-link to="/">
|
<nuxt-link to="/"> Rafkhata </nuxt-link>
|
||||||
<icon
|
|
||||||
class="text-cyan-500 hover:scale-110 hover:transition"
|
|
||||||
size="35"
|
|
||||||
name="mdi:robot-excited"
|
|
||||||
/>
|
|
||||||
</nuxt-link>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<nuxt-link :class="{ underline: activeNavbar === '' }" to="/"
|
|
||||||
>Home</nuxt-link
|
|
||||||
>
|
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<nuxt-link
|
<nuxt-link
|
||||||
@@ -36,10 +25,8 @@ const activeNavbar = computed(() => {
|
|||||||
>
|
>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<nuxt-link
|
<nuxt-link :class="{ underline: activeNavbar === 'tags' }" to="/tags"
|
||||||
:class="{ underline: activeNavbar === 'category' }"
|
>Tags</nuxt-link
|
||||||
to="/category"
|
|
||||||
>Category</nuxt-link
|
|
||||||
>
|
>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="font-semibold antialiased text-slate-800 font-poppins hover:underline"
|
class="font-semibold antialiased text-slate-800 font-ibmmono hover:underline"
|
||||||
>
|
>
|
||||||
<nuxt-link class="flex items-baseline space-x-3" to="/">
|
<nuxt-link class="flex items-baseline space-x-3" to="/">
|
||||||
<div class="hover:scale-125 transition">
|
<div class="hover:scale-125 transition">
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="text-xs font-poppins antialiased text-slate-600 flex space-x-2">
|
<div class="text-xs font-ibmmono antialiased text-slate-600 flex space-x-2">
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<p class="mr-1">Created</p>
|
<p class="mr-1">Created</p>
|
||||||
<slot name="time" />
|
<slot name="time" />
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ const { data } = await useAsyncData("home", () => queryContent("/").find());
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="container mx-auto max-w-6xl font-mono antialiased">
|
<div class="container mx-auto max-w-6xl font-ibmmono antialiased">
|
||||||
<h1 class="font-semibold text-3xl mt-10 py-3 mx-5 text-slate-800">
|
<h1 class="font-semibold text-3xl mt-10 py-3 mx-5 text-slate-800">
|
||||||
ALL CONTENTS
|
ALL CONTENTS
|
||||||
</h1>
|
</h1>
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ let x = ref(10);
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="container px-4 mx-auto max-w-6xl flex font-poppins gap-14 antialiased"
|
class="container px-4 mx-auto max-w-6xl flex font-ibmmono gap-14 antialiased"
|
||||||
>
|
>
|
||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<h1 class="text-xl pb-8 tracking-wide text-[#e60067]">
|
<h1 class="text-xl pb-8 tracking-wide text-[#e60067]">
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ const { data } = await useAsyncData("home", () => queryContent("/").find());
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="container mx-auto max-w-6xl font-poppins antialiased">
|
<div class="container mx-auto max-w-6xl font-ibmmono antialiased">
|
||||||
<h1 class="font-semibold text-3xl mt-10 py-3 mx-5 text-slate-800">
|
<h1 class="font-semibold text-3xl mt-10 py-3 mx-5 text-slate-800">
|
||||||
LATEST CONTENT
|
LATEST CONTENT
|
||||||
</h1>
|
</h1>
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ const { data } = await useAsyncData("home", () => queryContent("/").find());
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="container mx-auto max-w-6xl font-poppins antialiased">
|
<div class="container mx-auto max-w-6xl font-ibmmono antialiased">
|
||||||
<h1 class="font-semibold text-3xl mt-10 py-3 mx-5 text-slate-800">
|
<h1 class="font-semibold text-3xl mt-10 py-3 mx-5 text-slate-800">
|
||||||
ALL JAVASCRIPT POST
|
ALL JAVASCRIPT POST
|
||||||
</h1>
|
</h1>
|
||||||
@@ -6,9 +6,9 @@ const { data } = await useAsyncData("home", () => queryContent("/").find());
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="container mx-auto max-w-6xl font-poppins antialiased">
|
<div class="container mx-auto max-w-6xl font-ibmmono antialiased">
|
||||||
<h1 class="font-semibold text-3xl mt-10 py-3 mx-5 text-slate-800">
|
<h1 class="font-semibold text-3xl mt-10 py-3 mx-5 text-slate-800">
|
||||||
ALL CATEGORY
|
ALL TAGS
|
||||||
</h1>
|
</h1>
|
||||||
<div class="flex justify-start flex-wrap">
|
<div class="flex justify-start flex-wrap">
|
||||||
<category-card v-for="n in 19" :key="n" />
|
<category-card v-for="n in 19" :key="n" />
|
||||||
@@ -4,6 +4,7 @@ module.exports = {
|
|||||||
extend: {
|
extend: {
|
||||||
fontFamily: {
|
fontFamily: {
|
||||||
poppins: ["Poppins", "sans-serif"],
|
poppins: ["Poppins", "sans-serif"],
|
||||||
|
ibmmono: ["IBM Plex Mono", "monospace"],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user