initial commit
This commit is contained in:
42
README.md
Normal file
42
README.md
Normal file
@@ -0,0 +1,42 @@
|
||||
# Nuxt 3 Minimal Starter
|
||||
|
||||
Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
|
||||
|
||||
## Setup
|
||||
|
||||
Make sure to install the dependencies:
|
||||
|
||||
```bash
|
||||
# yarn
|
||||
yarn install
|
||||
|
||||
# npm
|
||||
npm install
|
||||
|
||||
# pnpm
|
||||
pnpm install --shamefully-hoist
|
||||
```
|
||||
|
||||
## Development Server
|
||||
|
||||
Start the development server on http://localhost:3000
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
## Production
|
||||
|
||||
Build the application for production:
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
Locally preview production build:
|
||||
|
||||
```bash
|
||||
npm run preview
|
||||
```
|
||||
|
||||
Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
|
||||
112
assets/css/main.css
Normal file
112
assets/css/main.css
Normal file
@@ -0,0 +1,112 @@
|
||||
@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');
|
||||
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
html,
|
||||
body {
|
||||
background-color: #191819;
|
||||
}
|
||||
|
||||
header {
|
||||
background-image: url(https://images.unsplash.com/photo-1524413840807-0c3cb6fa808d?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format);
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.font-jetbrains {
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
}
|
||||
|
||||
.font-rhd {
|
||||
font-family: 'Red Hat Display', sans-serif;
|
||||
}
|
||||
|
||||
.love {
|
||||
text-decoration: underline;
|
||||
text-decoration-color: #EB0066;
|
||||
}
|
||||
|
||||
.love::before,
|
||||
.love::after {
|
||||
content: '❤';
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
transition: opacity 650ms;
|
||||
}
|
||||
|
||||
.love::after {
|
||||
margin-left: 4px;
|
||||
animation-name: floating;
|
||||
animation-duration: 2.35s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: linear;
|
||||
}
|
||||
|
||||
.love::before {
|
||||
margin-left: -24px;
|
||||
animation-name: floatingButDownMore;
|
||||
animation-duration: 2.025s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: linear;
|
||||
}
|
||||
|
||||
.love:hover::after, .love:active::after, .love:focus::after {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.love:hover::before, .love:active::before, .love:focus::before {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@keyframes floating {
|
||||
0% {
|
||||
transform: translate(0, -5px) rotate(0turn);
|
||||
}
|
||||
|
||||
25% {
|
||||
transform: translate(0, -11px) rotate(0.0425turn);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translate(0, -17px) rotate(0turn);
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: translate(0, -11px) rotate(-0.05turn);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translate(0, -5px) rotate(0turn);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes floatingButDownMore {
|
||||
0% {
|
||||
transform: translate(0, 2px) rotate(0turn);
|
||||
}
|
||||
|
||||
25% {
|
||||
transform: translate(0, -4px) rotate(-0.05turn);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translate(0, -10px) rotate(0turn);
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: translate(0, -4px) rotate(0.0375turn);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translate(0, 2px) rotate(0turn);
|
||||
}
|
||||
}
|
||||
|
||||
.main-content {
|
||||
column-count: 12;
|
||||
}
|
||||
10
nuxt.config.ts
Normal file
10
nuxt.config.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
// https://nuxt.com/docs/api/configuration/nuxt-config
|
||||
export default defineNuxtConfig({
|
||||
css: ['~/assets/css/main.css'],
|
||||
postcss: {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
},
|
||||
})
|
||||
13746
package-lock.json
generated
Normal file
13746
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
16
package.json
Normal file
16
package.json
Normal file
@@ -0,0 +1,16 @@
|
||||
{
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "nuxt build",
|
||||
"dev": "nuxt dev",
|
||||
"generate": "nuxt generate",
|
||||
"preview": "nuxt preview",
|
||||
"postinstall": "nuxt prepare"
|
||||
},
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^10.4.13",
|
||||
"nuxt": "3.0.0",
|
||||
"postcss": "^8.4.19",
|
||||
"tailwindcss": "^3.2.4"
|
||||
}
|
||||
}
|
||||
37
pages/index.vue
Normal file
37
pages/index.vue
Normal file
@@ -0,0 +1,37 @@
|
||||
<template>
|
||||
<div class="h-screen text-white">
|
||||
<header class="w-screen h-3/5 sm:h-2/5 md:h-3/5">
|
||||
<div
|
||||
class="p-6 bg-[#12121233] grid grid-cols-12 gap-5 items-center sm:justify-start w-full h-full backdrop-blur-md backdrop-saturate-[1.15]">
|
||||
<div
|
||||
class="sm:h-32 sm:!col-start-2 sm:col-span-8 md:col-span-6 lg:col-span-5 w-32 sm:w-fit max-h-full md:h-40 items-center grid grid-rows-1 grid-cols-1 sm:grid-cols-2 drop-shadow-md">
|
||||
<img src="https://avatars.githubusercontent.com/u/62722391?v=4"
|
||||
class="h-32 md:h-40 max-h-full rounded-full mb-3 sm:mb-0 sm:mr-2" />
|
||||
<div class="grid grid-rows-5 grid-cols-1 h-fit">
|
||||
<h1 class="text-4xl md:text-5xl row-span-3 font-jetbrains">Juls07</h1>
|
||||
<p class="text-zinc-100 row-span-2 md:text-lg h-fit">Fullstack dev</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<main class="grid grid-cols-12 gap-5">
|
||||
<section class="py-6 mb-4 lg:col-span-6 md:col-span-8 col-span-10">
|
||||
<h2 class="text-rhd md:text-4xl text-3xl mb-1">About me</h2>
|
||||
<hr class="border-2 border-[#EB0066] rounded-md w-7/12 min-w-[200px] max-w-xs lg:max-w-sm mb-1" />
|
||||
<p class="max-w-md sm:max-w-xl md:max-w-3xl lg:max-w-4xl">
|
||||
Hi there, I'm juls07, I am 14 years old and I <span tabindex="1"
|
||||
class="love">love</span> web development. I first dabbled in web development
|
||||
when I was ten, and here we are today! I mainly use
|
||||
<a class="text-rose-500 hover:underline visited:bg-rose-700"
|
||||
href="https://nuxtjs.org">NuxtJs</a> 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 <a class="text-rose-500 hover:underline visited:bg-rose-700"
|
||||
href="https://github.com/juls0730">Github</a> and also my <a
|
||||
class="text-rose-500 hover:underline visited:bg-rose-700"
|
||||
href="https://twitter.com/julie4055_">Twitter</a>.
|
||||
</p>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
19
supabase/functions/newsletter/index.ts
Normal file
19
supabase/functions/newsletter/index.ts
Normal file
@@ -0,0 +1,19 @@
|
||||
// Follow this setup guide to integrate the Deno language server with your editor:
|
||||
// https://deno.land/manual/getting_started/setup_your_environment
|
||||
// This enables autocomplete, go to definition, etc.
|
||||
|
||||
import { serve } from "https://deno.land/std@0.131.0/http/server.ts"
|
||||
|
||||
console.log("Hello from Functions!")
|
||||
|
||||
serve(async (req) => {
|
||||
const { name } = await req.json()
|
||||
const data = {
|
||||
message: `Hello ${name}!`,
|
||||
}
|
||||
|
||||
return new Response(
|
||||
JSON.stringify(data),
|
||||
{ headers: { "Content-Type": "application/json" } },
|
||||
)
|
||||
})
|
||||
15
tailwind.config.js
Normal file
15
tailwind.config.js
Normal file
@@ -0,0 +1,15 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
content: [
|
||||
"./components/**/*.{js,vue,ts}",
|
||||
"./layouts/**/*.vue",
|
||||
"./pages/**/*.vue",
|
||||
"./plugins/**/*.{js,ts}",
|
||||
"./nuxt.config.{js,ts}",
|
||||
"./app.vue",
|
||||
],
|
||||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
4
tsconfig.json
Normal file
4
tsconfig.json
Normal file
@@ -0,0 +1,4 @@
|
||||
{
|
||||
// https://nuxt.com/docs/guide/concepts/typescript
|
||||
"extends": "./.nuxt/tsconfig.json"
|
||||
}
|
||||
Reference in New Issue
Block a user