Lekcja 1
This commit is contained in:
Dark Steveneq
@@ -1,5 +1,15 @@
|
||||
// @ts-check
|
||||
import { defineConfig } from 'astro/config';
|
||||
|
||||
import sitemap from '@astrojs/sitemap';
|
||||
import tailwindcss from '@tailwindcss/vite';
|
||||
import svelte from '@astrojs/svelte';
|
||||
|
||||
// https://astro.build/config
|
||||
export default defineConfig({});
|
||||
export default defineConfig({
|
||||
integrations: [sitemap(), svelte()],
|
||||
|
||||
vite: {
|
||||
plugins: [tailwindcss()]
|
||||
}
|
||||
});
|
||||
1996
package-lock.json
generated
1996
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
10
package.json
10
package.json
@@ -9,6 +9,14 @@
|
||||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"astro": "^5.16.0"
|
||||
"@astrojs/sitemap": "^3.6.0",
|
||||
"@astrojs/svelte": "^7.2.2",
|
||||
"@lucide/astro": "^0.554.0",
|
||||
"@tailwindcss/vite": "^4.1.17",
|
||||
"astro": "^5.16.0",
|
||||
"astro-seo": "^0.8.4",
|
||||
"svelte": "^5.43.14",
|
||||
"tailwindcss": "^4.1.17",
|
||||
"typescript": "^5.9.3"
|
||||
}
|
||||
}
|
||||
6
src/components/Footer.astro
Normal file
6
src/components/Footer.astro
Normal file
@@ -0,0 +1,6 @@
|
||||
---
|
||||
---
|
||||
|
||||
<footer class="">
|
||||
|
||||
</footer>
|
||||
36
src/components/Header.astro
Normal file
36
src/components/Header.astro
Normal file
@@ -0,0 +1,36 @@
|
||||
---
|
||||
import { House, Image, Phone } from '@lucide/astro'
|
||||
---
|
||||
|
||||
<header class="
|
||||
flex flex-row justify-between
|
||||
mb-3 py-0.5 px-3 rounded-md h-14
|
||||
bg-slate-100 drop-shadow-slate-300 drop-shadow-md
|
||||
">
|
||||
<a class="
|
||||
flex flex-col
|
||||
my-auto
|
||||
hover:text-shadow-sm text-shadow-slate-50
|
||||
hover:scale-110
|
||||
not-motion-reduce:transition-all
|
||||
" href="/">
|
||||
<h1 class="font-serif text-xl">Jakiś fotograf</h1>
|
||||
<h5 class="text-xs font-light ml-0.5">Zdjęcia na zamówienie</h5>
|
||||
</a>
|
||||
<nav class="
|
||||
flex flex-row gap-3.5 mt-auto mb-0 font-light font-xs text-center
|
||||
">
|
||||
<a class="flex flex-col hover:text-shadow-sm text-shadow-slate-50 hover:scale-110 hover:text-slate-700 not-motion-reduce:transition-all hover:mx-1" href="/">
|
||||
<House class="mx-auto" stroke-width={1} />
|
||||
Strona główna
|
||||
</a>
|
||||
<a class="flex flex-col hover:text-shadow-sm text-shadow-slate-50 hover:scale-110 hover:text-slate-700 not-motion-reduce:transition-all hover:mx-1" href="/portfolio">
|
||||
<Image class="mx-auto" stroke-width={1} />
|
||||
Portfolio
|
||||
</a>
|
||||
<a class="flex flex-col hover:text-shadow-sm text-shadow-slate-50 hover:scale-110 hover:text-slate-700 not-motion-reduce:transition-all hover:mx-1 mr-1" href="/kontakt">
|
||||
<Phone class="mx-auto" stroke-width={1} />
|
||||
Kontakt
|
||||
</a>
|
||||
</nav>
|
||||
</header>
|
||||
@@ -1,5 +1,14 @@
|
||||
---
|
||||
import Header from '../components/Header.astro'
|
||||
import '../styles/global.css'
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<html class="
|
||||
m-0 w-svw h-svh
|
||||
text-slate-950 bg-slate-200 select-none
|
||||
" lang="pl">
|
||||
<!-- dark:text-slate-100 dark:bg-slate-950 -->
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
@@ -7,16 +16,16 @@
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>Astro Basics</title>
|
||||
</head>
|
||||
<body>
|
||||
<slot />
|
||||
<body class="flex flex-col p-2">
|
||||
<Header />
|
||||
<main class="
|
||||
grow
|
||||
2xl:mx-auto p-4 rounded-md
|
||||
w-[92rem] max-w-full
|
||||
bg-slate-100 drop-shadow-slate-300 drop-shadow-md
|
||||
block
|
||||
">
|
||||
<slot />
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,11 +1,6 @@
|
||||
---
|
||||
import Welcome from '../components/Welcome.astro';
|
||||
import Layout from '../layouts/Layout.astro';
|
||||
|
||||
// Welcome to Astro! Wondering what to do next? Check out the Astro documentation at https://docs.astro.build
|
||||
// Don't want to use any of this? Delete everything in this file, the `assets`, `components`, and `layouts` directories, and start fresh.
|
||||
---
|
||||
|
||||
<Layout>
|
||||
<Welcome />
|
||||
</Layout>
|
||||
|
||||
13
src/pages/kontakt/Kafelek.astro
Normal file
13
src/pages/kontakt/Kafelek.astro
Normal file
@@ -0,0 +1,13 @@
|
||||
---
|
||||
import { type AstroComponent } from "@lucide/astro"
|
||||
const { tytul, tresc, ikona } = Astro.props;
|
||||
---
|
||||
|
||||
<div class="
|
||||
rounded-md size-36 flex flex-col text-center p-1.5
|
||||
bg-slate-100 drop-shadow-md drop-shadow-slate-400
|
||||
">
|
||||
<slot/>
|
||||
<h3>{tytul}</h3>
|
||||
<h4 class="text-sm text-slate-700">{tresc}</h4>
|
||||
</div>
|
||||
20
src/pages/kontakt/index.astro
Normal file
20
src/pages/kontakt/index.astro
Normal file
@@ -0,0 +1,20 @@
|
||||
---
|
||||
import Layout from "../../layouts/Layout.astro"
|
||||
import { Phone, Mail } from "@lucide/astro"
|
||||
import Kafelek from "./Kafelek.astro"
|
||||
---
|
||||
|
||||
<Layout>
|
||||
<h2 class="text-xl mb-1">Kontakt</h2>
|
||||
<hr>
|
||||
<div class="
|
||||
flex flex-row flex-wrap m-3 gap-5
|
||||
">
|
||||
<Kafelek tytul="Telefon" tresc="+48 123 456 789">
|
||||
<Phone class="grow m-auto" stroke-width={1} width={32}/>
|
||||
</Kafelek>
|
||||
<Kafelek tytul="E-mail" tresc="ja@jakisfotograf.xd">
|
||||
<Mail class="grow m-auto" stroke-width={1} width={32}/>
|
||||
</Kafelek>
|
||||
</div>
|
||||
</Layout>
|
||||
7
src/pages/portfolio/Img.astro
Normal file
7
src/pages/portfolio/Img.astro
Normal file
@@ -0,0 +1,7 @@
|
||||
---
|
||||
const { src } = Astro.props
|
||||
---
|
||||
|
||||
<div class="inline-block w-full">
|
||||
<img class="block w-full rounded-md" src={src}>
|
||||
</div>
|
||||
29
src/pages/portfolio/index.astro
Normal file
29
src/pages/portfolio/index.astro
Normal file
@@ -0,0 +1,29 @@
|
||||
---
|
||||
import Layout from "../../layouts/Layout.astro"
|
||||
import Img from "./Img.astro"
|
||||
---
|
||||
|
||||
<Layout>
|
||||
<h2 class="text-2xl mb-1">Portfolio</h2>
|
||||
<hr>
|
||||
Przejrzyj galerie ze zdjęciami które dotychczas zrobiłem
|
||||
<div class="
|
||||
colsumns-1 md:columns-2 lg:columns-3 xl:columns-4
|
||||
m-3 gap-4
|
||||
">
|
||||
<Img src="https://imgs.search.brave.com/8YYU56naky-TjpomrB5iAuhWlvTb-q4N7QYgQHinfv4/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly91cGxv/YWQud2lraW1lZGlh/Lm9yZy93aWtpcGVk/aWEvZW4vMi8yNy9C/bGlzc18lMjhXaW5k/b3dzX1hQJTI5LnBu/Zw"/>
|
||||
<Img src="https://imgs.search.brave.com/r-aB-UsArTvThNH2tXuCsgwSm-jEIBLECvEHw9dCbi0/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly91cGxv/YWQud2lraW1lZGlh/Lm9yZy93aWtpcGVk/aWEvY29tbW9ucy90/aHVtYi8xLzFmL0lj/ZWxhbmRpY19MYW5k/c2NhcGVfbmVhcl9O/ZXNrYXVwc3RhJUMz/JUIwdXJfSnVseV8y/MDE0LkpQRy8xMjAw/cHgtSWNlbGFuZGlj/X0xhbmRzY2FwZV9u/ZWFyX05lc2thdXBz/dGElQzMlQjB1cl9K/dWx5XzIwMTQuSlBH"/>
|
||||
<Img src="https://imgs.search.brave.com/ZI-ORD-HU-_TuXBGTmqAOAVZUyh9e-bBqSK6oK3dwZs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly9iLnRo/dW1icy5yZWRkaXRt/ZWRpYS5jb20vT2hF/aEktMEx6d3RMQzZp/bVFSSFdmYVVaZ2Jz/YXhveUg5SWNLcm55/WmFrdy5qcGc"/>
|
||||
<Img src="https://imgs.search.brave.com/fxGiKcqAc3oSddpzN1F0SQZ7-csq5u37J6_N6zk_0eQ/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly9zdGF0/aWMud2ViY2FtZXJh/LnBsL2NhbXNiaWcv/NjAwL2JpZWxza28t/YmlhbGEtcGxhYy1y/YXR1c3pvd3kud2Vi/cD9uYz0xNzYzNzE5/Njg5"/>
|
||||
<Img src="https://imgs.search.brave.com/omDZo67t1Ymr67yw32t0JYwfuqDKFFnHdkldYkJbUP8/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly9tZWRp/YS5pc3RvY2twaG90/by5jb20vaWQvMTQ0/NjA1NzM2MS9wbC96/ZGolQzQlOTljaWUv/d2Fyc3phd2EuanBn/P3M9NjEyeDYxMiZ3/PTAmaz0yMCZjPVAw/MWJDQk0yTUNpcjFh/T1FyUWVkZHBMTk9k/LTU4VUlUWE82ZnZr/bXVCd0U9"/>
|
||||
<Img src="https://imgs.search.brave.com/keIsyc1p9oQuWxtZDXasHj8qqV19euhUwSUWrDHTYfI/rs:fit:500:0:1:0/g:ce/aHR0cHM6Ly9tZWRp/YS5pc3RvY2twaG90/by5jb20vaWQvNDU4/MzAwMzE3L3Bob3Rv/L2Nsb3NlLXVwLW9m/LWEtcmFzcGJlcnJ5/LXBpLmpwZz9zPTYx/Mng2MTImdz0wJms9/MjAmYz1udDNwZUxE/RUpCbFRsZWsxb0do/VmE2bzZYa2hMZ01M/bXh5NGRUeWhhT0V3/PQ"/>
|
||||
<Img src="https://imgs.search.brave.com/_kixBt5x36HXgLISJqbePsgi4GyNYCIfSQYFU2QJ0iU/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly9pLnBp/bmltZy5jb20vb3Jp/Z2luYWxzLzE0LzRm/L2E2LzE0NGZhNmQy/YmYwNDdhMTkzNGYw/ZjBlNzc4ZDg4ZGJi/LmpwZw"/>
|
||||
<Img src="https://upload.wikimedia.org/wikipedia/commons/1/10/00635_Schlafender_Mann_auf_einer_Bank_an_einer_Bushaltestelle_in_Sanok_%282012%29.JPG"/>
|
||||
<Img src="https://upload.wikimedia.org/wikipedia/commons/a/a1/Extreme_programming_in_action.jpg"/>
|
||||
<Img src="https://nonsa.pl/images/thumb/3/3d/Nonsensopedia_Dyskietka_Edition.jpg/1920px-Nonsensopedia_Dyskietka_Edition.jpg"/>
|
||||
<Img src="https://nonsa.pl/images/b/ba/Admin-na-wakacjach.jpg"/>
|
||||
<Img src="https://nonsa.pl/images/thumb/3/3d/Kumulacja.jpg/200px-Kumulacja.jpg"/>
|
||||
<Img src="https://imgs.search.brave.com/S0wGUqEkPFtxyEAEOcCe4bJ-CIhKBWtJEH2dEhZfzAo/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly9tZWRp/YS5nZXR0eWltYWdl/cy5jb20vaWQvOTcz/Mjk3NjgvcGhvdG8v/d29ybGQtdHJhZGUt/Y2VudGVyLXRlcnJv/cmlzdC1hdHRhY2st/c21va2UtYmlsbG93/cy1mcm9tLTItd29y/bGQtdHJhZGUtY2Vu/dGVyLWFmdGVyLWl0/LXdhcy1zdHJ1Y2su/anBnP3M9NjEyeDYx/MiZ3PTAmaz0yMCZj/PVJuem9GMHFtMUJK/MXRGTXhac09oLWpo/a2ZUdUExUXJiRFJQ/RVFWaWNfcFE9"/>
|
||||
<Img src="https://crapbox.nonamesoft.xyz/f/6894ab26-da59-43a0-9b54-ffede925657f.png" />
|
||||
</div>
|
||||
</Layout>
|
||||
6
src/styles/global.css
Normal file
6
src/styles/global.css
Normal file
@@ -0,0 +1,6 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
|
||||
@import "tailwindcss";
|
||||
|
||||
@theme {
|
||||
--default-font-family: "Montserrat"
|
||||
}
|
||||
5
svelte.config.js
Normal file
5
svelte.config.js
Normal file
@@ -0,0 +1,5 @@
|
||||
import { vitePreprocess } from '@astrojs/svelte';
|
||||
|
||||
export default {
|
||||
preprocess: vitePreprocess(),
|
||||
}
|
||||
Reference in New Issue
Block a user