filipe/website-casa-cidalisa
1
0
Fork 0
Code Issues Pull requests Activity

things?

Browse source
This commit is contained in:
Filipe Medeiros 2024-09-08 14:26:54 +02:00
parent d867173e10
commit fb115e3809
Signed by: filipe
GPG key ID: 9533BD5467CC1E78
8 changed files with 58 additions and 5463 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
astro.config.mjs
View file

@ -1,4 +1,8 @@
import { defineConfig } from 'astro/config';
import tailwind from '@astrojs/tailwind';
// https://astro.build/config
export default defineConfig({});
export default defineConfig({
integrations: [tailwind()]
});

BIN
bun.lockb
View file

Binary file not shown.

5451
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

4
package.json
View file

@ -10,6 +10,8 @@
"astro": "astro"
},
"dependencies": {
"astro": "^4.15.4"
"@astrojs/tailwind": "^5.1.0",
"astro": "^4.15.4",
"tailwindcss": "^3.4.10"
}
}

BIN
src/assets/logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 36 KiB

2
src/layouts/Layout.astro
View file

@ -16,7 +16,7 @@ const { title } = Astro.props;
<meta name="generator" content={Astro.generator} />
<title>{title}</title>
</head>
<body style={{ margin: 0 }}>
<body class="m-0 text-night bg-seasalt">
<slot />
</body>
</html>

40
src/pages/index.astro
View file

@ -1,20 +1,42 @@
---
import Layout from "../layouts/Layout.astro";
import { getImage } from "astro:assets";
import { getImage, Image } from "astro:assets";
import HeroImage from "../assets/Frente 6 Bartolomeu.jpg";
import Logo from "../assets/logo.png";
const optimizedBackgroundImage = await getImage({ src: HeroImage });
---
<Layout title="Casa Cidalisa">
<main>
<div
style={{
backgroundImage: `url(${optimizedBackgroundImage.src})`,
width: "100vw",
height: "100vh",
}}
>
</div>
<section class="sm:h-screen sm:grid grid-cols-2 bg-skyBlue">
<div class="py-8 grid grid-rows-2 items-center">
<h1
class="m-0 text-center justify-self-center self-center font-light text-5xl"
>
Bem-vindo à
<Image src={Logo} alt="TODO" height={100} />
</h1>
<div
class="bg-gray-50 self-end justify-self-center font-semibold shadow-lg px-6 py-5 rounded-3xl flex gap-8 items-center md:text-2xl w-fit border-[#ff385c] border-4"
>
<span>Reserve no Airbnb</span>
<a
href="https://www.airbnb.com"
class="bg-[#ff385c] shadow hover:bg-[#ff0a37] cursor-pointer text-white px-3 py-2 rounded-xl"
>Reserve!</a
>
</div>
</div>
<div
class="bg-cover h-full max-h-full bg-[30%_center]"
style={{
backgroundImage: `url(${optimizedBackgroundImage.src})`,
}}
>
</div>
</section>
<div>something else</div>
</main>
</Layout>

18
tailwind.config.mjs Normal file
View file

@ -0,0 +1,18 @@
/** @type {import('tailwindcss').Config} */
export default {
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
theme: {
extend: {
colors: {
seasalt: '#FAFAFA',
green: '#1D462A',
olivine: '#9BBB92',
delftBlue: '#1E3061',
skyBlue: '#8AC0D0',
sunglow: '#FFCA26',
night: '#161618'
}
},
},
plugins: [],
}