wyroby ciasta
bronkuu
11
base.css
|
|
@ -8,9 +8,12 @@
|
|||
--on-background: #363227;
|
||||
--nav-height: 4rem;
|
||||
--border-radius: 48px;
|
||||
--small-border-radius: 8px;
|
||||
--max-content-width: 80rem;
|
||||
--secondary-container: #e0f5cb;
|
||||
--on-secondary-container: #4c5e3e;
|
||||
--on-surface: #363227;
|
||||
--outline-variant: #b9b1a3;
|
||||
}
|
||||
|
||||
body {
|
||||
|
|
@ -33,6 +36,7 @@ h1, h2, h3, h4{
|
|||
h1{
|
||||
font-size: 4rem;
|
||||
line-height: 3.5rem;
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
|
||||
h2{
|
||||
|
|
@ -66,6 +70,10 @@ section, nav, footer {
|
|||
}
|
||||
}
|
||||
|
||||
nav {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
svg {
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
|
|
@ -77,3 +85,6 @@ ul {
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
margin-bottom: 5rem;
|
||||
}
|
||||
|
|
|
|||
BIN
images/wyroby/001.jpg
Normal file
|
After Width: | Height: | Size: 530 KiB |
BIN
images/wyroby/002.jpg
Normal file
|
After Width: | Height: | Size: 397 KiB |
BIN
images/wyroby/003.jpg
Normal file
|
After Width: | Height: | Size: 232 KiB |
BIN
images/wyroby/004.jpg
Normal file
|
After Width: | Height: | Size: 530 KiB |
BIN
images/wyroby/005.jpg
Normal file
|
After Width: | Height: | Size: 397 KiB |
BIN
images/wyroby/006.jpg
Normal file
|
After Width: | Height: | Size: 232 KiB |
BIN
images/wyroby/007.jpg
Normal file
|
After Width: | Height: | Size: 530 KiB |
BIN
images/wyroby/008.jpg
Normal file
|
After Width: | Height: | Size: 397 KiB |
BIN
images/wyroby/009.jpg
Normal file
|
After Width: | Height: | Size: 232 KiB |
BIN
images/wyroby/010.jpg
Normal file
|
After Width: | Height: | Size: 530 KiB |
BIN
images/wyroby/011.jpg
Normal file
|
After Width: | Height: | Size: 397 KiB |
BIN
images/wyroby/012.jpg
Normal file
|
After Width: | Height: | Size: 232 KiB |
BIN
images/wyroby/013.jpg
Normal file
|
After Width: | Height: | Size: 530 KiB |
BIN
images/wyroby/014.jpg
Normal file
|
After Width: | Height: | Size: 397 KiB |
BIN
images/wyroby/015.jpg
Normal file
|
After Width: | Height: | Size: 232 KiB |
58
wyroby.css
|
|
@ -1,8 +1,62 @@
|
|||
@import "base.css";
|
||||
|
||||
.wyroby {
|
||||
& > :last-child {
|
||||
padding-top: 2rem;
|
||||
|
||||
& > div:nth-child(2) {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-template-columns: auto 1fr auto auto auto auto;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
& > div {
|
||||
height: 0;
|
||||
border: 1px solid var(--outline-variant);
|
||||
margin: 0 1rem;
|
||||
}
|
||||
&> h2 {
|
||||
font-size: 2.25rem;
|
||||
}
|
||||
& > a {
|
||||
padding: 0.5rem 1rem;
|
||||
text-decoration: none;
|
||||
background-color: var(--secondary-container);
|
||||
border-radius: var(--small-border-radius);
|
||||
color: var(--on-secondary-container);
|
||||
|
||||
&[href] {
|
||||
background-color: var(--surface-container-highest);
|
||||
color: var(--on-background);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
& > :last-child {
|
||||
padding-top: 2rem;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 2rem;
|
||||
|
||||
& > .card {
|
||||
& > div:last-child {
|
||||
display: grid;
|
||||
grid-template-columns: auto auto;
|
||||
grid-template-rows: auto auto;
|
||||
|
||||
& > span {
|
||||
color: var(--primary);
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
justify-self: end;
|
||||
}
|
||||
|
||||
& > p {
|
||||
grid-row: 2;
|
||||
grid-column: 1/span 2;
|
||||
text-color: var(--on-surface);
|
||||
font-size: 0.875em;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
181
wyroby.html
|
|
@ -15,7 +15,7 @@
|
|||
<img alt="logo" src="scraped/pobrane-1.png" style="width: 14rem"/>
|
||||
<div>
|
||||
<a href="index.html">Strona Główna</a>
|
||||
<a href="wyroby.html">Wyroby</a>
|
||||
<a>Wyroby</a>
|
||||
<a href="portfolio.html">Portfolio</a>
|
||||
<a href="kawiarnia.html">Kawiarnia</a>
|
||||
</div>
|
||||
|
|
@ -23,38 +23,167 @@
|
|||
</div>
|
||||
</nav>
|
||||
<main>
|
||||
<section class="wyroby">
|
||||
<h1>Nasze słodkości</h1>
|
||||
<p>Poznaj nasze tradycyjne receptury przekute w nowoczesne formy. Każdy wypiek to jistoria pasji, a kade lody to powiew naturalnej świeżości</p>
|
||||
<div>
|
||||
<h2>Ciasta</h2>
|
||||
<div/>
|
||||
<a href="wyroby.html">Ciasta</a>
|
||||
<section class="wyroby">
|
||||
<header>
|
||||
<h1>Nasze słodkości</h1>
|
||||
<p>Poznaj nasze tradycyjne receptury przekute w nowoczesne formy. Każdy wypiek to historia pasji, a każde lody to
|
||||
powiew naturalnej świeżości</p>
|
||||
</header>
|
||||
<div>
|
||||
<h2>Ciasta</h2>
|
||||
<div></div>
|
||||
<a>Ciasta</a>
|
||||
<a href="wyroby_torty.html">Torty</a>
|
||||
<a href="wyroby_slodkie_stoly.html">Slodkie stoły</a>
|
||||
<a href="wyroby_lody.html">Lody</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="tort" src="images/004.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Malinowa chmurka" src="images/wyroby/001.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Malinowa chmurka</h3>
|
||||
<span>150zł</span>
|
||||
<p>kruchy spód, warstwa malin w galaretce, krem śmietankowy, beza</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Torty Okazjonalne</h3>
|
||||
<p>Weselne, urodzinowe i te bez okazji – od klasyki po nowoczesne musy.</p>
|
||||
<a>Przeglądaj Torty
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
|
||||
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round" class="lucide lucide-arrow-right-icon lucide-arrow-right">
|
||||
<path d="M5 12h14"/>
|
||||
<path d="m12 5 7 7-7 7"/>
|
||||
</svg>
|
||||
</a>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Sernik ulubiony" src="images/wyroby/002.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Sernik ulubiony</h3>
|
||||
<span>150zł</span>
|
||||
<p>kruchy spód, aksamitna masa serowa, beza z kruszonką</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Sernik klasyczny" src="images/wyroby/003.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Sernik klasyczny</h3>
|
||||
<span>150zł</span>
|
||||
<p>wykończony czekoladowym ganache lub oprószony cukrem pudrem</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Jabłecznik z kruszonką" src="images/wyroby/004.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Jabłecznik z kruszonką</h3>
|
||||
<span>130zł</span>
|
||||
<p>ciasto ucierane, jabłka, kruszonka</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Sernik królewski" src="images/wyroby/005.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Sernik królewski</h3>
|
||||
<span>150zł</span>
|
||||
<p>kakaowy spód i kruszonka, wilgotna masa serowa</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Pleśniak" src="images/wyroby/006.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Pleśniak</h3>
|
||||
<span>120zł</span>
|
||||
<p>kruche ciasto waniliowe, powidła owocowe, kruche ciasto kakaowe, beza i kruszonka</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Leśny mech z musem truskawkowym" src="images/wyroby/007.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Leśny mech z musem truskawkowym</h3>
|
||||
<span>110zł</span>
|
||||
<p>biszkoptowe ciasto z dodatkiem szpinaku, mus truskawkowy</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Snickers" src="images/wyroby/008.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Snickers</h3>
|
||||
<span>150zł</span>
|
||||
<p>dwie warstwy kakaowego biszkoptu a pomiędzy bezowy blat orzechowy , krem budyniowy , toffi i
|
||||
orzeszki ziemne</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Mleczna kanapka" src="images/wyroby/009.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Mleczna kanapka</h3>
|
||||
<span>120zł</span>
|
||||
<p>dwa blaty czekoladowego ciasta, a pomiędzy krem waniliowy z dodatkiem cienkiej warstwy
|
||||
czekoladowej</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="3Bit" src="images/wyroby/010.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>3Bit</h3>
|
||||
<span>120zł</span>
|
||||
<p>herbatniki, krem budyniowy, toffi i śmietana</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Biszkoptowe z kremem i owocami w galaretce" src="images/wyroby/011.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Biszkoptowe z kremem i owocami w galaretce</h3>
|
||||
<span>120zł</span>
|
||||
<p>biszkopt, krem budyniowy, owoce</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Kora orzechowa" src="images/wyroby/012.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Kora orzechowa</h3>
|
||||
<span>150zł</span>
|
||||
<p>dwa blaty bezy orzechowej a pomiędzy krem budyniowy na bazie soku z brzoskwiń, delicje
|
||||
pomarańczowe, owoce brzoskwiń i galaretka</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Nutelowiec z wiśniami" src="images/wyroby/013.jpg"/>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Nutelowiec z wiśniami</h3>
|
||||
<span>120zł</span>
|
||||
<p>nutelowy spód , krem śmietankowy z dodatkiem twarożku, wiśnie i galaretka</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div>
|
||||
<img alt="Karpatka" src="images/wyroby/014.jpg">
|
||||
</div>
|
||||
<div>
|
||||
<h3>Karpatka</h3>
|
||||
<span>120zł</span>
|
||||
<p></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
</main>
|
||||
<footer>
|
||||
<div>
|
||||
|
|
|
|||