src/App/css/main - Copy (2).css [66:108]:
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
}


#resizableLayout {
    display: grid;
    grid-gap: var(--grid-gap);
    width: 100%;
    grid-template-rows: 2fr 5px 1fr; 
    grid-template-columns: 1fr 5px 3fr;    
    height: calc(100vh - var(--nav-bar-height) - var(--status-bar-height) - 2 * var(--grid-gap))
}

#v-gutter {
    grid-row-start: 1;
    grid-row-end: 4;
    cursor: ew-resize;
    background-color:#4D4D4D;    
}

#h-gutter {
    grid-column-start: 3;
    grid-column-end: 4;
    cursor: ns-resize;
    background-color:#4D4D4D;
    height: 5px;
}

#utilTile {
    overflow: auto;
    grid-row-start: 1;
    grid-row-end: 4;    
}

#workTile {
    overflow: auto;
    grid-column-start: 3;
    grid-column-end: 4;    
}

#propertiesTile {
    grid-column-start: 3;
    grid-column-end: 4;    
}
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -



src/App/css/main.css [69:111]:
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
}


#resizableLayout {
    display: grid;
    grid-gap: var(--grid-gap);
    width: 100%;
    grid-template-rows: 2fr 5px 1fr; 
    grid-template-columns: 1fr 5px 3fr;    
    height: calc(100vh - var(--nav-bar-height) - var(--status-bar-height) - 2 * var(--grid-gap))
}

#v-gutter {
    grid-row-start: 1;
    grid-row-end: 4;
    cursor: ew-resize;
    background-color:#4D4D4D;    
}

#h-gutter {
    grid-column-start: 3;
    grid-column-end: 4;
    cursor: ns-resize;
    background-color:#4D4D4D;
    height: 5px;
}

#utilTile {
    overflow: auto;
    grid-row-start: 1;
    grid-row-end: 4;
}

#workTile {
    overflow: auto;
    grid-column-start: 3;
    grid-column-end: 4;    
}

#propertiesTile {
    grid-column-start: 3;
    grid-column-end: 4;    
}
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -