모바일 호환

This commit is contained in:
2025-06-03 17:17:44 +09:00
parent 8e55266031
commit 9dd8cb83f7
4 changed files with 36 additions and 0 deletions

View File

@@ -175,11 +175,17 @@ onUnmounted(() => {
.modal-content {
width: 100%;
max-width: 100% !important;
min-height: 95% !important;
.modal-card {
width: 100%;
min-height: 95% !important;
.modal-card-body {
padding: 0px !important;
.form-fieldset {
max-width: 100%;
padding: 0;
}
}
}
}

View File

@@ -22,6 +22,7 @@ const { activeMobileSubsidebarId, toggleMobileSubnav } = useNavbarLayoutContext(
<VIcon
:icon="props.link.icon"
/>
<span v-if="props.link.label">{{ props.link.label }}</span>
</a>
<a
v-if="props.link.type === 'megamenu'"
@@ -34,6 +35,7 @@ const { activeMobileSubsidebarId, toggleMobileSubnav } = useNavbarLayoutContext(
<VIcon
:icon="props.link.icon"
/>
<span v-if="props.link.label">{{ props.link.label }}</span>
</a>
<a
v-else-if="props.link.type === 'action'"
@@ -45,6 +47,7 @@ const { activeMobileSubsidebarId, toggleMobileSubnav } = useNavbarLayoutContext(
<VIcon
:icon="props.link.icon"
/>
<span v-if="props.link.label">{{ props.link.label }}</span>
</a>
<VLink
v-else-if="props.link.type === 'link'"
@@ -53,6 +56,20 @@ const { activeMobileSubsidebarId, toggleMobileSubnav } = useNavbarLayoutContext(
<VIcon
:icon="props.link.icon"
/>
<span v-if="props.link.label">{{ props.link.label }}</span>
</VLink>
</li>
</template>
<style lang="scss" scoped>
li {
width:120px !important;
span {
color: var(--modal-text) !important;
padding-left: 10px;
}
.iconify {
transform: translateY(5px);
}
}
</style>

View File

@@ -247,4 +247,7 @@ watch(() => Boolean(activeSubnav.value?.type === 'megamenu' || isMobileSidebarOp
<style lang="scss">
@import '/@src/scss/abstracts/all';
@import '/@src/scss/layout/navbar';
.mobile-main-sidebar {
width: 120px;
}
</style>

View File

@@ -399,6 +399,16 @@ function onRePassword() {
<style lang="scss">
@media (width <= 767px) {
.profile-dropdown {
.v-avatar {
min-width: 35px;
max-width: 35px;
.avatar {
min-width: 30px !important;
}
}
}
.avatar {
width:30px !important;
height:30px !important;