cpvalente/ontime
1
0
Fork 0
mirror of https://github.com/cpvalente/ontime.git synced 2026-08-13 19:33:46 +00:00
Code Issues Packages Projects Releases 10 Wiki Activity

Fix/155 (#158)

Browse Source 
* fix/155: fix css polution on detached views
* fix/155: test detached routes
This commit is contained in:
Carlos Valente
2022-06-16 14:27:13 +02:00
committed by GitHub
parent 1f001cf188
commit c1de3190e9
3 changed files with 94 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "ontime-ui",
"version": "1.1.2",
"version": "1.1.3",
"private": true,
"dependencies": {
"@chakra-ui/react": "^2.0.0-next.3",
client/src/features/editors/Editor.module.scss
+74 -92
View File
@@ -9,6 +9,12 @@
color: $ontime-pink;
}
h1 {
font-size: max(1.5em, 16px);
color: $bg-gray-100;
padding-bottom: 0.25em;
}
.mainContainer {
background: $bg-black;
width: 100%;
@@ -38,89 +44,6 @@
}
}
/* 2/3 window, hide info */
@media (max-width: 1450px) and (min-height: 700px) {
.mainContainer {
height: 100%;
grid-template-rows: auto 1fr;
grid-template-columns: 40px 48em auto;
/* grid-template-areas:
'even play sett'
'even mess sett'; */
}
.info {
visibility: hidden;
}
}
/* 1/2 window, event list only */
@media (max-width: 1100px) {
.mainContainer {
height: 100%;
grid-template-rows: 1fr auto;
grid-template-columns: 40px 48em;
/* grid-template-areas:
'sett even '
'sett play '; */
}
.info,
.messages,
.playback {
visibility: hidden;
}
}
/* 1/3 window, show control only */
@media (max-width: 850px) and (min-height: 500px) {
.mainContainer {
grid-template-rows: auto 1fr;
grid-template-columns: 100%;
column-gap: 0;
grid-template-areas:
'play'
'mess';
}
.playback,
.messages {
visibility: visible;
}
.editor,
.info,
.settings {
visibility: hidden;
}
}
/* 1/3 corner window, playback only */
@media (max-width: 850px) and (max-height: 500px) {
.mainContainer {
grid-template-rows: 100%;
grid-template-columns: 100%;
grid-template-areas: 'play';
}
.playback {
visibility: visible;
}
.editor,
.messages,
.info,
.settings {
visibility: hidden;
}
}
h1 {
font-size: max(1.5em, 16px);
color: $bg-gray-100;
padding-bottom: 0.25em;
}
.mainContainer > div {
border-radius: 0.5em;
height: 100%;
@@ -184,15 +107,74 @@ h1 {
padding-top: 0.5em;
}
.cornerButtonContainer {
position: relative;
top: -4.5em;
display: flex;
justify-content: flex-end;
/* 2/3 window, hide info */
@media (max-width: 1450px) and (min-width: 1101px) {
.mainContainer {
height: 100%;
grid-template-rows: auto 1fr;
grid-template-columns: 40px 48em auto;
.info {
visibility: hidden;
}
}
}
.buttonContainer {
padding-bottom: 2em;
display: flex;
justify-content: flex-end;
/* 1/2 window, event list only */
@media (max-width: 1100px) and (min-width: 851px){
.mainContainer {
height: 100%;
grid-template-rows: 1fr auto;
grid-template-columns: 40px 48em;
.info,
.messages,
.playback {
visibility: hidden;
}
}
}
/* 1/3 window, show control only */
@media (max-width: 850px) and (min-height: 500px) {
.mainContainer {
grid-template-rows: auto 1fr;
grid-template-columns: 100%;
column-gap: 0;
grid-template-areas:
'play'
'mess';
.playback,
.messages {
visibility: visible;
}
.editor,
.info,
.settings {
visibility: hidden;
}
}
}
/* 1/3 corner window, playback only */
@media (max-width: 850px) and (max-height: 500px) {
.mainContainer {
grid-template-rows: 100%;
grid-template-columns: 100%;
grid-template-areas: 'play';
.playback {
visibility: visible;
}
.editor,
.messages,
.info,
.settings {
visibility: hidden;
}
}
}
server/cypress/integration/navigation.spec.js
+19 -4
View File
@@ -49,13 +49,28 @@ describe('validate routes', () => {
it('self contained editor routes', () => {
cy.visit('http://localhost:4001/eventlist');
cy.contains('Event List');
cy.get('.App').should('contain', 'Event List');
cy.get('.App').should('not.contain', 'Timer Control');
cy.get('.App').should('not.contain', 'Messages Control');
cy.get('.App').should('not.contain', 'Info');
cy.visit('http://localhost:4001/timercontrol');
cy.contains('Timer Control');
cy.get('.App').should('not.contain', 'Event List');
cy.get('.App').should('contain', 'Timer Control');
cy.get('.App').should('not.contain', 'Messages Control');
cy.get('.App').should('not.contain', 'Info');
cy.visit('http://localhost:4001/messagecontrol');
cy.contains('Messages Control');
cy.get('.App').should('not.contain', 'Event List');
cy.get('.App').should('not.contain', 'Timer Control');
cy.get('.App').should('contain', 'Messages Control');
cy.get('.App').should('not.contain', 'Info');
cy.visit('http://localhost:4001/info');
cy.contains('Info');
cy.get('.App').should('not.contain', 'Event List');
cy.get('.App').should('not.contain', 'Timer Control');
cy.get('.App').should('not.contain', 'Messages Control');
cy.get('.App').should('contain', 'Info');
});
it('table routes', () => {