mirror of
https://github.com/nasa/openmct.git
synced 2025-05-24 11:14:21 +00:00
fbf1c68c7a
* Notebook styling WIP - New notebook scss file; - notebook.html converted; * Notebook styling WIP - Entries and embeds - New discreteItem theme constants; * Notebook styling shippable - Notebook entries and embeds finished; - TODO: Fix styling for c-input-inline when SCSS is merged and remove s-input-inline class in entry.html; * Notebook styling shippable - Remove legacy Notebook styles; - Painterro overrides; - Code cleanup * Notebook mobile styling; entry layout still WIP - Entries now layout better in narrow containers but still WIP, particularly for delete icon; - Mobile styling; * Notebook entry markup for better narrow Notebook layout
43 lines
1.8 KiB
HTML
43 lines
1.8 KiB
HTML
<div class="c-notebook">
|
|
<div class="c-notebook__head">
|
|
<!-- TODO: use search component here -->
|
|
<div class="c-notebook__search c-search"
|
|
:class="{ 'is-active': entrySearch }">
|
|
<input class="c-search__input" type="search"
|
|
type="text" tabindex="10000"
|
|
v-model="entrySearch"
|
|
v-on:keyup="search($event)"/>
|
|
<a class="c-search__clear-input icon-x-in-circle"
|
|
v-on:click="entrySearch = ''; search($event)"></a>
|
|
</div>
|
|
<div class="c-notebook__controls">
|
|
<div class="select c-notebook__controls__time">
|
|
<select v-model="showTime">
|
|
<option value="0" selected="selected">Show all</option>
|
|
<option value="1">Last hour</option>
|
|
<option value="8">Last 8 hours</option>
|
|
<option value="24">Last 24 hours</option>
|
|
</select>
|
|
</div>
|
|
<div class="select c-notebook__controls__sort">
|
|
<select v-model="sortEntries">
|
|
<option value="-createdOn" selected="selected">Newest first</option>
|
|
<option value="createdOn">Oldest first</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="c-notebook__drag-area icon-plus"
|
|
v-on:click="newEntry($event)"
|
|
id="newEntry" mct-entry-dnd>
|
|
<span class="c-notebook__drag-area__label">To start a new entry, click here or drag and drop any object</span>
|
|
</div>
|
|
<div class="c-notebook__entries" ng-mouseover="handleActive()">
|
|
<ul>
|
|
<notebook-entry
|
|
v-for="entry in filterBySearch(entries, entrySearch)"
|
|
v-bind:entry="entry"
|
|
></notebook-entry>
|
|
</ul>
|
|
</div>
|
|
</div> |