Fix main container responsivity
This commit is contained in:
parent
53d52f3a14
commit
b61dfb2de0
@ -7,6 +7,7 @@ const route = useRoute();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="p-3 sm:p-4 md:p-8">
|
||||
<TopBar />
|
||||
<RouterView v-slot="{ Component }">
|
||||
<template v-if="Component">
|
||||
@ -26,4 +27,5 @@ const route = useRoute();
|
||||
</Transition>
|
||||
</template>
|
||||
</RouterView>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -6,7 +6,6 @@
|
||||
#app {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
padding: 2rem;
|
||||
height: fit-content;
|
||||
min-height: 100vh;
|
||||
background: radial-gradient(ellipse at 50% -50%, rgba(49, 46, 129, 1) 60%, rgba(24, 30, 42, 1) 80%);
|
||||
@ -27,5 +26,5 @@ a,
|
||||
}
|
||||
|
||||
.main-container {
|
||||
@apply flex w-full max-w-xs md:max-w-lg flex-col justify-center items-center px-8 py-6 gap-4 rounded-lg border border-gray-500 backdrop-blur-md drop-shadow-lg shadow-lg mt-10;
|
||||
@apply flex w-full md:max-w-lg flex-col justify-center items-center px-4 sm:px-8 py-4 sm:py-6 gap-4 rounded-lg border border-gray-500 backdrop-blur-md drop-shadow-lg shadow-lg mt-10;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user