ambiser
/
openvidu
mirror of https://github.com/OpenVidu/openvidu.git
9
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

ov-components: enhance mobile responsiveness for panel and session components

master
Carlos Santos 2025-09-22 21:17:11 +02:00
parent 0407725437
commit faaac23c66
2 changed files with 21 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/panel.component.scss
View File

@ -9,6 +9,16 @@
align-items: stretch; align-items: stretch;
} }
// Mobile responsiveness - ensure panels occupy full width on mobile devices
@media only screen and (max-width: 768px) {
.panel-container {
margin: 8px;
max-height: calc(100% - 16px);
min-height: calc(100% - 16px);
border-radius: 8px;
}
}
.panel-header-container { .panel-header-container {
padding: 10px; padding: 10px;
flex: inherit; flex: inherit;

12
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/session/session.component.scss
View File

@ -90,11 +90,21 @@
position: absolute; position: absolute;
} }
@media only screen and (max-width: 600px) { @media only screen and (max-width: 768px) {
#session-container { #session-container {
width: 100%; width: 100%;
/* position: fixed; */ /* position: fixed; */
} }
.sidenav-menu {
width: 100% !important;
max-width: 100% !important;
}
.big {
width: 100% !important;
max-width: 100% !important;
}
} }
::ng-deep .mat-button-toggle-appearance-standard .mat-button-toggle-label-content { ::ng-deep .mat-button-toggle-appearance-standard .mat-button-toggle-label-content {