mirror of
https://github.com/nasa/openmct.git
synced 2024-12-22 22:42:24 +00:00
33c208d8fe
open #965 - CSS adjusted to handle min-width of 2px and better approach to ellipsizing text; - Angular ng-class added to hide icon and title if width less than a value; - Rounded corners on bars removed;
77 lines
1.3 KiB
SCSS
77 lines
1.3 KiB
SCSS
.l-timeline-gantt {
|
|
min-width: 2px;
|
|
overflow: hidden;
|
|
position: absolute;
|
|
top: $timelineSwimlaneGanttVM; bottom: $timelineSwimlaneGanttVM;
|
|
|
|
.bar {
|
|
@include ellipsize();
|
|
height: $activityBarH;
|
|
line-height: $activityBarH;
|
|
padding: 0 $interiorMargin;
|
|
|
|
span {
|
|
$iconW: 20px;
|
|
@include absPosDefault();
|
|
display: block;
|
|
&.s-activity-type {
|
|
right: auto; width: $iconW;
|
|
text-align: center;
|
|
&.timeline {
|
|
&:before {
|
|
content:"S";
|
|
}
|
|
}
|
|
&.activity {
|
|
&:before {
|
|
content:"A";
|
|
}
|
|
}
|
|
}
|
|
&.s-title {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
left: $iconW;
|
|
}
|
|
&.duration {
|
|
left: auto;
|
|
opacity: 0.75;
|
|
right: 0;
|
|
text-align: right;
|
|
width: 60px;
|
|
}
|
|
&.handle {
|
|
top: 0;
|
|
bottom: 0;
|
|
height: auto;
|
|
width: 15px;
|
|
&.left {
|
|
right: auto;
|
|
}
|
|
&.middle {
|
|
right: 15px;
|
|
left: 15px;
|
|
width: auto;
|
|
}
|
|
&.right {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&.sm .bar span {
|
|
// Hide icon and label if width is too small
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.edit-mode .s-timeline-gantt,
|
|
.s-status-editing .s-timeline-gantt {
|
|
.handle {
|
|
cursor: col-resize;
|
|
&.mid {
|
|
cursor: ew-resize;
|
|
}
|
|
}
|
|
} |