mirror of
https://github.com/shadoll/sLogos.git
synced 2026-02-04 02:53:22 +00:00
Refactor App.svelte layout by enhancing main container styles for improved responsiveness and structure
This commit is contained in:
@@ -245,7 +245,7 @@
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<main class="container">
|
<main class="container app-flex">
|
||||||
<Header
|
<Header
|
||||||
{logos}
|
{logos}
|
||||||
{theme}
|
{theme}
|
||||||
@@ -274,7 +274,7 @@
|
|||||||
{openLogoByAnchor}
|
{openLogoByAnchor}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div class="logos-container">
|
<div class="logos-container main-content">
|
||||||
{#if viewMode === "grid"}
|
{#if viewMode === "grid"}
|
||||||
<Grid
|
<Grid
|
||||||
logos={filteredLogos}
|
logos={filteredLogos}
|
||||||
@@ -317,6 +317,17 @@
|
|||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
.app-flex {
|
||||||
|
min-height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.main-content {
|
||||||
|
flex: 1 0 auto;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
}
|
||||||
.footer-flex {
|
.footer-flex {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
Reference in New Issue
Block a user