ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-02-08 03:50:39 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Finish refactor using grid-template

Browse Source
This commit is contained in:
Rukmini Bose 2024-02-13 14:56:39 -08:00
parent 4b61e61af7
commit f55e31b84b
1 changed files with 37 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
src/plugins/timeConductor/conductor.scss
View File

@ -604,64 +604,50 @@
padding: cButtonPadding($compact: true); padding: cButtonPadding($compact: true);
} }
} }
.pr-time{
.-label-start-date{
grid-area: sDate;
}
.-label-start-time{
grid-area: sTime;
}
.-input-start-date{
grid-area: sDateInput;
}
.-input-start-time{
grid-area: sTimeInput;
}
.pr-time-label-start-date{ &.icon-arrows-right-left{
background: red; grid-area: arrowIcon;
grid-area: head; }
} .-label-end-date{
.pr-time-label-start-time{ grid-area: eDate;
background: red; }
grid-area: headd; .-label-end-time{
} grid-area: eTime;
.pr-time-input-start-date{
background: blue;
grid-area: headdd;
}
.pr-time-input-start-time{
background: blue;
grid-area: inputStartTime;
}
.icon-arrows-right-left{ }
background: green; .-input-end-date{
grid-area: arrowIcon; grid-area: eDateInput;
} }
.pr-time-label-end-date{ .-input-end-time{
background: red; grid-area: eTimeInput;
grid-area: endDate; }
} .-input--buttons{
.pr-time-label-end-time{ grid-area: buttons;
background: red; }
grid-area: endTime; .-label-blank-grid{
grid-area: blank;
} }
.pr-time-input-end-date{
background: blue;
grid-area: inputEndDate;
}
.pr-time-input-end-time{
background: blue;
grid-area: inputEndTime;
}
.pr-time-input--buttons{
background: purple;
grid-area: buttons;
}
.pr-time-label-blank-grid{
background: yellow;
grid-area: blankSpace;
} }
&--fixed-mode { &--fixed-mode {
.c-tc-input-popup__input-grid { .c-tc-input-popup__input-grid {
// grid-template-columns: 1fr 1fr 1fr 1fr 1fr 2fr; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 2fr;
grid-template-rows: 50px 1fr 30px;
grid-template-columns: 150px 1fr;
// grid-template-areas:
// "start_date start_time blank-space end_date end_time blank-space"
// "input_start_date input_start_time arrow_icon input_end_date input_end_time buttons";
grid-template-areas: grid-template-areas:
"head headd headdd"; "sDate sTime . eDate eTime ."
"sDateInput sTimeInput arrowIcon eDateInput eTimeInput buttons ";
} }