보안설정 수정, 모바일 최적화 변경
This commit is contained in:
@@ -170,4 +170,30 @@ const formatDate = (date) => {
|
||||
:deep(.p-datatable-wrapper) {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.activity-log-container, .header, .dashboard-card, .subscription-management-container, .user-management-container, .club-management {
|
||||
padding: 0.5rem !important;
|
||||
margin-bottom: 0.5rem !important;
|
||||
}
|
||||
.dashboard-card {
|
||||
padding: 0.7rem !important;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
.header h2, .dashboard-card h3 {
|
||||
font-size: 1.1rem !important;
|
||||
}
|
||||
.p-datatable-wrapper {
|
||||
overflow-x: auto !important;
|
||||
}
|
||||
/* Dialog 팝업 중앙 정렬 개선 */
|
||||
:deep(.p-dialog) {
|
||||
align-items: flex-start !important;
|
||||
justify-content: center !important;
|
||||
padding-top: 2.5rem !important;
|
||||
}
|
||||
:deep(.p-dialog .p-dialog-content) {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -725,4 +725,35 @@ const saveMember = async () => {
|
||||
color: #666;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.club-management, .header, .dashboard-card, .activity-log-container, .subscription-management-container, .user-management-container {
|
||||
padding: 0.5rem !important;
|
||||
margin-bottom: 0.5rem !important;
|
||||
}
|
||||
.dashboard-card {
|
||||
padding: 0.7rem !important;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
.header h2, .dashboard-card h3 {
|
||||
font-size: 1.1rem !important;
|
||||
}
|
||||
.features-grid, .plan-details {
|
||||
grid-template-columns: 1fr !important;
|
||||
flex-direction: column !important;
|
||||
gap: 0.7rem !important;
|
||||
}
|
||||
.p-datatable-wrapper {
|
||||
overflow-x: auto !important;
|
||||
}
|
||||
/* Dialog 팝업 중앙 정렬 개선 */
|
||||
:deep(.p-dialog) {
|
||||
align-items: flex-start !important;
|
||||
justify-content: center !important;
|
||||
padding-top: 2.5rem !important;
|
||||
}
|
||||
:deep(.p-dialog .p-dialog-content) {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -303,4 +303,30 @@ const navigateTo = (path) => {
|
||||
:deep(.p-datatable .p-datatable-tbody > tr) {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.admin-dashboard, .header, .dashboard-card, .activity-log-container, .subscription-management-container, .user-management-container, .club-management {
|
||||
padding: 0.5rem !important;
|
||||
margin-bottom: 0.5rem !important;
|
||||
}
|
||||
.dashboard-card {
|
||||
padding: 0.7rem !important;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
.header h2, .dashboard-card h3 {
|
||||
font-size: 1.1rem !important;
|
||||
}
|
||||
.p-datatable-wrapper {
|
||||
overflow-x: auto !important;
|
||||
}
|
||||
/* Dialog 팝업 중앙 정렬 개선 */
|
||||
:deep(.p-dialog) {
|
||||
align-items: flex-start !important;
|
||||
justify-content: center !important;
|
||||
padding-top: 2.5rem !important;
|
||||
}
|
||||
:deep(.p-dialog .p-dialog-content) {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -16,10 +16,9 @@
|
||||
dataKey="id"
|
||||
@row-expand="onPlanExpand"
|
||||
>
|
||||
<Column :expander="true" style="width: 3%"/>
|
||||
<Column :expander="true" style="width: 1%"/>
|
||||
<Column field="id" header="ID" sortable style="width: 5%"></Column>
|
||||
<Column field="name" header="플랜명" sortable style="width: 15%"></Column>
|
||||
<Column field="description" header="설명" style="width: 25%"></Column>
|
||||
<Column field="name" header="플랜명" sortable></Column>
|
||||
<Column field="maxMembers" header="최대 회원수" sortable style="width: 10%">
|
||||
<template #body="slotProps">
|
||||
{{ slotProps.data.maxMembers }}명
|
||||
@@ -30,7 +29,7 @@
|
||||
{{ formatCurrency(slotProps.data.price) }}
|
||||
</template>
|
||||
</Column>
|
||||
<Column field="status" header="상태" sortable style="width: 10%">
|
||||
<Column field="status" header="상태" sortable style="width: 15%">
|
||||
<template #body="slotProps">
|
||||
<Badge :value="getStatusLabel(slotProps.data.status)" :severity="getStatusSeverity(slotProps.data.status)" />
|
||||
</template>
|
||||
@@ -45,6 +44,10 @@
|
||||
</Column>
|
||||
<template #expansion="slotProps">
|
||||
<div class="plan-details">
|
||||
<div class="plan-description">
|
||||
<h4>설명</h4>
|
||||
<p>{{ slotProps.data.description }}</p>
|
||||
</div>
|
||||
<div class="plan-features">
|
||||
<h4>포함된 기능</h4>
|
||||
<div class="features-grid">
|
||||
@@ -603,4 +606,35 @@ const formatDate = (date) => {
|
||||
font-size: 0.8rem;
|
||||
padding: 0.3rem 0.5rem;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.subscription-management-container, .header, .dashboard-card, .activity-log-container, .user-management-container, .club-management {
|
||||
padding: 0.5rem !important;
|
||||
margin-bottom: 0.5rem !important;
|
||||
}
|
||||
.dashboard-card {
|
||||
padding: 0.7rem !important;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
.header h2, .dashboard-card h3 {
|
||||
font-size: 1.1rem !important;
|
||||
}
|
||||
.features-grid, .plan-details {
|
||||
grid-template-columns: 1fr !important;
|
||||
flex-direction: column !important;
|
||||
gap: 0.7rem !important;
|
||||
}
|
||||
.p-datatable-wrapper {
|
||||
overflow-x: auto !important;
|
||||
}
|
||||
/* Dialog 팝업 중앙 정렬 개선 */
|
||||
:deep(.p-dialog) {
|
||||
align-items: flex-start !important;
|
||||
justify-content: center !important;
|
||||
padding-top: 2.5rem !important;
|
||||
}
|
||||
:deep(.p-dialog .p-dialog-content) {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -294,4 +294,30 @@ const formatDate = (date) => {
|
||||
:deep(.p-password-input) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.user-management-container, .header, .dashboard-card, .activity-log-container, .subscription-management-container, .club-management {
|
||||
padding: 0.5rem !important;
|
||||
margin-bottom: 0.5rem !important;
|
||||
}
|
||||
.dashboard-card {
|
||||
padding: 0.7rem !important;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
.header h2, .dashboard-card h3 {
|
||||
font-size: 1.1rem !important;
|
||||
}
|
||||
.p-datatable-wrapper {
|
||||
overflow-x: auto !important;
|
||||
}
|
||||
/* Dialog 팝업 중앙 정렬 개선 */
|
||||
:deep(.p-dialog) {
|
||||
align-items: flex-start !important;
|
||||
justify-content: center !important;
|
||||
padding-top: 2.5rem !important;
|
||||
}
|
||||
:deep(.p-dialog .p-dialog-content) {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user