midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

More design tweaking

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-08-29 16:19:08 +02:00
parent c097c73bec
commit 0b2ce63284
2 changed files with 211 additions and 197 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
src/UI/BigComponents/MenuDrawer.svelte
View file

@ -46,6 +46,8 @@
import Marker from "../Map/Marker.svelte"
import LogoutButton from "../Base/LogoutButton.svelte"
import { LanguageIcon } from "@babeard/svelte-heroicons/solid"
import { BoltIcon } from "@babeard/svelte-heroicons/mini"
import Copyright from "../../assets/svg/Copyright.svelte"
export let state: ThemeViewState
let userdetails = state.osmConnection.userDetails
@ -60,7 +62,6 @@
</script>
<Sidebar asideClass="max-w-screen p-0 low-interaction p-6 link-underline">
<h2>Menu</h2>
<div class="flex flex-col">
<!-- User related: avatar, settings, favourits, logout -->
@ -133,8 +134,9 @@
</div>
</LoginToggle>
<div style="width: 90%">
<LanguagePicker />
</div>
</div>
@ -247,10 +249,16 @@
{/if}
<div class="hidden-on-mobile">
<Page {onlyLink} shown={pg.hotkeys}>
<Tr t={ Translations.t.hotkeyDocumentation.title} slot="header" />
<div class="flex" slot="header">
<BoltIcon class="w-6 h-6" />
<Tr t={ Translations.t.hotkeyDocumentation.title} />
</div>
<HotkeyTable />
</Page>
</div>
<a class="flex" href="https://github.com/pietervdvn/MapComplete/" target="_blank">
<Github class="h-6 w-6" />
@ -275,13 +283,17 @@
<Page {onlyLink} shown={pg.copyright}>
<Tr slot="header" t={Translations.t.general.attribution.attributionTitle} />
<div slot="header" class="flex">
<Copyright class="w-8 h-8" />
<Tr t={Translations.t.general.attribution.attributionTitle} />
</div>
<CopyrightPanel {state} />
</Page>
<Page {onlyLink} shown={pg.copyright_icons}>
<div slot="header">
<div slot="header" class="flex">
<Copyright class="w-8 h-8" />
<Tr t={ Translations.t.general.attribution.iconAttribution.title} />
</div>
<CopyrightAllIcons {state} />
@ -319,10 +331,12 @@
padding: 1rem;
border-radius: 0.5rem;
}
:global(.sidebar-unit > h3) {
margin-top: 0;
margin-bottom: 0.5rem
}
:global(.sidebar-unit svg) {
width: 1.5rem;
height: 1.5rem;

6
src/UI/ThemeViewGUI.svelte
View file

@ -190,7 +190,7 @@
<!-- Top components -->
<div
class="flex bg-black-light-transparent pointer-events-auto items-center justify-between px-4 py-2 flex-wrap-reverse">
class="flex bg-black-light-transparent pointer-events-auto items-center justify-between px-4 py-1 flex-wrap-reverse">
<!-- Top bar with tools -->
<div class="flex items-center">
@ -200,7 +200,7 @@
on:click={() => {console.log("Opening...."); state.guistate.menuIsOpened.setData(true)}}
on:keydown={forwardEventToMap}
>
<MenuIcon class="h-8 w-8 cursor-pointer" />
<MenuIcon class="h-6 w-6 cursor-pointer" />
</MapControlButton>
<MapControlButton
@ -210,7 +210,7 @@
<div
class="m-0.5 mx-1 flex cursor-pointer items-center max-[480px]:w-full sm:mx-1 mr-2"
>
<Marker icons={layout.icon} size="h-6 w-6 shrink-0 md:h-8 md:w-8 mr-0.5 sm:mr-1 md:mr-2" />
<Marker icons={layout.icon} size="h-6 w-6 shrink-0 mr-0.5 sm:mr-1 md:mr-2" />
<b class="mr-1">
<Tr t={layout.title} />
</b>