ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2024-12-19 05:07:52 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Code trimming / cleanup

Browse Source 
- pane tweaks;
This commit is contained in:
charlesh88 2018-08-30 14:34:44 -07:00
parent 139e5ab184
commit 5aad2e6863
2 changed files with 12 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/ui/components/controls/pane.vue
View File

@ -5,6 +5,7 @@
'l-pane--horizontal-handle-after': type === 'horizontal' && handle === 'after', 'l-pane--horizontal-handle-after': type === 'horizontal' && handle === 'after',
'l-pane--vertical-handle-before': type === 'vertical' && handle === 'before', 'l-pane--vertical-handle-before': type === 'vertical' && handle === 'before',
'l-pane--vertical-handle-after': type === 'vertical' && handle === 'after', 'l-pane--vertical-handle-after': type === 'vertical' && handle === 'after',
'l-pane--collapsable' : collapsable,
'l-pane--collapsed': collapsed, 'l-pane--collapsed': collapsed,
'l-pane--reacts': !handle, 'l-pane--reacts': !handle,
'l-pane--resizing': resizing === true 'l-pane--resizing': resizing === true
@ -13,7 +14,7 @@
class="l-pane__handle" class="l-pane__handle"
@mousedown="start"> @mousedown="start">
</div> </div>
<a v-if="collapsable" <a v-if="label"
class="l-pane__collapse-button" class="l-pane__collapse-button"
@click="toggleCollapse"> @click="toggleCollapse">
<span class="l-pane__label">{{ label }}</span> <span class="l-pane__label">{{ label }}</span>
@ -42,6 +43,10 @@
> .l-pane { > .l-pane {
flex-flow: column nowrap; flex-flow: column nowrap;
} }
&--vertical {
height: 100%;
}
} }
.l-pane { .l-pane {
@ -59,7 +64,6 @@
} }
&__collapse-button { &__collapse-button {
// Mobile-first
position: absolute; position: absolute;
display: flex; display: flex;
align-items: center; align-items: center;

26
src/ui/components/layout/MctInspector.vue
View File

@ -6,16 +6,9 @@
</pane> </pane>
<pane class="l-pane c-inspector__elements" <pane class="l-pane c-inspector__elements"
handle="before" handle="before"
label="foo" label="Elements">
collapsable>
<div ref="elements">c-inspector__elements 1</div> <div ref="elements">c-inspector__elements 1</div>
</pane> </pane>
<pane class="l-pane c-inspector__elements"
handle="before"
label="bar"
collapsable>
<div ref="elements">c-inspector__elements 2</div>
</pane>
</multipane> </multipane>
</template> </template>
@ -34,10 +27,6 @@
} }
.c-inspector { .c-inspector {
display: flex;
flex-flow: column nowrap;
align-items: stretch;
height: 100%;
min-width: 150px; min-width: 150px;
> [class*="__"] { > [class*="__"] {
@ -48,23 +37,22 @@
} }
> .l-pane__contents > * { > .l-pane__contents > * {
margin-right: $interiorMarginSm; // Provide margin against scrollbar // Provide margin against scrollbar
// TODO: move this into pane.vue
margin-right: $interiorMarginSm;
} }
} }
&__properties {
}
&__elements { &__elements {
height: 200px; height: 200px;
} }
.l-inspector-part { .l-inspector-part {
display: contents; display: contents; // Legacy
} }
h2 { h2 {
// Legacy, somewhat
@include grid-two-column-span-cols; @include grid-two-column-span-cols;
border-radius: $smallCr; border-radius: $smallCr;
background-color: $colorInspectorSectionHeaderBg; background-color: $colorInspectorSectionHeaderBg;
@ -200,8 +188,6 @@
} }
} }
} }
</style> </style>
<script> <script>