anhgelus/now
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(card): better style on large screen

Browse source
This commit is contained in:
Anhgelus Morhtuuzh 2024-12-01 14:08:56 +01:00
parent 1bd6521309
commit 26c50463fc
No known key found for this signature in database
GPG key ID: CAD341EFA92DDDE5
3 changed files with 15 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

12
scss/main.scss
View file

@ -74,6 +74,7 @@ main {
max-height: 75vh; max-height: 75vh;
overflow: auto; overflow: auto;
scrollbar-width: thin; scrollbar-width: thin;
max-width: 800px;
& h1, h2, h3 { & h1, h2, h3 {
margin: 0; margin: 0;
} }
@ -135,7 +136,11 @@ h4 {
align-items: center; align-items: center;
gap: 2rem; gap: 2rem;
margin-bottom: 2rem; margin-bottom: 2rem;
margin-left: calc(33% - 135px);
color: var(--text-color); color: var(--text-color);
@media only screen and (max-width: vars.$bp-large) {
margin-left: 0;
}
@media only screen and (max-width: vars.$bp-little) { @media only screen and (max-width: vars.$bp-little) {
flex-direction: column; flex-direction: column;
} }
@ -145,9 +150,12 @@ h4 {
//width: 100%; //width: 100%;
margin-right: 1rem; margin-right: 1rem;
flex-direction: column; flex-direction: column;
align-items: center; align-items: left;
justify-content: center; justify-content: center;
gap: 0.5rem; gap: 0.5rem;
@media only screen and (max-width: vars.$bp-large) {
align-items: center;
}
@media only screen and (max-width: vars.$bp-little) { @media only screen and (max-width: vars.$bp-little) {
margin-right: 0; margin-right: 0;
text-align: center; text-align: center;
@ -225,4 +233,6 @@ h4 {
.credits-legal { .credits-legal {
width: 70%; width: 70%;
padding: 0 2rem 1rem 2rem;
border-radius: 32px;
} }

3
scss/vars.scss
View file

@ -1,2 +1,3 @@
$bp-large: 1350px;
$bp-mid: 1000px; $bp-mid: 1000px;
$bp-little: 650px; $bp-little: 650px;

4
templates/page/legal.gohtml
View file

@ -1,5 +1,5 @@
{{define "body"}} {{define "body"}}
<div class="credits-legal"> <div class="credits-legal" style="{{ .GetBackground }}">
<h2>Legal information</h2> <h2>Legal information</h2>
<p> <p>
Other legal information are available <a href="{{ .Legal.LegalInformationLink }}" target="_blank">here</a>. Other legal information are available <a href="{{ .Legal.LegalInformationLink }}" target="_blank">here</a>.
@ -16,4 +16,4 @@
<h3>Font credits</h3> <h3>Font credits</h3>
<p>{{ .Legal.FontSource }}</p> <p>{{ .Legal.FontSource }}</p>
</div> </div>
{{end}} {{end}}