From 7e2df27d9c969b1489cdb1e68659aba1baba4721 Mon Sep 17 00:00:00 2001 From: Arina Yakovenko Date: Wed, 28 May 2025 15:56:01 +0200 Subject: [PATCH] init --- .prettierrc | 3 + app.vue | 7 +- assets/fonts.css | 12 +- assets/main.css | 39 +- components/ButtonArrow.vue | 43 +- components/HeaderBlock.vue | 46 +- components/ThemeSwitcher.vue | 8 +- components/sections/main-page/HeaderHero.vue | 24 +- eslint.config.mjs | 7 +- layouts/default.vue | 2 +- nuxt.config.ts | 25 +- package.json | 4 +- pnpm-lock.yaml | 10395 +++++++++++------ public/icons/Account.svg | 10 + public/icons/ArrowCorner.svg | 3 + public/icons/Cart.svg | 10 + public/icons/Light.svg | 10 + public/icons/Menu.svg | 10 + public/icons/Moon.svg | 3 + taskfile.yml | 17 +- 20 files changed, 7019 insertions(+), 3659 deletions(-) create mode 100644 .prettierrc create mode 100644 public/icons/Account.svg create mode 100644 public/icons/ArrowCorner.svg create mode 100644 public/icons/Cart.svg create mode 100644 public/icons/Light.svg create mode 100644 public/icons/Menu.svg create mode 100644 public/icons/Moon.svg diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..b4bfed3 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,3 @@ +{ + "plugins": ["prettier-plugin-tailwindcss"] +} diff --git a/app.vue b/app.vue index 69eb5a9..ff379be 100644 --- a/app.vue +++ b/app.vue @@ -1,5 +1,7 @@ - + diff --git a/assets/fonts.css b/assets/fonts.css index 679a3ab..2085195 100644 --- a/assets/fonts.css +++ b/assets/fonts.css @@ -1,7 +1,7 @@ @font-face { - font-family: 'Bounded'; - src: url('/fonts/Bounded/Bounded-Variable.ttf') format('truetype'); - font-weight: 100 900; - font-style: normal; - font-display: swap; -} \ No newline at end of file + font-family: "Bounded"; + src: url("/fonts/Bounded/Bounded-Variable.ttf") format("truetype"); + font-weight: 100 900; + font-style: normal; + font-display: swap; +} diff --git a/assets/main.css b/assets/main.css index 66dc414..0086004 100644 --- a/assets/main.css +++ b/assets/main.css @@ -1,32 +1,34 @@ @import "@nuxt/ui"; @import "tailwindcss"; - @theme { /* fonts */ --font-inter: "Inter", sans-serif; --font-bounded: "Bounded", sans-serif; /* colors */ - --color-bg-light: #FFFEFB; - --color-bg-dark: #1A1A1A; + --color-bg-light: #fffefb; + --color-bg-dark: #1a1a1a; - --color-border: #D3E0DE; + --color-border: #d3e0de; - --color-text-light: #1A1A1A; - --color-text-dark: #FFFEFB; + --color-text-light: #1a1a1a; + --color-text-dark: #fffefb; /* button */ - --color-button: #9A7F62; - --color-button-hover: #B7946D; - --color-button-disabled: #C5C5C5; + --color-button: #9a7f62; + --color-button-hover: #b7946d; + --color-button-disabled: #c5c5c5; } -/* h1 */ -.h1 { - font-family: var(--font-bounded); - font-weight: 700; - line-height: 140%; +@layer utilities { + .h1 { + @apply font-bounded text-[24px] leading-[140%] font-bold uppercase md:text-[48px] xl:text-[64px]; + } + + .h4-uppercase { + @apply font-inter text-base leading-[150%] font-bold uppercase sm:text-[20px] md:text-[24px]; + } } .text-inter { @@ -34,14 +36,7 @@ line-height: 150%; } -.h4-uppercase { - font-family: var(--font-inter); - font-weight: 700; - line-height: 150%; - text-transform: uppercase; -} - .main { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -} \ No newline at end of file +} diff --git a/components/ButtonArrow.vue b/components/ButtonArrow.vue index f42ae7e..7c8c8ad 100644 --- a/components/ButtonArrow.vue +++ b/components/ButtonArrow.vue @@ -1,8 +1,43 @@