From 5ec25e461fd2ba72e50601c86b27a0aa7f5415ca Mon Sep 17 00:00:00 2001 From: gillespi314 <73313222+gillespi314@users.noreply.github.com> Date: Fri, 28 May 2021 12:00:54 -0500 Subject: [PATCH] Implement query detail page for standard query library (#887) * Implement detail page for standard query lib * Add alt text for image * Replace id with css class --- .../assets/images/lightbulb-blue-24x24@2x.png | Bin 0 -> 754 bytes website/assets/styles/pages/query-detail.less | 32 +++++++- website/views/pages/query-detail.ejs | 72 ++++++++++-------- 3 files changed, 72 insertions(+), 32 deletions(-) create mode 100644 website/assets/images/lightbulb-blue-24x24@2x.png diff --git a/website/assets/images/lightbulb-blue-24x24@2x.png b/website/assets/images/lightbulb-blue-24x24@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..2c4d7289e21d8885fafd4de7281f24264670968c GIT binary patch literal 754 zcmV7wBTzzOQ!AUD9A0J9({Z9I=> zQII86>CGQIUF0W4imd0+e4anwn>U0=q$%&-{lo|f_LzA{j9rlYY8a*bF92G|^Sm;+ zoldDh1PFl~AJ?7bGihiDCunX7??Z)n3y_Wvq~q7_9sjQjK|;I)oQ&6p1atjwiiA_# z+x6?KtNsFxI16}t!XvgkM|?^Vao{S#NkBc{4f74!!&!t{z{8xskrxJNm!kii_Opyi zO|XFyvUbuz=W7OcOPgwgRU=S;eVIC6(H*6X!VAqP=tiKbhUgYC#p+NKs1iVl8KG-T z@=_J136fM`fUaTeX~J|PfDH&BR+*%F7ka8_r;ut-jtWQg0XA^XQ9`lA-!yT`HNdy% zn8eU0O`J-Ah0W116+`vWR05{cUe1IZok4T$`9Qr3t*iArbb)Lb^#Mm4t`_ho#pQFf z41=9cXHGuQUzrJ`KAg8kaXCvemlvD_WOFK+sw1?7B|3m3&Q9Fkg4QqGCSIuoqf#$2 zEiMbUiFaA$bZoyzt4c5}E@re35B!rk;*W@i{Q^(C1z5|`@*`{fo!(o3>Dh=0-cA8e zyan`^y&{GuNE>;qLhqI>9t7PF)R!9fzi=iO8gHCEL9$L3_r07^P?j5Xs9!B@CfQ@^ zWoYsa5vQl)YJvcQ1Q1bp!7H$h&6ib_)rZFj5+Hl{X9VM)M%3&efM+W@TJ`M@0=@EC z#4vn*@gbRD%a+X%e9`?Em8nHCuO`v9QI)AhGOs4l1UQ*m3%Ge#C@UQMD2a5J?q k^J)@gWKC42)`EHc2K&DU*>9Fh*8l(j07*qoM6N<$f`>&%Q2+n{ literal 0 HcmV?d00001 diff --git a/website/assets/styles/pages/query-detail.less b/website/assets/styles/pages/query-detail.less index 09f2511b42..2a7caac610 100644 --- a/website/assets/styles/pages/query-detail.less +++ b/website/assets/styles/pages/query-detail.less @@ -1,5 +1,35 @@ #query-detail { - // … + h5 { + font-size: 18px; + font-weight: bold; + } + + h6 { + font-size: 16px; + line-height: 24px; + } + + a { + font-size: 18px; + color: @core-vibrant-blue; + } + + .query-tip { + background-color: @ui-off-white; + + .lightbulb { + height: 24px; + width: auto; + margin-left: 4px; + margin-right: 20px; + } + + } + + .query-sidebar { + border-color: #E2E4EA; + + } } diff --git a/website/views/pages/query-detail.ejs b/website/views/pages/query-detail.ejs index 2be05840ae..bee4c11ee7 100644 --- a/website/views/pages/query-detail.ejs +++ b/website/views/pages/query-detail.ejs @@ -2,38 +2,48 @@
-

TODO: Implement this part.

-

(See also assets/styles/pages/query-detail.less, assets/js/pages/query-detail.page.js, and api/controllers/view-query-detail.js.)

-

sql:

- {{query.query}} - <% /* - e.g. here's what all is available: - { - "name": "Get Docker images on a system", - "platforms": "macOS, Linux", - "description": "Docker images information, can be used on normal system or a kubenode.", - "query": "SELECT * FROM docker_images;", - "purpose": "Informational", - "remediation": "N/A", - "contributors": "anelshaer,gillespi314" - }, - */ %> -

here's what all's available

- {{query}} - - - +

{{query.name}}

+
{{query.description}}
+
+
+ lightbulb

{{query.tip}}

+
+
+

Query

+ {{query.query}} +
+

Remediation

+
    +
  • + {{item}} +
  • +
+
-
-

Platforms

-

- - -

-

Purpose

-

Informational

-

Contribute

- Edit this page + +
+ +
+
Platforms
+

+ + + +

+
+ +
+
Purpose
+

{{query.purpose}}

+
+ +
+
Contributors
+ +

{{query.contributors}}

+
+
Contribute to this page
+ View source