Lichtwerkstatt / XRTL_SPA

Single Page Application for XRTL Remote Lab
https://xrtl.uni-jena.de/
GNU Affero General Public License v3.0
2 stars 3 forks source link

Scaling of control windows #142

Open FalkoFuroro opened 6 months ago

FalkoFuroro commented 6 months ago

The CSS and js files of the components (folder UI, windows,...) still contain scaling conditions that should be deleted for the "normal" experiments and standardized for the others (showcase).

E.g:

const CamWindow = () => {
    var width = window.innerWidth
    var height = 0;

    if (0 < width && width < 576) {
        width = '350'
        height = '260'
    }
    else if (576 < width && width < 768) {
        width = '510'
        height = '340'
    } else {
        width = '600'
        height = '400'
    }

VS

const InfoWindow = () => {
    var width = window.innerWidth
    var height = 0;

    if (0 < width && width < 576) {
        width = '350px'
        height = '650px'
    }
    else {
        width = '600px'
        height = '517px'
    }

VS

@media (min-width:0px) and (max-width:576px) {
    .mobile {
        visibility: visible;
        position: absolute;
        top: 0px;
        right: 5px;
        height: 10px;
    }

    .navMenu {
        visibility: hidden;
    }
}

@media (min-width:577px) and (max-width:768px) {
    .mobile {
        visibility: visible;
        position: absolute;
        top: 0px;
        right: 10px;
        height: 10px;
    }

    .navMenu {
        visibility: hidden;
    }
}

@media (min-width:769px) and (max-width:992px) {
    .mobile {
        visibility: visible;
        position: absolute;
        top: 0px;
        right: 10px;
        height: 10px;
    }

    .navMenu {
        visibility: hidden;
    }
}