studio-variable/index-shop
3
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

thanks : style
All checks were successful
Deploy / Deploy to Production (push) Successful in 10s
Details

Browse source
This commit is contained in:
isUnknown 2025-12-22 10:07:03 +01:00
parent 57037fc435
commit 010c4f6c20
12 changed files with 95 additions and 69 deletions
Download patch file Download diff file Expand all files Collapse all files

2
assets/css/components/_text.scss
View file

@ -1,7 +1,7 @@
[data-template="subscription-newsletter"],
[data-template="thanks"],
[data-template="support"],
[data-template="store"] {
[data-template="home"] {
.p__baseline-big {
font-family: var(--title);
font-size: var(--fs-big);

74
assets/css/style.css
View file

@ -399,7 +399,7 @@ main {
[data-template=subscription-newsletter] .p__baseline-big,
[data-template=thanks] .p__baseline-big,
[data-template=support] .p__baseline-big,
[data-template=store] .p__baseline-big {
[data-template=home] .p__baseline-big {
font-family: var(--title);
font-size: var(--fs-big);
font-weight: var(--fw-bold);
@ -410,14 +410,14 @@ main {
[data-template=subscription-newsletter] .p__baseline-big strong,
[data-template=thanks] .p__baseline-big strong,
[data-template=support] .p__baseline-big strong,
[data-template=store] .p__baseline-big strong {
[data-template=home] .p__baseline-big strong {
font-weight: var(--fw-bolf);
color: var(--color-accent);
}
[data-template=subscription-newsletter] .p__baseline-big .link-don,
[data-template=thanks] .p__baseline-big .link-don,
[data-template=support] .p__baseline-big .link-don,
[data-template=store] .p__baseline-big .link-don {
[data-template=home] .p__baseline-big .link-don {
display: block;
color: var(--color-accent);
text-decoration: none;
@ -425,7 +425,7 @@ main {
[data-template=subscription-newsletter] .p__baseline-big .link-don:hover,
[data-template=thanks] .p__baseline-big .link-don:hover,
[data-template=support] .p__baseline-big .link-don:hover,
[data-template=store] .p__baseline-big .link-don:hover {
[data-template=home] .p__baseline-big .link-don:hover {
-webkit-text-decoration: underline 2px;
text-decoration: underline 2px;
text-underline-offset: 4px;
@ -433,7 +433,7 @@ main {
[data-template=subscription-newsletter] .p__baseline,
[data-template=thanks] .p__baseline,
[data-template=support] .p__baseline,
[data-template=store] .p__baseline {
[data-template=home] .p__baseline {
font-size: var(--fs-medium);
font-weight: var(--fw-medium);
line-height: 1.1;
@ -444,7 +444,7 @@ main {
[data-template=subscription-newsletter] .p__baseline,
[data-template=thanks] .p__baseline,
[data-template=support] .p__baseline,
[data-template=store] .p__baseline {
[data-template=home] .p__baseline {
text-align: center;
margin: var(--spacing) 0;
}
@ -452,7 +452,7 @@ main {
[data-template=subscription-newsletter] .p__details,
[data-template=thanks] .p__details,
[data-template=support] .p__details,
[data-template=store] .p__details {
[data-template=home] .p__details {
font-size: var(--fs-small);
margin-bottom: 0.5em;
color: var(--grey-400);
@ -460,7 +460,7 @@ main {
[data-template=subscription-newsletter] .section__heading,
[data-template=thanks] .section__heading,
[data-template=support] .section__heading,
[data-template=store] .section__heading {
[data-template=home] .section__heading {
font-size: var(--fs-normal);
font-weight: var(--fw-medium);
line-height: 1;
@ -474,8 +474,8 @@ main {
[data-template=thanks] ol,
[data-template=support] ul,
[data-template=support] ol,
[data-template=store] ul,
[data-template=store] ol {
[data-template=home] ul,
[data-template=home] ol {
margin-left: 3ch;
margin-bottom: 0.5em;
}
@ -1016,39 +1016,39 @@ body.is-fullscreen {
overflow: hidden;
}
[data-template=store] main {
[data-template=home] main {
margin-bottom: calc(var(--spacing) * 2);
}
[data-template=store] .p__baseline-big {
[data-template=home] .p__baseline-big {
margin-top: calc(var(--spacing) * 2);
}
[data-template=store] #store__container {
[data-template=home] #store__container {
margin-top: calc(var(--spacing) * 2);
margin-bottom: calc(var(--spacing) * 4);
width: 100%;
max-width: 1000px;
}
[data-template=store] #store__container .store__product {
[data-template=home] #store__container .store__product {
position: relative;
}
[data-template=store] #store__container .store__product figure {
[data-template=home] #store__container .store__product figure {
aspect-ratio: 4/3;
background-color: var(--color-bg);
background-color: var(--data-bg);
margin-bottom: calc(var(--spacing) * 0.5);
overflow: hidden;
}
[data-template=store] #store__container .store__product img {
[data-template=home] #store__container .store__product img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
transition: var(--curve) 0.5s;
}
[data-template=store] #store__container .store__product a {
[data-template=home] #store__container .store__product a {
text-decoration: none;
}
[data-template=store] #store__container .store__product .link-block {
[data-template=home] #store__container .store__product .link-block {
display: block;
height: 100%;
width: 100%;
@ -1057,23 +1057,23 @@ body.is-fullscreen {
left: 0;
cursor: pointer;
}
[data-template=store] #store__container .store__product:hover figure {
[data-template=home] #store__container .store__product:hover figure {
overflow: hidden;
}
[data-template=store] #store__container .store__product:hover img {
[data-template=home] #store__container .store__product:hover img {
transform: scale(1.05);
}
[data-template=store] #store__container .store__product:hover .line-1 {
[data-template=home] #store__container .store__product:hover .line-1 {
text-decoration: underline;
}
@media screen and (max-width: 720px) {
[data-template=store] #store__container .store__product {
[data-template=home] #store__container .store__product {
margin-top: calc(var(--spacing) * 1.5);
margin-bottom: calc(var(--spacing) * 0.5);
}
}
@media screen and (min-width: 720px) {
[data-template=store] #store__container {
[data-template=home] #store__container {
display: grid;
grid-template-columns: repeat(6, 1fr);
-moz-column-gap: calc(var(--padding-body) * 0.75);
@ -1082,11 +1082,11 @@ body.is-fullscreen {
margin-left: auto;
margin-right: auto;
}
[data-template=store] #store__container .store__product {
[data-template=home] #store__container .store__product {
grid-column: span 2;
}
[data-template=store] #store__container .store__product:nth-of-type(1),
[data-template=store] #store__container .store__product:nth-of-type(2) {
[data-template=home] #store__container .store__product:nth-of-type(1),
[data-template=home] #store__container .store__product:nth-of-type(2) {
grid-column: span 3;
}
}
@ -1244,24 +1244,26 @@ body.is-fullscreen {
justify-content: center;
padding: calc(var(--spacing) * 4) var(--spacing);
}
[data-template=thanks] .thanks-content {
[data-template=thanks] .thanks-page .thanks-content {
text-align: center;
max-width: 600px;
display: flex;
flex-direction: column;
align-items: center;
}
[data-template=thanks] .thanks-content h1 {
font-size: var(--fs-x-big);
[data-template=thanks] .thanks-page .thanks-content h1 {
margin-bottom: calc(var(--spacing) * 2);
}
[data-template=thanks] .thanks-content .thanks-message {
font-size: var(--fs-big);
margin-bottom: calc(var(--spacing) * 3);
line-height: 1.6;
[data-template=thanks] .thanks-page .thanks-content .thanks-message {
font-size: var(--fs-medium);
line-height: 1.1;
}
[data-template=thanks] .thanks-content .thanks-message p {
[data-template=thanks] .thanks-page .thanks-content .thanks-message p {
margin-bottom: var(--spacing);
}
[data-template=thanks] .thanks-content .thanks-actions {
margin-top: calc(var(--spacing) * 3);
[data-template=thanks] .thanks-page .thanks-content .thanks-actions {
width: -moz-max-content;
width: max-content;
}
[data-template=thanks] #site-footer {
border-top: none;

2
assets/css/style.css.map
View file

File diff suppressed because one or more lines are too long

2
assets/css/template/shop/_layout.scss
View file

@ -1,4 +1,4 @@
[data-template="store"] {
[data-template="home"] {
main {
margin-bottom: calc(var(--spacing) * 2);
}

39
assets/css/template/shop/_thanks.scss
View file

@ -5,29 +5,30 @@
align-items: center;
justify-content: center;
padding: calc(var(--spacing) * 4) var(--spacing);
}
.thanks-content {
text-align: center;
max-width: 600px;
.thanks-content {
text-align: center;
max-width: 600px;
display: flex;
flex-direction: column;
align-items: center;
h1 {
font-size: var(--fs-x-big);
margin-bottom: calc(var(--spacing) * 2);
}
.thanks-message {
font-size: var(--fs-big);
margin-bottom: calc(var(--spacing) * 3);
line-height: 1.6;
p {
margin-bottom: var(--spacing);
h1 {
margin-bottom: calc(var(--spacing) * 2);
}
}
.thanks-actions {
margin-top: calc(var(--spacing) * 3);
.thanks-message {
font-size: var(--fs-medium);
line-height: 1.1;
p {
margin-bottom: var(--spacing);
}
}
.thanks-actions {
width: max-content;
}
}
}