Amin/XRoomDashboardFront
1
0
Fork 0
mirror of https://github.com/Dadechin/XRoomDashboardFront.git synced 2025-07-02 00:04:35 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix some styles

Browse Source
This commit is contained in:
Diyar Akhgar 2025-06-12 17:10:33 +03:30
parent e62892a0b4
commit 13d05d6473
3 changed files with 126 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

110
xroom-dashboard/src/components/TeamUser.vue
View File

@ -339,7 +339,7 @@ export default {
this.$emit('change-tab', 'buy-subscription');
},
handleResize() {
this.isMobile = window.innerWidth <= 1024;
this.isMobile = window.innerWidth <= 1280;
},
},
mounted() {
@ -726,8 +726,112 @@ export default {
}
}
/* Desktop Styles (min-width: 1024px) */
@media (min-width: 1025px) {
/* LapTop Styles (min-width: 1025px and max-width: 1280px) */
@media (min-width: 1025px) and (max-width: 1280px) {
.swiper-add-user {
display : block;
}
.user-card {
width: 100%;
height: auto;
}
.add-card {
width: 100%;
height: 100px;
display: flex;
}
.license-card {
flex-direction: row;
align-items: flex-start;
gap: 10px;
}
.user-info-box {
flex-direction: column;
align-items: flex-end;
}
.user-activity {
padding-left: 0;
}
.user-avatar {
margin-top: 0;
width: 50px;
height: 80px;
object-fit: cover;
}
.user-name {
font-size: 14px;
font-size: 16px;
font-weight: 700;
color: #101010;
white-space: nowrap;
text-overflow: ellipsis;
overflow-x: clip;
width: 90px;
}
.user-email {
font-size: 12px;
}
.user-role {
font-size: 15px;
}
.user-footer span {
font-size: 14px;
font-weight: 500;
}
.user-info-tags, .user-activity {
gap: 1rem;
}
.user-actions svg {
width: 18px !important;
height: 18px !important;
}
.user-version , .user-role{
font-size: 14px;
font-weight: 500;
text-overflow: ellipsis;
overflow-x: clip;
white-space: nowrap;
width: 80px;
}
.license-card span {
font-size: 14px;
}
.buy-subscription {
font-size : 14px;
gap : 6px;
}
.buy-subscription svg {
height: 18px;
width: 18px;
}
.add-text {
font-size: 18px;
}
}
/* Desktop Styles (min-width: 1280px) */
@media (min-width: 1280px) {
.user-cards-grid {
display: flex;
flex-wrap: wrap;

30
xroom-dashboard/src/pages/dashboard/Meeting.vue
View File

@ -69,8 +69,8 @@
</span>
<div v-else class="meetings-list">
<div v-for="meeting in filteredMeetings" :key="meeting.id" class="meeting-item">
<img :src="meeting.image" alt="Meeting Image" class="meeting-image" width="120" height="120" />
<div class="meeting-details" style="width:100%;margin-right: 10px;">
<img :src="meeting.image" alt="Meeting Image" class="meeting-image" width="48%" height="120" />
<div class="meeting-details" style="width : 48%;">
<h3 class="meet-title">{{ meeting.title }}</h3>
<p class="meet-capacity">
<span style="margin-left: 4px;">
@ -131,7 +131,7 @@
:key="filteredMeetings.length + activeFilter + JSON.stringify(filteredMeetings)"
:slides-per-view="1.4"
:space-between="10"
:loop="true"
:freeMode="true"
:pagination="{ clickable: true }"
:breakpoints="{
768: { slidesPerView: 3.3, spaceBetween: 15 },
@ -142,8 +142,8 @@
class="swiper-meetings-list"
>
<swiper-slide v-for="meeting in filteredMeetings" :key="meeting.id" class="swiper-meeting-item">
<img :src="meeting.image" alt="Meeting Image" class="meeting-image" width="120" height="120" />
<div class="meeting-details" style="width:100%;margin-right: 10px;">
<img :src="meeting.image" alt="Meeting Image" class="meeting-image" width="48%" height="120" />
<div class="meeting-details" style="width: 48%;padding-left: 4px;">
<h3 class="meet-title">{{ meeting.title }}</h3>
<p class="meet-capacity">
<span style="margin-left: 4px;">
@ -230,7 +230,7 @@ import CreateMeetingModal from '@/components/CreateMeetingModal.vue';
import MeetingInfoModal from '@/components/MeetingInfoModal.vue';
import { Swiper, SwiperSlide } from 'swiper/vue';
import 'swiper/css';
import { Pagination } from 'swiper/modules';
import { FreeMode, Pagination } from 'swiper/modules';
import axios from 'axios';
const API_BASE_URL = 'http://my.xroomapp.com:8000';
@ -250,7 +250,7 @@ export default {
showModal: false,
showInfoModal: false,
selectedMeeting: null,
modules: [Pagination],
modules: [FreeMode, Pagination],
meetings: [],
filteredMeetings: [],
};
@ -566,6 +566,7 @@ export default {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
border: 1px solid #b8c0cb;
border-radius: 12px;
text-align: right;
@ -708,6 +709,7 @@ export default {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
border: 1px solid #b8c0cb;
border-radius: 12px;
padding: 4px;
@ -944,11 +946,11 @@ export default {
.meet-title{
width: 150px !important;
width: 115px !important;
}
.meet-type span {
width : 120px !important;
width : 75px !important;
}
.info-button {
@ -970,6 +972,7 @@ export default {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
border: 1px solid #b8c0cb;
border-radius: 12px;
padding: 4px;
@ -998,6 +1001,8 @@ export default {
}
.search-section {
display: flex;
flex-direction: column;
max-width: 85%;
width: 100%;
margin-left: 1.5rem;
@ -1043,16 +1048,13 @@ export default {
}
.meeting-item {
padding: 8px;
padding: 4px;
}
.meeting-details {
width: 60% !important;
}
.meet-title {
font-size: 17px;
width : 200px;
width : 140px;
}
.meet-capacity,

6
xroom-dashboard/src/pages/dashboard/files.vue
View File

@ -678,7 +678,7 @@ export default {
height: 22px;
}
@media (max-width: 1023px) {
@media (min-width: 1024px) and (max-width: 1280px) {
.swiper-file-section {
display: flex;
flex-direction: column;
@ -724,7 +724,7 @@ export default {
}
}
@media (min-width: 1024px) {
/* @media (min-width: 1024px) {
.file-manager-layout {
flex-direction: row;
}
@ -785,7 +785,7 @@ export default {
.filter-btn {
font-size: 1.125rem;
}
}
} */
@media (min-width: 1280px) {
.section-title {