diff --git a/assets/css/main.css b/assets/css/main.css index 6e0e7b0..faa769c 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -1,5 +1,6 @@ @import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display&display=swap'); @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap'); +@import url('https://fonts.googleapis.com/css?family=Inter&display=swap'); @tailwind base; @tailwind components; @@ -25,6 +26,10 @@ header { font-family: 'Red Hat Display', sans-serif; } +.font-inter { + font-family: 'Inter'; +} + .love { text-decoration: underline; text-decoration-color: #EB0066; @@ -55,11 +60,15 @@ header { animation-timing-function: linear; } -.love:hover::after, .love:active::after, .love:focus::after { +.love:hover::after, +.love:active::after, +.love:focus::after { opacity: 1; } -.love:hover::before, .love:active::before, .love:focus::before { +.love:hover::before, +.love:active::before, +.love:focus::before { opacity: 1; } @@ -109,4 +118,8 @@ header { .main-content { column-count: 12; +} + +.bg-grid-pink-600\/\[0\.05\] { + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' width='32' height='32' fill='none' stroke='rgb(90 43 136 / 0.05)'%3e%3cpath d='M0 .5H31.5V32'/%3e%3c/svg%3e"); } \ No newline at end of file diff --git a/components/skillButton.vue b/components/skillButton.vue new file mode 100644 index 0000000..a5347b7 --- /dev/null +++ b/components/skillButton.vue @@ -0,0 +1,10 @@ + + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index e19f8b2..0d2acea 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,5 +1,5 @@ { - "name": "juls07.dev-rebuild", + "name": "juls07.dev-v2", "lockfileVersion": 2, "requires": true, "packages": { diff --git a/pages/index.vue b/pages/index.vue index e15bb97..909d01e 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -2,34 +2,43 @@
+ class="p-6 bg-[#12121233] justify-center grid sm:grid-cols-12 gap-5 items-center sm:justify-start w-full h-full backdrop-blur-md backdrop-saturate-[1.15]">
-

Juls07

-

Fullstack dev

+

Fullstack dev

-
-
+
+

About me

-

- Hi there, I'm juls07, I am 14 years old and I love web development. I first dabbled in web development +

+ Hi there, I'm juls07, I am 14 years old and I love web + development. I first dabbled in web development when I was ten, and here we are today! I mainly use - NuxtJs to build my websites since I absolutely + NuxtJs to + build my websites since I absolutely adore Vuejs. For me, I love being able to imagine anything and it to come to life. Finally, go checkout my Github and also my Twitter.

+

Skills

+
+ + + + +
diff --git a/public/icons/JavaScript.svg b/public/icons/JavaScript.svg new file mode 100644 index 0000000..9607e3f --- /dev/null +++ b/public/icons/JavaScript.svg @@ -0,0 +1,27 @@ + + + + + + + + + + diff --git a/public/icons/Laravel.svg b/public/icons/Laravel.svg new file mode 100644 index 0000000..e1309dd --- /dev/null +++ b/public/icons/Laravel.svg @@ -0,0 +1 @@ +Logomark \ No newline at end of file diff --git a/public/icons/React Logo.svg b/public/icons/React Logo.svg new file mode 100644 index 0000000..e07b101 --- /dev/null +++ b/public/icons/React Logo.svg @@ -0,0 +1,9 @@ + + React Logo + + + + + + + \ No newline at end of file diff --git a/public/icons/Vue.js.svg b/public/icons/Vue.js.svg new file mode 100644 index 0000000..271db25 --- /dev/null +++ b/public/icons/Vue.js.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/public/icons/ruby.svg b/public/icons/ruby.svg new file mode 100644 index 0000000..2a05547 --- /dev/null +++ b/public/icons/ruby.svg @@ -0,0 +1,136 @@ + + +image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file