Small CSS cleanup

This commit is contained in:
Robin van der Linde 2024-04-24 21:02:00 +02:00
parent 4a19be48b2
commit 716f5fc9e0
Signed by untrusted user who does not match committer: Robin-van-der-Linde
GPG key ID: 53956B3252478F0D
4 changed files with 44 additions and 10 deletions

View file

@ -2420,6 +2420,28 @@ button.small,
color: var(--low-interaction-foreground);
}
.button.theme-button {
margin: 0;
margin-top: 0.25rem;
margin-bottom: 0.25rem;
/* Margin should be removed on larger screens */
@media (min-width: 768px) {
margin: 0;
margin-top: 0;
margin-bottom: 0;
}
/* Experimental support for foldable devices */
@media (horizontal-viewport-segments: 2) {
margin: 0;
margin-top: 0;
margin-bottom: 0;
}
}
button,
.button {
align-items: center;
@ -2440,10 +2462,6 @@ button,
color: var(--low-interaction-foreground);
}
.theme-button {
margin: 0 !important;
}
.button-shadow {
box-shadow: 0 5px 10px #88888888;
}

View file

@ -136,7 +136,7 @@
<UnofficialThemeList search={themeSearchText} {state} />
<div slot="not-logged-in">
<button class="w-full" on:click={() => osmConnection.AttemptLogin()}>
<button class="m-0 my-2 w-full" on:click={() => osmConnection.AttemptLogin()}>
<Login class="mr-2 h-6 w-6 " />
<Tr t={Translations.t.index.logIn} />
</button>

View file

@ -24,7 +24,7 @@
<section class="w-full">
<slot name="title" />
<div class="theme-list gap-4 md:grid md:grid-flow-row md:grid-cols-2 lg:grid-cols-3">
<div class="theme-list my-2 gap-4 md:grid md:grid-flow-row md:grid-cols-2 lg:grid-cols-3">
{#each filteredThemes as theme (theme.id)}
{#if theme !== undefined && !(hideThemes && theme?.hideFromOverview)}
<!-- TODO: doesn't work if first theme is hidden -->

View file

@ -184,6 +184,26 @@ button.small,
color: var(--low-interaction-foreground);
}
.button.theme-button {
margin: 0;
margin-top: 0.25rem;
margin-bottom: 0.25rem;
/* Margin should be removed on larger screens */
@media (min-width: 768px) {
margin: 0;
margin-top: 0;
margin-bottom: 0;
}
/* Experimental support for foldable devices */
@media (horizontal-viewport-segments: 2) {
margin: 0;
margin-top: 0;
margin-bottom: 0;
}
}
button,
.button {
align-items: center;
@ -204,10 +224,6 @@ button,
color: var(--low-interaction-foreground);
}
.theme-button {
margin: 0 !important;
}
.button-shadow {
box-shadow: 0 5px 10px #88888888;
}