mirror of
https://github.com/empayre/fleet.git
synced 2024-11-07 17:28:54 +00:00
243306de02
* handle query tags in build-static-content script, update query readme * show tags in query library, add ability to filter by tags * fix lint errors * update mobile styles * fix CTA link * update mobile layout * remove tag line-height and font size * Update build-static-content.js * Style update * remove margin from selected tag, adjust OS logo placement * requested changes from code review Co-authored-by: Mike Thomas <mthomas@fleetdm.com>
86 lines
5.3 KiB
Plaintext
Vendored
86 lines
5.3 KiB
Plaintext
Vendored
<div id="query-detail" v-cloak>
|
|
|
|
<div style="max-width: 1000px;" class="container-fluid justify-content-center p-0 px-4 pb-5 mb-lg-5 mx-auto">
|
|
<div class="d-flex flex-column p-0">
|
|
<a href="/queries" style="font-family: 'Nunito Sans'; font-size: 14px; font-weight: 700; text-decoration: none;" class="pt-4 pt-lg-5">
|
|
<img style="display: inline-block; width: 6px; height: 9px; transform: rotate(180deg); margin-bottom: 2px;" alt="back arrow" src="/images/chevron-right-6x9@2x.png"/>
|
|
<span class="ml-1"> Back to queries</span>
|
|
</a>
|
|
<div purpose="title-mobile" class="d-flex d-md-none flex-column pb-4 mb-3">
|
|
<h2 class="pt-4 pb-3 m-0">{{query.name}}</h2>
|
|
<h6 class="pb-3 m-0">{{query.description ? query.description : '--'}}</h6>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex flex-column flex-md-row justify-content-md-between">
|
|
<div class="container-fluid col-md-8 d-flex flex-column p-0 pr-md-3">
|
|
<div purpose="title-widescreen" class="d-none d-md-flex flex-column">
|
|
<h2 class="pt-4 pb-3 m-0">{{query.name}}</h2>
|
|
<h6 class="pb-3 m-0">{{query.description ? query.description : '--'}}</h6>
|
|
</div>
|
|
<div purpose="body" class="pt-4 pt-md-3 mt-3 mt-md-0">
|
|
<div purpose="query">
|
|
<h3 class="pb-4 mb-3 m-0">Query</h3>
|
|
<code class="pb-3">{{query.query ? query.query : '--'}}</code>
|
|
</div>
|
|
<div purpose="resolution" v-if="query.kind === 'policy' && query.resolution">
|
|
<h3 class="pt-5 pb-3">Resolve</h3>
|
|
<p>{{query.resolution}}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div purpose="summary-sidebar" class="col-md-4 order-first order-md-last p-0 pl-md-3 pt-md-4">
|
|
<div class="pb-2">
|
|
<div class="d-flex flex-md-column justify-content-between justify-content-md-start align-items-center align-items-md-start pb-1 pb-md-3">
|
|
<h5 class="pb-md-2 m-0">Platforms</h5>
|
|
<p class="pb-1" v-if="!query.platforms || !query.platforms.length">--</p>
|
|
<div purpose="platforms" class="d-flex align-items-center align-items-md-start pb-1" v-else>
|
|
<img class="d-inline-flex ml-3 ml-md-0 mr-md-3" src="/images/os-macos-black-24x24@2x.png" alt="macOS" v-if="query.platforms.includes('macOS')"/>
|
|
<img class="d-inline-flex ml-3 ml-md-0 mr-md-3" src="/images/os-windows-black-24x24@2x.png" alt="Windows" v-if="query.platforms.includes('Windows')"/>
|
|
<img class="d-inline-flex ml-3 ml-md-0 mr-md-3" src="/images/os-linux-black-24x24@2x.png" alt="Linux" v-if="query.platforms.includes('Linux')"/>
|
|
<img class="d-inline-flex ml-3 ml-md-0 mr-md-3" src="/images/os-freebsd-black-24x24@2x.png" alt="FreeBSD" v-if="query.platforms.includes('FreeBSD')"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="border-top py-2 pb-md-4">
|
|
<div class="d-flex flex-md-column justify-content-between justify-content-md-start align-items-center align-items-md-start pt-md-3">
|
|
<h5 class="pb-md-2 m-0">Tags</h5>
|
|
<div :class="[query.tags.length > 2 ? 'mt-1' : '']" class="d-flex flex-wrap align-items-center justify-content-end justify-content-sm-start">
|
|
<span class="mb-1" v-if="!query.tags || !query.tags.length">--</span>
|
|
<div purpose="query-tag" class="mr-md-1 ml-1 ml-md-0" :class="[query.tags.length > 2 ? 'mb-1' : '']" v-for="tag in query.tags">
|
|
{{tag}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="border-top py-2">
|
|
<div class="d-flex flex-md-column justify-content-between justify-content-md-start align-items-center align-items-md-start py-1 py-md-3">
|
|
<h5 class="pb-md-2 m-0">Purpose</h5>
|
|
<p class="m-0">{{query.kind === 'policy' ? 'Policy' : query.kind === 'query' ? 'Informational' : '--'}}</p>
|
|
</div>
|
|
</div>
|
|
<div class="border-top py-2 pb-md-4">
|
|
<div class="d-flex flex-md-column justify-content-between justify-content-md-start align-items-center align-items-md-start py-1 pt-md-3">
|
|
<h5 class="pb-md-2 m-0">Contributors</h5>
|
|
<div class="d-flex align-items-center">
|
|
<span class="mb-1" v-if="!query.contributors || !query.contributors.length">--</span>
|
|
<div class="d-flex pl-2 pl-md-0 pr-md-2" v-for="contributor in query.contributors">
|
|
<div purpose="avatar-frame" class="d-flex avatar-frame" @click="clickAvatar(contributor)">
|
|
<img alt="a GitHub user avatar" :alt="contributor.name ? contributor.name : contributor.handle" :src="contributor.avatarUrl"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="d-md-none border-top"></div>
|
|
<div class="py-2 pt-md-0">
|
|
<div class="d-flex flex-md-column justify-content-between justify-content-md-start align-items-center align-items-md-start py-1">
|
|
<h5 class="d-flex pb-md-2 m-0 mr-3">Contribute to this page</h5>
|
|
<p class="d-flex m-0"><a class="d-flex text-right m-0" target="_blank" :href="'https://github.com/fleetdm/fleet/edit/main/'+queryLibraryYmlRepoPath">View source</a></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<%- /* Expose server-rendered data as window.SAILS_LOCALS :: */ exposeLocalsToBrowser() %>
|