piekarnikgosipl/templates/styles/wyroby_torty.css
2026-05-13 23:56:18 +02:00

130 lines
2.6 KiB
CSS

#wyroby-torty > section{
padding: 2rem;
}
#rodzaje-tortow {
display: grid;
grid-template-columns: repeat(4, 1fr);
@media (max-width: 786px) {
grid-template-columns: 1fr;
}
gap: 2rem;
& > div {
}
}
#cennik-tortow {
display: grid;
grid-template-columns: 2fr 1fr;
@media (max-width: 786px) {
grid-template-columns: 1fr;
}
gap: 2rem;
& li {
display: flex;
align-items: center;
justify-content: space-between;
& > span:last-child {
font-weight: bold;
color: var(--primary);
}
&:not(:last-child) {
border-bottom: 1px solid var(--surface-container-highest);
}
}
& > div:first-child {
display: grid;
grid-template-columns: auto 1fr;
grid-template-rows: auto 1fr;
& > h3, & > svg {
padding: 1rem;
}
& > svg {
place-self: center;
font-size: 2rem;
padding-right: 0;
}
& > ul {
grid-column: 1 / -1;
border-radius: var(--small-radius);
border: 1px solid var(--surface-container-highest);
background-color: white;
overflow: hidden;
& > li {
padding: 1rem 2rem;
&:first-child {
background-color: rgb(from var(--secondary-container) r g b / 30%);
font-weight: bold;
& > span:last-child {
color: black;
}
}
}
}
}
& > div:last-child > ul > li {
padding: 0.75rem 0;
}
}
#menu-smakow {
display: grid;
grid-template-columns: repeat(var(--grid-cols), 1fr);
gap: 2rem;
& > header {
grid-column: 1 / -1;
text-align: center;
}
& dl {
color: var(--on-surface);
& > * {
padding: 0.25rem 0;
}
& dt {
font-weight: 700;
}
& dd {
font-size: 0.75rem;
margin: 0;
}
}
}
#torty-musowe {
background-color: var(--surface-container-highest);
border-radius: var(--border-radius);
display: grid;
grid-template-columns: auto auto;
gap: 2rem;
& > div{
display: grid;
grid-template-columns: 1fr 1fr;
gap : 2rem;
}
@media (max-width: 786px) {
grid-template-columns: 1fr;
& > div {
grid-template-columns: 1fr;
}
}
}