mirror of
https://github.com/Max-Stevenson/jurassic-park-interface.git
synced 2024-06-17 23:29:28 +00:00
Fixed the CSS hellscape created this morning.
This commit is contained in:
parent
6f9ff21a63
commit
8f6dad1634
|
@ -4,7 +4,7 @@
|
||||||
<link
|
<link
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
type="text/css"
|
type="text/css"
|
||||||
href="public/stylesheets/styles.css"
|
href="./public/stylesheets/styles.css"
|
||||||
/>
|
/>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
@ -89,7 +89,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="outer-edge__light" id="control-panel">
|
<div class="outer-edge__light" id="control-panel">
|
||||||
<div class="inner-edge__light">
|
<div class="inner-edge__light" id="control-panel__inner">
|
||||||
<div class="control-panel__button-display">
|
<div class="control-panel__button-display">
|
||||||
<div class="button__depressed">
|
<div class="button__depressed">
|
||||||
<p class="button-text__embossed small-button">VEHICLE</p>
|
<p class="button-text__embossed small-button">VEHICLE</p>
|
||||||
|
|
|
@ -22,6 +22,7 @@ body {
|
||||||
border-bottom: solid 1px #c8c8c8;
|
border-bottom: solid 1px #c8c8c8;
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
background-color: #797979;
|
background-color: #797979;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner-edge__light, .inner-edge__light__no-padding {
|
.inner-edge__light, .inner-edge__light__no-padding {
|
||||||
|
@ -30,6 +31,7 @@ body {
|
||||||
border-left: solid 2px #c8c8c8;
|
border-left: solid 2px #c8c8c8;
|
||||||
border-top: solid 2px #c8c8c8;
|
border-top: solid 2px #c8c8c8;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner-edge__dark {
|
.inner-edge__dark {
|
||||||
|
@ -37,6 +39,7 @@ body {
|
||||||
border-right: solid 2px #3F3D43;
|
border-right: solid 2px #3F3D43;
|
||||||
border-left: solid 2px #A7A8AE;
|
border-left: solid 2px #A7A8AE;
|
||||||
border-top: solid 2px #A7A8AE;
|
border-top: solid 2px #A7A8AE;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.outer-edge__dark, .outer-edge__dark__no-right-edge {
|
.outer-edge__dark, .outer-edge__dark__no-right-edge {
|
||||||
|
@ -45,18 +48,22 @@ body {
|
||||||
border-right: solid 1px #c1c2c6;
|
border-right: solid 1px #c1c2c6;
|
||||||
border-bottom: solid 1px #c1c2c6;
|
border-bottom: solid 1px #c1c2c6;
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner-edge__light__no-padding {
|
.inner-edge__light__no-padding {
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.outer-edge__dark__no-right-edge {
|
.outer-edge__dark__no-right-edge {
|
||||||
border-right: none;
|
border-right: none;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.outer-edge__light__no-right-edge {
|
.outer-edge__light__no-right-edge {
|
||||||
border-right: none;
|
border-right: none;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.outer-edge__console {
|
.outer-edge__console {
|
||||||
|
@ -65,6 +72,7 @@ body {
|
||||||
border-bottom: solid 1px #B1ABAB;
|
border-bottom: solid 1px #B1ABAB;
|
||||||
border-left: solid 1px #6A6767;
|
border-left: solid 1px #6A6767;
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner-edge__console {
|
.inner-edge__console {
|
||||||
|
@ -73,6 +81,7 @@ body {
|
||||||
border-bottom: solid 1px #A59B9A;
|
border-bottom: solid 1px #A59B9A;
|
||||||
border-left: solid 1px #EAE9E9;
|
border-left: solid 1px #EAE9E9;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.control-panel__button-display {
|
.control-panel__button-display {
|
||||||
|
@ -112,6 +121,9 @@ body {
|
||||||
|
|
||||||
.map-display__system-wrapper {
|
.map-display__system-wrapper {
|
||||||
background-color: #448149;
|
background-color: #448149;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.map-display__center-section {
|
.map-display__center-section {
|
||||||
|
@ -132,14 +144,15 @@ body {
|
||||||
.map-display__system-status {
|
.map-display__system-status {
|
||||||
background: #438149;
|
background: #438149;
|
||||||
color: #ededed;
|
color: #ededed;
|
||||||
margin: 0 auto;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.map-display__system-status__container {
|
.map-display__system-status__container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
border: 10px solid #438149;
|
border-top: 10px solid #438149;
|
||||||
|
border-bottom: 10px solid #438149;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sys-one {
|
#sys-one {
|
||||||
|
@ -147,7 +160,8 @@ body {
|
||||||
text-orientation: mixed;
|
text-orientation: mixed;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sys-one, #sys-four {
|
#sys-one,
|
||||||
|
#sys-four {
|
||||||
font-size: 38px;
|
font-size: 38px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -159,7 +173,8 @@ body {
|
||||||
padding: 8px 8px 4px 8px;
|
padding: 8px 8px 4px 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sys-three, #sys-two {
|
#sys-three,
|
||||||
|
#sys-two {
|
||||||
font-size: 26px;
|
font-size: 26px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -173,6 +188,7 @@ body {
|
||||||
grid-template-rows: auto auto;
|
grid-template-rows: auto auto;
|
||||||
grid-template-columns: auto auto;
|
grid-template-columns: auto auto;
|
||||||
justify-items: stretch;
|
justify-items: stretch;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#outer-container__outer {
|
#outer-container__outer {
|
||||||
|
@ -184,18 +200,12 @@ body {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#system-icons {
|
|
||||||
grid-area: 4/2/5/3;
|
|
||||||
}
|
|
||||||
|
|
||||||
#console-display {
|
#console-display {
|
||||||
grid-area: 4/1/5/2;
|
grid-area: 4/1/5/2;
|
||||||
}
|
}
|
||||||
|
|
||||||
#control-panel {
|
#control-panel {
|
||||||
display: flex;
|
grid-area: 1/2/4/3;
|
||||||
flex-direction: column;
|
|
||||||
grid-area: 1/2/2/3;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#map-display__outer {
|
#map-display__outer {
|
||||||
|
@ -210,7 +220,13 @@ body {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#control-panel__inner {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
.room-info__container {
|
.room-info__container {
|
||||||
|
grid-area: 3/1/4/4;
|
||||||
background-color: #e2eb57;
|
background-color: #e2eb57;
|
||||||
padding: 3px;
|
padding: 3px;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -469,6 +485,7 @@ body {
|
||||||
.button-control__bottom {
|
.button-control__bottom {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button-control__top > div {
|
.button-control__top > div {
|
||||||
|
@ -480,6 +497,10 @@ body {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.control-panel__output-display {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.output-display__wrapper {
|
.output-display__wrapper {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
{"version":3,"sourceRoot":"","sources":["../../sass/base/_base.scss","../../sass/components/_borders.scss","../../sass/components/_buttons.scss","../../sass/components/_display-text.scss","../../sass/components/_layout.scss","../../sass/components/_level-info.scss","../../sass/components/_screen-display.scss","../../sass/components/_video-screen.scss","../../sass/components/_control-panel.scss","../../sass/components/_output-display.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;EAGE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;ACdF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EAEE;;;AAGF;EAEE;;;AAGF;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AC5DF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAYF;EACE;;;AC1CF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;ACxDF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;ACvCF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;ACtDF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;ACjHF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;ACnEF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;ACtBF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA","file":"styles.css"}
|
{"version":3,"sourceRoot":"","sources":["../../sass/base/_base.scss","../../sass/components/_borders.scss","../../sass/components/_buttons.scss","../../sass/components/_display-text.scss","../../sass/components/_layout.scss","../../sass/components/_level-info.scss","../../sass/components/_screen-display.scss","../../sass/components/_video-screen.scss","../../sass/components/_control-panel.scss","../../sass/components/_output-display.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;EAGE;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;ACdF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EAEE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;ACrEF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAYF;EACE;;;AC1CF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;AAGF;EACE;EACA;;;AC9DF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;ACvCF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;ACtDF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;ACjHF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;ACnEF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AC3BF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA","file":"styles.css"}
|
|
@ -5,6 +5,7 @@
|
||||||
border-bottom: solid 1px #c8c8c8;
|
border-bottom: solid 1px #c8c8c8;
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
background-color: #797979;
|
background-color: #797979;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner-edge__light {
|
.inner-edge__light {
|
||||||
|
@ -13,6 +14,7 @@
|
||||||
border-left: solid 2px #c8c8c8;
|
border-left: solid 2px #c8c8c8;
|
||||||
border-top: solid 2px #c8c8c8;
|
border-top: solid 2px #c8c8c8;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner-edge__dark {
|
.inner-edge__dark {
|
||||||
|
@ -20,6 +22,7 @@
|
||||||
border-right: solid 2px #3F3D43;
|
border-right: solid 2px #3F3D43;
|
||||||
border-left: solid 2px #A7A8AE;
|
border-left: solid 2px #A7A8AE;
|
||||||
border-top: solid 2px #A7A8AE;
|
border-top: solid 2px #A7A8AE;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.outer-edge__dark {
|
.outer-edge__dark {
|
||||||
|
@ -28,21 +31,25 @@
|
||||||
border-right: solid 1px #c1c2c6;
|
border-right: solid 1px #c1c2c6;
|
||||||
border-bottom: solid 1px #c1c2c6;
|
border-bottom: solid 1px #c1c2c6;
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner-edge__light__no-padding {
|
.inner-edge__light__no-padding {
|
||||||
@extend .inner-edge__light;
|
@extend .inner-edge__light;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.outer-edge__dark__no-right-edge {
|
.outer-edge__dark__no-right-edge {
|
||||||
@extend .outer-edge__dark;
|
@extend .outer-edge__dark;
|
||||||
border-right: none;
|
border-right: none;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.outer-edge__light__no-right-edge {
|
.outer-edge__light__no-right-edge {
|
||||||
@extend .outer-edge__light;
|
@extend .outer-edge__light;
|
||||||
border-right: none;
|
border-right: none;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.outer-edge__console {
|
.outer-edge__console {
|
||||||
|
@ -51,6 +58,7 @@
|
||||||
border-bottom: solid 1px #B1ABAB;
|
border-bottom: solid 1px #B1ABAB;
|
||||||
border-left: solid 1px #6A6767;
|
border-left: solid 1px #6A6767;
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner-edge__console {
|
.inner-edge__console {
|
||||||
|
@ -59,4 +67,5 @@
|
||||||
border-bottom: solid 1px #A59B9A;
|
border-bottom: solid 1px #A59B9A;
|
||||||
border-left: solid 1px #EAE9E9;
|
border-left: solid 1px #EAE9E9;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
|
@ -12,6 +12,7 @@
|
||||||
.button-control__bottom {
|
.button-control__bottom {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button-control__top > div {
|
.button-control__top > div {
|
||||||
|
@ -22,3 +23,7 @@
|
||||||
.button-control__bottom > div {
|
.button-control__bottom > div {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.control-panel__output-display {
|
||||||
|
flex: 1;
|
||||||
|
}
|
|
@ -1,5 +1,8 @@
|
||||||
.map-display__system-wrapper {
|
.map-display__system-wrapper {
|
||||||
background-color: #448149;
|
background-color: #448149;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.map-display__center-section {
|
.map-display__center-section {
|
||||||
|
@ -21,14 +24,15 @@
|
||||||
.map-display__system-status {
|
.map-display__system-status {
|
||||||
background: #438149;
|
background: #438149;
|
||||||
color: #ededed;
|
color: #ededed;
|
||||||
margin: 0 auto;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.map-display__system-status__container {
|
.map-display__system-status__container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
border: 10px solid #438149;
|
border-top: 10px solid #438149;
|
||||||
|
border-bottom: 10px solid #438149;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sys-one {
|
#sys-one {
|
||||||
|
@ -36,7 +40,8 @@
|
||||||
text-orientation: mixed;
|
text-orientation: mixed;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sys-one, #sys-four {
|
#sys-one,
|
||||||
|
#sys-four {
|
||||||
font-size: 38px;
|
font-size: 38px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -48,7 +53,8 @@
|
||||||
padding: 8px 8px 4px 8px;
|
padding: 8px 8px 4px 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sys-three, #sys-two {
|
#sys-three,
|
||||||
|
#sys-two {
|
||||||
font-size: 26px;
|
font-size: 26px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -56,5 +62,3 @@
|
||||||
writing-mode: tb-rl;
|
writing-mode: tb-rl;
|
||||||
transform: rotate(-180deg);
|
transform: rotate(-180deg);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -8,29 +8,23 @@
|
||||||
|
|
||||||
#outer-container__outer {
|
#outer-container__outer {
|
||||||
max-width: 85%;
|
max-width: 85%;
|
||||||
height: 85%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#outer-container__inner {
|
#outer-container__inner {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#system-icons {
|
|
||||||
grid-area: 4 / 2 / 5 / 3;
|
|
||||||
}
|
|
||||||
|
|
||||||
#console-display {
|
#console-display {
|
||||||
grid-area: 4 / 1 / 5 / 2;
|
grid-area: 4 / 1 / 5 / 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
#control-panel {
|
#control-panel {
|
||||||
display: flex;
|
grid-area: 1 / 2 / 4 / 3;
|
||||||
flex-direction: column;
|
|
||||||
grid-area: 1 / 2 / 2 / 3;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#map-display__outer {
|
#map-display__outer {
|
||||||
grid-area: 1 / 1 / 3 / 2;
|
grid-area: 1 / 1 / 4 / 2;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
@ -40,3 +34,8 @@
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#control-panel__inner {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user