Merge pull request #23 from titilambert/frontend_ui_rebased
Merge frontend_ui with master
This commit is contained in:
Frédéric Vachon
commit
b2b107a5c1
BIN
app/assets/font/adagios-fontawesome.eot
Normal file
BIN
app/assets/font/adagios-fontawesome.eot
Normal file
Binary file not shown.
40
app/assets/font/adagios-fontawesome.svg
Normal file
40
app/assets/font/adagios-fontawesome.svg
Normal file
@ -0,0 +1,40 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Copyright (C) 2015 by original authors @ fontello.com</metadata>
|
||||
<defs>
|
||||
<font id="adagios-fontawesome" horiz-adv-x="1000" >
|
||||
<font-face font-family="adagios-fontawesome" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
|
||||
<missing-glyph horiz-adv-x="1000" />
|
||||
<glyph glyph-name="profil" unicode="" d="m172 641c0-2 0-3 0-5 0 0 0 0 0 0 0-3 0-5 0-8 0-80 64-145 144-145 80 0 145 65 145 145 0 8-1 15-2 23 0 0 0 0 0 0-1 3-1 6-2 9-4 29 20 28 20 28h50c15-1 17-14 16-25-1-4-2-8-3-12 0 0 0 0 0 0l0 0c-1-8-2-15-2-23 0-80 65-145 145-145 80 0 144 65 144 145 0 3 0 5 0 8 0 0 0 0 0 0 0 2 0 3 0 5 0 23 31 17 31 17v50h-15v0h0c-30 0-66 30-66 30l0 0c-25 22-58 35-94 35-46 0-87-22-114-55l1 0c0 0-20 2-38 5-18 3-53 2-65 0-12-2-39-3-39-3h0c-26 32-67 53-112 53-64 0-69-13-94-35v0c0 0-36-30-66-30h-15v-50c0 0 31 6 31-17z m510 102c67 0 121-55 121-121s-54-121-121-121c-66 0-120 54-120 121 0 66 54 121 120 121z m-365 0c66 0 120-55 120-121s-54-121-120-121c-67 0-121 54-121 121 0 66 54 121 121 121z m569-345c2 44 15 91 5 144-11-34-23-71-34-102-2-6-3-11-5-16-3-5-9-9-13-13-1-2 0-4-1-6-7-9-15-17-21-26-4-5-6-12-12-15-11-1-21-2-31-4 1-16-2-29-2-44-9-5-19-8-28-13-9-22-14-49-24-70-2 0-4 1-6 1 0 25 5 47 3 69-2 14-8 31-12 40-3 7-8 18-11 23-1 1-3 4-4 5-2 2-3 3-4 5-9 10-23 24-33 31-1 0-6 5-9 7-21 13-41 17-67 22-12 2-26 5-37 4-15-3-25-13-39-19-6 4-13 7-19 10-7 3-14 9-21 10-9 2-17-1-26-2-27-3-48-16-66-26-3-2-18-2-19-3 0 0-6-6-7-7-12-8-22-17-31-27-7-9-9-15-14-24-2-5-5-8-6-12-5-11-8-22-9-30-3-27 0-52 1-76-4-2-8-3-12-5-6 25-15 48-22 73-11 4-22 6-29 14 1 16-3 27-2 43-11 0-21 2-31 3-10 9-16 20-24 31-8 11-19 21-25 33-1 4-3 10-5 14-12 34-21 68-34 99-1-25-3-46-2-68 1-21 6-41 7-60 0-11-1-21 0-32 1-18 2-34 7-44 5-12 14-25 17-35 2-6 2-13 3-19 4-15 9-36 13-48 3-14 5-14 12-23 2-3 5-8 7-10 1-3 4-6 5-7 2-3 4-5 5-7 1-2 2-2 3-4 2-2 2-6 4-8 2-4 4-3 5-7 2-5 1-11 2-16 2-14 6-30 7-45 13-19 33-34 45-53 6-11 11-23 17-35 6-12 11-23 15-36 6-1 9-6 13-9 2-2 4-1 6-3 3-2 4-6 6-7 1-2 4-2 7-4 6-5 11-10 19-14 12-5 33-6 51-10 19-4 37-10 52-10 18 0 34 7 50 8 8-3 15-7 21-12 10 4 19 8 28 12 14-1 30-7 45-7 7 1 17 4 26 6 21 4 45 10 64 14 5 1 10 0 14 1 1 1 2 4 5 5 5 5 8 6 12 9 11 9 22 18 31 24 5 13 10 24 15 37 7 13 15 32 23 41 10 12 19 23 28 33 4 5 8 9 10 14 3 9 4 19 5 29 1 5 1 10 2 16 1 4 0 11 2 15 1 5 7 9 10 14 7 10 17 23 23 31 2 4 5 8 6 12 4 10 5 21 7 33 2 5 4 11 6 16 3 12 4 23 8 33 2 4 5 8 7 13 2 5 3 11 5 16 3 6 6 9 7 14 3 15-1 31 0 46z m-216-146c-11-27-21-53-34-76-14 3-25 8-39 12-9-4-12-14-22-18-10 12-22 25-35 33-9 6-16 12-24 17-2 2-3 4-5 6-15 10-12 8-22 0-5-4-10-6-11-7-23-18-41-33-59-50-8 4-13 13-22 17-11-6-26-9-38-14-13 26-23 53-36 78-2-1-3-1-4-2 0 1 1 2 2 3 8 16 3 34 10 49 6 11 29 33 40 35 15 3 35 17 54 14 28-2 62-9 74 9 7-6 12-12 21-14 15-3 35 2 53 4 19 2 40 6 56 3 5-1 19-21 22-23 1 0 0-13 1-13 4-3 5-4 8-7 15-13 10-42 18-59-2 1-5 2-8 3z" horiz-adv-x="1000" />
|
||||
<glyph glyph-name="cog" unicode="" d="m571 350q0 59-41 101t-101 42-101-42-42-101 42-101 101-42 101 42 41 101z m286 61v-124q0-7-4-13t-11-7l-104-16q-10-30-21-51 19-27 59-77 6-6 6-13t-5-13q-15-21-55-61t-53-39q-7 0-14 5l-77 60q-25-13-51-21-9-76-16-104-4-16-20-16h-124q-8 0-14 5t-6 12l-16 103q-27 9-50 21l-79-60q-6-5-14-5-8 0-14 6-70 64-92 94-4 5-4 13 0 6 5 12 8 12 28 37t30 40q-15 28-23 55l-102 15q-7 1-11 7t-5 13v124q0 7 5 13t10 7l104 16q8 25 22 51-23 32-60 77-6 7-6 14 0 5 5 12 15 20 55 60t53 40q7 0 15-5l77-60q24 13 50 21 9 76 17 104 3 15 20 15h124q7 0 13-4t7-12l15-103q28-9 50-21l80 60q5 5 13 5 7 0 14-5 72-67 92-95 4-5 4-13 0-6-4-12-9-12-29-38t-30-39q14-28 23-55l102-15q7-1 12-7t4-13z" horiz-adv-x="857.1" />
|
||||
<glyph glyph-name="search" unicode="" d="m643 386q0 103-74 176t-176 74-177-74-73-176 73-177 177-73 176 73 74 177z m286-465q0-29-22-50t-50-21q-30 0-50 21l-191 191q-100-69-223-69-80 0-153 31t-125 84-84 125-31 153 31 152 84 126 125 84 153 31 152-31 126-84 84-126 31-152q0-123-69-223l191-191q21-21 21-51z" horiz-adv-x="928.6" />
|
||||
<glyph glyph-name="clock" unicode="" d="m500 546v-250q0-7-5-12t-13-5h-178q-8 0-13 5t-5 12v36q0 8 5 13t13 5h125v196q0 8 5 13t12 5h36q8 0 13-5t5-13z m232-196q0 83-41 152t-110 111-152 41-153-41-110-111-41-152 41-152 110-111 153-41 152 41 110 111 41 152z m125 0q0-117-57-215t-156-156-215-58-216 58-155 156-58 215 58 215 155 156 216 58 215-58 156-156 57-215z" horiz-adv-x="857.1" />
|
||||
<glyph glyph-name="minus" unicode="" d="m786 439v-107q0-22-16-38t-38-15h-678q-23 0-38 15t-16 38v107q0 23 16 38t38 16h678q22 0 38-16t16-38z" horiz-adv-x="785.7" />
|
||||
<glyph glyph-name="plus" unicode="" d="m786 439v-107q0-22-16-38t-38-15h-232v-233q0-22-16-37t-38-16h-107q-22 0-38 16t-15 37v233h-232q-23 0-38 15t-16 38v107q0 23 16 38t38 16h232v232q0 22 15 38t38 16h107q23 0 38-16t16-38v-232h232q22 0 38-16t16-38z" horiz-adv-x="785.7" />
|
||||
<glyph glyph-name="up-dir" unicode="" d="m571 171q0-14-10-25t-25-10h-500q-15 0-25 10t-11 25 11 26l250 250q10 10 25 10t25-10l250-250q10-11 10-26z" horiz-adv-x="571.4" />
|
||||
<glyph glyph-name="left-dir" unicode="" d="m357 600v-500q0-14-10-25t-26-11-25 11l-250 250q-10 11-10 25t10 25l250 250q11 11 25 11t26-11 10-25z" horiz-adv-x="357.1" />
|
||||
<glyph glyph-name="right-dir" unicode="" d="m321 350q0-14-10-25l-250-250q-11-11-25-11t-25 11-11 25v500q0 15 11 25t25 11 25-11l250-250q10-10 10-25z" horiz-adv-x="357.1" />
|
||||
<glyph glyph-name="down-dir" unicode="" d="m571 457q0-14-10-25l-250-250q-11-11-25-11t-25 11l-250 250q-11 11-11 25t11 25 25 11h500q14 0 25-11t10-25z" horiz-adv-x="571.4" />
|
||||
<glyph glyph-name="bell-alt" unicode="" d="m509-96q0 8-9 8-33 0-57 24t-23 57q0 9-9 9t-9-9q0-41 29-70t69-28q9 0 9 9z m455 160q0-29-21-50t-50-21h-250q0-59-42-101t-101-42-101 42-42 101h-250q-29 0-50 21t-21 50q28 24 51 49t47 67 42 89 27 114 11 146q0 84 66 157t171 89q-5 10-5 21 0 23 16 38t38 16 38-16 16-38q0-11-5-21 106-16 171-89t66-157q0-78 11-146t27-114 42-89 47-67 51-49z" horiz-adv-x="1000" />
|
||||
<glyph glyph-name="arrows-cw" unicode="" d="m843 261q0-3 0-4-36-150-150-243t-267-93q-81 0-157 31t-136 88l-72-72q-11-11-25-11t-25 11-11 25v250q0 14 11 25t25 11h250q14 0 25-11t10-25-10-25l-77-77q40-37 90-57t105-20q74 0 139 37t104 99q6 10 29 66 5 13 17 13h107q8 0 13-6t5-12z m14 446v-250q0-14-10-25t-26-11h-250q-14 0-25 11t-10 25 10 25l77 77q-82 77-194 77-75 0-140-37t-104-99q-6-10-29-66-5-13-17-13h-111q-7 0-13 6t-5 12v4q36 150 151 243t268 93q81 0 158-31t137-88l72 72q11 11 25 11t26-11 10-25z" horiz-adv-x="857.1" />
|
||||
<glyph glyph-name="thumbs-up" unicode="" d="m143 100q0 15-11 25t-25 11-25-11-11-25 11-25 25-11 25 11 11 25z m643 321q0 29-22 50t-50 22h-196q0 32 27 89t26 89q0 55-17 81t-72 27q-14-15-21-48t-17-70-33-61q-13-13-43-51-2-3-13-17t-18-22-19-24-22-25-22-19-22-16-20-5h-18v-357h18q7 0 18-1t18-4 21-6 20-7 20-7 16-5q118-41 191-41h67q107 0 107 93 0 15-2 31 16 9 26 30t10 41-10 38q29 28 29 67 0 13-5 31t-14 26q18 1 30 26t12 45z m71 1q0-50-27-91 5-18 5-38 0-43-21-81 1-12 1-24 0-56-33-99 0-78-48-123t-126-45h-72q-54 0-106 13t-121 36q-65 23-77 23h-161q-29 0-50 21t-21 50v357q0 30 21 51t50 21h153q20 13 77 86 32 42 60 72 13 14 19 47t17 71 35 60q22 21 50 21 47 0 84-18t57-57 20-104q0-51-27-107h98q58 0 101-42t42-100z" horiz-adv-x="857.1" />
|
||||
<glyph glyph-name="attention" unicode="" d="m571 83v106q0 8-5 13t-12 5h-108q-7 0-12-5t-5-13v-106q0-8 5-13t12-6h108q7 0 12 6t5 13z m-1 208l10 257q0 6-5 10-7 6-14 6h-122q-7 0-14-6-5-4-5-12l9-255q0-5 6-9t13-3h103q8 0 13 3t6 9z m-7 522l428-786q20-35-1-70-10-17-26-26t-35-10h-858q-18 0-35 10t-26 26q-21 35-1 70l429 786q9 17 26 27t36 10 36-10 27-27z" horiz-adv-x="1000" />
|
||||
<glyph glyph-name="menu" unicode="" d="m857 100v-71q0-15-10-25t-26-11h-785q-15 0-25 11t-11 25v71q0 15 11 25t25 11h785q15 0 26-11t10-25z m0 286v-72q0-14-10-25t-26-10h-785q-15 0-25 10t-11 25v72q0 14 11 25t25 10h785q15 0 26-10t10-25z m0 285v-71q0-15-10-25t-26-11h-785q-15 0-25 11t-11 25v71q0 15 11 26t25 10h785q15 0 26-10t10-26z" horiz-adv-x="857.1" />
|
||||
<glyph glyph-name="sliders" unicode="" d="m196 64v-71h-196v71h196z m197 72q14 0 25-11t11-25v-143q0-14-11-25t-25-11h-143q-14 0-25 11t-11 25v143q0 15 11 25t25 11h143z m89 214v-71h-482v71h482z m-357 286v-72h-125v72h125z m732-572v-71h-411v71h411z m-536 643q15 0 26-10t10-26v-142q0-15-10-26t-26-10h-142q-15 0-26 10t-10 26v142q0 15 10 26t26 10h142z m358-286q14 0 25-10t10-25v-143q0-15-10-25t-25-11h-143q-15 0-25 11t-11 25v143q0 14 11 25t25 10h143z m178-71v-71h-125v71h125z m0 286v-72h-482v72h482z" horiz-adv-x="857.1" />
|
||||
<glyph glyph-name="down-open" unicode="" d="m939 399l-414-413q-10-11-25-11t-25 11l-414 413q-11 11-11 26t11 25l92 92q11 11 26 11t25-11l296-296 296 296q11 11 25 11t26-11l92-92q11-11 11-25t-11-26z" horiz-adv-x="1000" />
|
||||
<glyph glyph-name="left-open" unicode="" d="m653 682l-296-296 296-297q11-10 11-25t-11-25l-92-93q-11-10-25-10t-25 10l-414 415q-11 10-11 25t11 25l414 414q10 10 25 10t25-10l92-93q11-10 11-25t-11-25z" horiz-adv-x="714.3" />
|
||||
<glyph glyph-name="right-open" unicode="" d="m618 361l-414-415q-11-10-25-10t-26 10l-92 93q-11 11-11 25t11 25l296 297-296 296q-11 11-11 25t11 25l92 93q11 10 26 10t25-10l414-414q10-11 10-25t-10-25z" horiz-adv-x="714.3" />
|
||||
<glyph glyph-name="up-open" unicode="" d="m939 107l-92-92q-11-10-26-10t-25 10l-296 297-296-297q-11-10-25-10t-26 10l-92 92q-11 11-11 26t11 25l414 414q11 10 25 10t25-10l414-414q11-11 11-25t-11-26z" horiz-adv-x="1000" />
|
||||
<glyph glyph-name="angle-left" unicode="" d="m350 546q0-7-6-12l-219-220 219-219q6-6 6-13t-6-13l-28-28q-5-5-12-5t-13 5l-260 260q-6 6-6 13t6 13l260 260q5 6 13 6t12-6l28-28q6-5 6-13z" horiz-adv-x="357.1" />
|
||||
<glyph glyph-name="angle-right" unicode="" d="m332 314q0-7-6-13l-260-260q-5-5-12-5t-13 5l-28 28q-6 6-6 13t6 13l219 219-219 220q-6 5-6 12t6 13l28 28q5 6 13 6t12-6l260-260q6-5 6-13z" horiz-adv-x="357.1" />
|
||||
<glyph glyph-name="angle-up" unicode="" d="m600 189q0-7-6-13l-28-27q-5-6-12-6t-13 6l-220 219-219-219q-5-6-13-6t-13 6l-27 27q-6 6-6 13t6 13l260 260q5 6 12 6t13-6l260-260q6-5 6-13z" horiz-adv-x="642.9" />
|
||||
<glyph glyph-name="angle-down" unicode="" d="m600 439q0-7-6-13l-260-260q-5-5-13-5t-12 5l-260 260q-6 6-6 13t6 13l27 28q6 6 13 6t13-6l219-219 220 219q5 6 13 6t12-6l28-28q6-5 6-13z" horiz-adv-x="642.9" />
|
||||
<glyph glyph-name="cancel" unicode="" d="m724 112q0-22-15-38l-76-76q-16-15-38-15t-38 15l-164 165-164-165q-16-15-38-15t-38 15l-76 76q-16 16-16 38t16 38l164 164-164 164q-16 16-16 38t16 38l76 76q16 16 38 16t38-16l164-164 164 164q16 16 38 16t38-16l76-76q15-15 15-38t-15-38l-164-164 164-164q15-15 15-38z" horiz-adv-x="785.7" />
|
||||
<glyph glyph-name="barre-notif" unicode="" d="m54 810c0 0 0-907 0-910 0-17-1-34 11-46 10-10 29-16 59-16h406v-14h-406c-33 0-56 7-69 20-16 16-15 37-15 56 3 146 0 108 0 910h14z" horiz-adv-x="507" />
|
||||
<glyph glyph-name="ok" unicode="" d="m528 477v119l-264 152-264-152v-119l264 153 264-153z m54-143l102 59v305l-264 152-102-59 264-152v-305l0 0z m-318 251l-264-152v-305l102-59v304l264 153-102 59z m474 68v-305l-264-152 102-60 264 153v305l-102 59z m-439-422v-118l264-153 277 161v118l-277-161-264 153z m-40 171l-102-59 0-305 264-153 102 59-264 153v305z" horiz-adv-x="881" />
|
||||
<glyph glyph-name="error" unicode="" d="m688 164l-59-102 483 0-464 788-58-102 344-583-246-1z m466-212h-719l128 209-59 102-247-413h956l-59 102z m-510 308l65 92-198 324-511-826h119l392 623 133-213z" horiz-adv-x="1213" />
|
||||
<glyph glyph-name="warning" unicode="" d="m640 661l0 0h-640v-811h124v687h516v124z m47-451h125v640h-812v-124h687v-516z m190 640v-705h-516v-106h640v811h-124z m-581-360h-107v-640h812v124h-705v516z" horiz-adv-x="1001" />
|
||||
</font>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 11 KiB |
BIN
app/assets/font/adagios-fontawesome.ttf
Normal file
BIN
app/assets/font/adagios-fontawesome.ttf
Normal file
Binary file not shown.
BIN
app/assets/font/adagios-fontawesome.woff
Normal file
BIN
app/assets/font/adagios-fontawesome.woff
Normal file
Binary file not shown.
8
app/assets/images/barre-notif.svg
Executable file
8
app/assets/images/barre-notif.svg
Executable file
@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="75.667px" height="149.167px" viewBox="5.167 4.834 75.667 149.167" enable-background="new 5.167 4.834 75.667 149.167"
|
||||
xml:space="preserve">
|
||||
<path fill="#49515C" d="M8,6c0,0-0.014,135.313-0.014,135.729c0,2.504-0.035,5.052,1.655,6.771c1.565,1.593,4.427,2.5,8.859,2.5H79
|
||||
v2H18.5c-4.997,0-8.378-0.97-10.339-2.965c-2.277-2.315-2.223-5.517-2.174-8.341C6.355,119.985,5.993,125.573,6,6H8z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 675 B |
11
app/assets/images/croix_close.svg
Executable file
11
app/assets/images/croix_close.svg
Executable file
@ -0,0 +1,11 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="15px" height="15px" viewBox="0 0 15 15" enable-background="new 0 0 15 15" xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<polygon points="14.979,0.695 14.307,0.021 7.5,6.827 0.695,0.021 0.021,0.695 6.827,7.5 0.021,14.307 0.695,14.979 7.5,8.173
|
||||
14.307,14.979 14.979,14.307 8.173,7.5 "/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 581 B |
12
app/assets/images/error.svg
Executable file
12
app/assets/images/error.svg
Executable file
@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="57.582px" height="47.475px" viewBox="0 0 57.582 47.475" enable-background="new 0 0 57.582 47.475" xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<path fill="#E84C3D" d="M32.654,32.548l-2.793,4.862l22.939-0.008L30.779,0l-2.793,4.858l16.377,27.685L32.654,32.548z
|
||||
M54.771,42.611H20.668l6.054-9.89l-2.807-4.855L12.191,47.474h45.391L54.771,42.611z M30.559,28.007l3.08-4.352L24.255,8.279
|
||||
L0,47.474h5.641l18.609-29.59L30.559,28.007z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 726 B |
11
app/assets/images/ok.svg
Executable file
11
app/assets/images/ok.svg
Executable file
@ -0,0 +1,11 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="58.25px" height="66.125px" viewBox="-1.356 -1.108 58.25 66.125" enable-background="new -1.356 -1.108 58.25 66.125"
|
||||
xml:space="preserve">
|
||||
<path fill="#87B153" d="M34.906,24.641v-7.815L17.454,6.749L0,16.825v7.815l17.453-10.076L34.906,24.641z M38.464,34.137l6.77-3.906
|
||||
V10.076L27.781,0l-6.768,3.908l17.451,10.076V34.137L38.464,34.137z M17.454,17.534L0,27.61v20.153l6.769,3.908V31.518
|
||||
l17.453-10.076L17.454,17.534z M48.771,13.049v20.152L31.318,43.278l6.768,3.907L55.539,37.11V16.956L48.771,13.049z M19.763,40.951
|
||||
v7.814l17.452,10.076l18.323-10.644v-7.813L37.215,51.025L19.763,40.951z M17.133,29.645l-6.768,3.908l-0.001,20.151l17.453,10.078
|
||||
l6.769-3.909L17.133,49.799V29.645z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 972 B |
59
app/assets/images/profil.svg
Normal file
59
app/assets/images/profil.svg
Normal file
@ -0,0 +1,59 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" id="Livello_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="100px" height="100px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve">
|
||||
<path d="M17.236,20.907c-0.013,0.162-0.027,0.325-0.035,0.489c0,0.006,0,0.012-0.002,0.019c-0.015,0.261-0.022,0.524-0.022,0.788
|
||||
c0,8.001,6.466,14.485,14.442,14.485c7.978,0,14.444-6.484,14.444-14.485c0-0.771-0.06-1.527-0.178-2.265
|
||||
c0-0.007,0-0.013-0.005-0.019c-0.045-0.297-0.105-0.592-0.168-0.882c-0.37-2.955,1.955-2.79,1.955-2.79h5.058
|
||||
c1.506,0.01,1.643,1.406,1.523,2.479c-0.098,0.396-0.178,0.798-0.242,1.205c0,0.003-0.003,0.009-0.003,0.009l0.003-0.005
|
||||
c-0.117,0.74-0.178,1.497-0.178,2.27c0,8,6.466,14.485,14.439,14.485c7.978,0,14.443-6.484,14.443-14.485
|
||||
c0-0.266-0.011-0.527-0.021-0.789c0-0.007,0-0.012,0-0.018c-0.012-0.165-0.025-0.329-0.041-0.49c0.035-2.253,3.15-1.748,3.15-1.748
|
||||
v-4.959h-1.477v-0.002H84.32c-3,0-6.615-2.958-6.615-2.958l0.002,0.005c-2.532-2.195-5.828-3.526-9.439-3.526
|
||||
c-4.595,0-8.688,2.156-11.328,5.511l0.006-0.015c0,0-2-0.183-3.764-0.477c-1.761-0.293-5.25-0.196-6.493,0
|
||||
c-1.239,0.196-3.879,0.31-3.879,0.31h-0.002c-2.645-3.251-6.677-5.33-11.186-5.33c-6.439,0-6.909,1.333-9.439,3.526V11.24
|
||||
c0,0-3.613,2.958-6.614,2.958h-1.481v4.962C14.088,19.16,17.206,18.654,17.236,20.907z M68.221,10.75
|
||||
c6.67,0,12.071,5.405,12.071,12.071s-5.401,12.071-12.071,12.071c-6.664,0-12.07-5.403-12.07-12.071
|
||||
C56.15,16.155,61.557,10.75,68.221,10.75z M31.664,10.75c6.667,0,12.072,5.405,12.072,12.071s-5.405,12.071-12.072,12.071
|
||||
c-6.664,0-12.069-5.403-12.069-12.071C19.595,16.155,25,10.75,31.664,10.75z M88.613,45.158c0.193-4.322,1.437-9.015,0.516-14.347
|
||||
c-1.132,3.375-2.33,7.115-3.458,10.197c-0.206,0.565-0.293,1.12-0.519,1.555c-0.266,0.512-0.848,0.896-1.209,1.383
|
||||
c-0.114,0.15-0.069,0.384-0.172,0.519c-0.703,0.918-1.446,1.741-2.074,2.592c-0.396,0.533-0.61,1.211-1.211,1.556
|
||||
c-1.098,0.053-2.11,0.196-3.111,0.345c0.118,1.673-0.167,2.944-0.173,4.494c-0.894,0.437-1.874,0.776-2.765,1.212
|
||||
c-0.908,2.26-1.43,4.909-2.42,7.085c-0.201-0.051-0.382-0.123-0.574-0.184c-0.078-2.45,0.473-4.686,0.227-6.89
|
||||
c-0.152-1.361-0.814-3.066-1.211-3.976c-0.307-0.7-0.738-1.778-1.036-2.248c-0.09-0.14-0.345-0.424-0.452-0.561
|
||||
c-0.168-0.209-0.264-0.294-0.41-0.476c-0.855-1.052-2.277-2.407-3.287-3.111c-0.051-0.036-0.627-0.542-0.864-0.691
|
||||
c-2.085-1.314-4.101-1.71-6.742-2.212c-1.163-0.223-2.524-0.498-3.631-0.346c-1.544,0.213-2.521,1.276-3.974,1.901
|
||||
c-0.57-0.469-1.273-0.713-1.903-1.035c-0.663-0.344-1.406-0.924-2.072-1.037c-0.861-0.145-1.732,0.074-2.593,0.173
|
||||
c-2.728,0.311-4.835,1.626-6.569,2.611c-0.353,0.199-1.814,0.269-1.902,0.309c-0.055,0.024-0.63,0.649-0.69,0.691
|
||||
c-1.231,0.851-2.27,1.716-3.113,2.748c-0.69,0.85-0.918,1.446-1.381,2.42c-0.232,0.484-0.513,0.766-0.69,1.209
|
||||
c-0.421,1.043-0.773,2.176-0.866,2.939c-0.329,2.678,0.04,5.202,0.146,7.659c-0.399,0.148-0.798,0.297-1.191,0.451
|
||||
c-0.634-2.532-1.589-4.743-2.245-7.26c-1.058-0.381-2.222-0.655-2.94-1.381c0.133-1.632-0.22-2.772-0.173-4.322
|
||||
c-1.095-0.053-2.107-0.197-3.11-0.346c-0.943-0.869-1.601-2.026-2.417-3.11c-0.788-1.04-1.839-2.044-2.42-3.284
|
||||
c-0.183-0.383-0.371-0.952-0.521-1.382c-1.188-3.423-2.117-6.773-3.458-9.854c-0.04,2.416-0.305,4.557-0.172,6.742
|
||||
c0.132,2.093,0.586,4.09,0.693,6.05c0.055,1.02-0.05,2.058,0,3.112c0.082,1.847,0.172,3.409,0.688,4.495
|
||||
c0.555,1.153,1.383,2.413,1.731,3.457c0.195,0.588,0.198,1.276,0.345,1.901c0.368,1.543,0.891,3.563,1.211,4.84
|
||||
c0.34,1.366,0.58,1.397,1.208,2.247c0.25,0.341,0.56,0.845,0.693,1.039c0.187,0.286,0.408,0.527,0.518,0.689
|
||||
c0.19,0.289,0.411,0.529,0.516,0.692c0.108,0.16,0.253,0.214,0.348,0.347c0.173,0.24,0.176,0.618,0.343,0.863
|
||||
c0.266,0.379,0.396,0.316,0.521,0.691c0.148,0.441,0.098,1.06,0.173,1.556c0.215,1.401,0.625,3.052,0.69,4.497
|
||||
c1.376,1.934,3.289,3.45,4.497,5.357c0.661,1.047,1.184,2.297,1.727,3.455c0.561,1.193,1.104,2.358,1.557,3.631
|
||||
c0.505,0.076,0.818,0.557,1.209,0.865c0.213,0.166,0.463,0.164,0.693,0.346c0.203,0.16,0.318,0.533,0.518,0.691
|
||||
c0.175,0.135,0.458,0.172,0.691,0.346c0.678,0.496,1.161,1.07,1.902,1.383c1.266,0.529,3.306,0.646,5.185,1.037
|
||||
c1.837,0.381,3.657,1.035,5.188,1.035c1.787,0,3.399-0.732,5.013-0.862c0.72,0.373,1.433,0.753,2.074,1.21
|
||||
c0.974-0.352,1.865-0.787,2.769-1.21c1.402,0.137,2.963,0.723,4.494,0.69c0.742-0.016,1.709-0.332,2.59-0.519
|
||||
c2.16-0.461,4.562-1.011,6.398-1.383c0.487-0.099,1.076-0.046,1.381-0.175c0.168-0.068,0.274-0.325,0.52-0.517
|
||||
c0.537-0.422,0.828-0.547,1.211-0.864c1.078-0.904,2.172-1.766,3.109-2.422c0.484-1.252,0.984-2.406,1.555-3.631
|
||||
c0.615-1.316,1.453-3.197,2.25-4.146c0.955-1.146,1.912-2.248,2.766-3.283c0.445-0.544,0.844-0.874,1.036-1.385
|
||||
c0.343-0.889,0.368-1.963,0.521-2.938c0.068-0.45,0.088-0.965,0.174-1.558c0.064-0.436,0.033-1.148,0.172-1.555
|
||||
c0.168-0.488,0.697-0.906,1.035-1.383c0.701-0.986,1.688-2.267,2.25-3.111c0.277-0.42,0.508-0.763,0.688-1.211
|
||||
c0.37-0.912,0.423-2.092,0.692-3.283c0.121-0.518,0.398-1.043,0.521-1.555c0.301-1.271,0.469-2.33,0.863-3.285
|
||||
c0.197-0.47,0.46-0.883,0.691-1.383c0.207-0.443,0.302-1.078,0.52-1.555c0.255-0.562,0.602-0.889,0.693-1.383
|
||||
C88.881,48.327,88.54,46.685,88.613,45.158z M67.002,59.85c-1.061,2.625-2.143,5.231-3.456,7.604
|
||||
c-1.325-0.351-2.485-0.86-3.804-1.209c-0.946,0.381-1.27,1.382-2.25,1.728c-1.012-1.138-2.202-2.445-3.456-3.283
|
||||
c-0.894-0.599-1.611-1.188-2.42-1.729c-0.179-0.12-0.308-0.374-0.519-0.52c-1.512-1.055-1.157-0.847-2.248,0
|
||||
c-0.434,0.334-0.909,0.594-1.039,0.692c-2.309,1.731-4.128,3.279-5.875,5.013c-0.854-0.474-1.345-1.308-2.248-1.729
|
||||
c-1.131,0.6-2.605,0.854-3.804,1.382c-1.241-2.562-2.332-5.274-3.631-7.776c-0.123,0.066-0.256,0.123-0.382,0.187
|
||||
c0.07-0.099,0.139-0.205,0.216-0.349c0.821-1.547,0.295-3.334,1.036-4.84c0.576-1.164,2.861-3.291,3.977-3.494
|
||||
c1.539-0.277,3.448-1.674,5.358-1.47c2.807,0.295,6.248,0.974,7.432-0.865c0.7,0.573,1.161,1.192,2.074,1.384
|
||||
c1.534,0.322,3.539-0.162,5.36-0.346c1.875-0.188,3.992-0.65,5.529-0.345c0.502,0.1,1.91,2.158,2.264,2.318
|
||||
c0.057,0.025,0.008,1.295,0.074,1.338c0.377,0.246,0.513,0.387,0.773,0.617c1.509,1.327,1.013,4.28,1.856,5.983
|
||||
C67.552,60.041,67.287,59.935,67.002,59.85z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.1 KiB |
12
app/assets/images/warning.svg
Executable file
12
app/assets/images/warning.svg
Executable file
@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="55.557px" height="55.508px" viewBox="0 0 55.557 55.508" enable-background="new 0 0 55.557 55.508" xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<path fill="#F9A13B" d="M35.529,10.467L35.529,10.467H0.001v45.041h6.894V17.361h28.635V10.467z M38.147,35.503h6.895V0H0.001
|
||||
v6.869h38.146V35.503z M48.663,0v39.146H20.026v5.895h35.529V0H48.663z M16.408,20.003h-5.896v35.505h45.043v-6.871H16.408V20.003
|
||||
z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 695 B |
@ -3,13 +3,13 @@ var SFLfront = (function() {
|
||||
|
||||
// States for UI modifications
|
||||
var state = {
|
||||
visible: 'js-is--visible',
|
||||
hidden: 'js-is--hidden',
|
||||
current: 'js-is--current',
|
||||
open: 'js-is--open',
|
||||
fadeIn: 'js-is--fadein',
|
||||
fadeOut: 'js-is--fadeout',
|
||||
hasChild: 'js-is--haschild'
|
||||
visible: 'state--visible',
|
||||
hidden: 'state--hidden',
|
||||
current: 'state--current',
|
||||
open: 'state--open',
|
||||
fadeIn: 'state--fadein',
|
||||
fadeOut: 'state--fadeout',
|
||||
hasChild: 'state--haschild'
|
||||
};
|
||||
|
||||
// Breakpoints for the responsive web design
|
||||
|
||||
@ -1,15 +1,3 @@
|
||||
//----------------------------------*\
|
||||
// FONTAWESOME
|
||||
//----------------------------------*/
|
||||
|
||||
// Rewrite Some Fontawesome Variables
|
||||
//----------------------------------*/
|
||||
$fa-font-path: '../../bower_components/fontawesome/fonts' !default;
|
||||
|
||||
// Then Import Fontawesome
|
||||
//----------------------------------*/
|
||||
@import '../../bower_components/fontawesome/scss/font-awesome.scss';
|
||||
|
||||
//----------------------------------*\
|
||||
// BOOTSTRAP MODULES
|
||||
//----------------------------------*/
|
||||
@ -39,9 +27,11 @@ $fa-font-path: '../../bower_components/fontawesome/fonts' !default;
|
||||
// GLOBAL MODULES
|
||||
//----------------------------------*/
|
||||
@import 'global/default';
|
||||
@import 'global/color-schemes';
|
||||
@import 'global/typography';
|
||||
@import 'global/iconography';
|
||||
@import 'global/helpers';
|
||||
@import 'global/layout';
|
||||
@import 'global/color-schemes';
|
||||
@import 'global/print';
|
||||
|
||||
//----------------------------------*\
|
||||
@ -53,45 +43,15 @@ $fa-font-path: '../../bower_components/fontawesome/fonts' !default;
|
||||
// OBJECT MODULES
|
||||
//----------------------------------*/
|
||||
@import 'modules-objects/togglable-tabs';
|
||||
@import 'modules-objects/problems';
|
||||
@import 'modules-objects/panes';
|
||||
@import 'modules-objects/filters';
|
||||
@import 'modules-objects/data-table';
|
||||
|
||||
//----------------------------------*\
|
||||
// INTERFACE MODULES
|
||||
//----------------------------------*/
|
||||
@import 'modules-interface/main';
|
||||
@import '../../components/topbar/topbar';
|
||||
@import '../../components/sidebar/sidebar';
|
||||
@import '../../components/tactical/tactical';
|
||||
|
||||
/* body:before { */
|
||||
/* display:none; */
|
||||
/* content: ''; */
|
||||
/* } */
|
||||
|
||||
|
||||
/* .menu { */
|
||||
/* list-style: none; */
|
||||
/* border-bottom: 0.1em solid black; */
|
||||
/* margin-bottom: 2em; */
|
||||
/* padding: 0 0 0.5em; */
|
||||
/* } */
|
||||
|
||||
/* .menu:before { */
|
||||
/* content: "["; */
|
||||
/* } */
|
||||
|
||||
/* .menu:after { */
|
||||
/* content: "]"; */
|
||||
/* } */
|
||||
|
||||
/* .menu > li { */
|
||||
/* display: inline; */
|
||||
/* } */
|
||||
|
||||
/* .menu > li:before { */
|
||||
/* content: "|"; */
|
||||
/* padding-right: 0.3em; */
|
||||
/* } */
|
||||
|
||||
/* .menu > li:nth-child(1):before { */
|
||||
/* content: ""; */
|
||||
/* padding: 0; */
|
||||
/* } */
|
||||
|
||||
@ -5,29 +5,46 @@
|
||||
// Light Scheme
|
||||
//----------------------------------*/
|
||||
.color-scheme--light {
|
||||
|
||||
%colorLink {
|
||||
color:$_color_light_epsilon;
|
||||
|
||||
&:hover {color:orange;}
|
||||
}
|
||||
|
||||
%colorBorderThin {border-color:$_color_light_gamma;}
|
||||
|
||||
%colorBkgTopbarPanel {background:$_color_light_gamma;}
|
||||
// Light scheme is not ready for now.
|
||||
}
|
||||
|
||||
// Dark Scheme
|
||||
//----------------------------------*/
|
||||
.color-scheme--dark {
|
||||
|
||||
%colorLink {
|
||||
color:$_color_dark_epsilon;
|
||||
|
||||
&:hover {color:white;}
|
||||
.color-scheme--dark {
|
||||
%colorTxtCurrent {
|
||||
color:$_color_dark_delta;
|
||||
}
|
||||
|
||||
%colorBorderThin {border-color:$_color_dark_gamma;}
|
||||
%colorHightContrast {
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
%colorBkgTopbarPanel {background:$_color_dark_gamma;}
|
||||
// For panel and the sidebar
|
||||
%colorBkgPanel {
|
||||
background:$_color_dark_alpha;
|
||||
}
|
||||
|
||||
%colorLink {
|
||||
color:$_color_dark_delta;
|
||||
|
||||
&:hover {
|
||||
color:white;
|
||||
}
|
||||
}
|
||||
|
||||
%colorBorderThin {
|
||||
border-color:$_color_dark_alpha;
|
||||
}
|
||||
|
||||
%colorBkgTopbar {
|
||||
background:$_color_dark_beta;
|
||||
}
|
||||
|
||||
%colorBkgTopbarPanel {
|
||||
background:$_color_dark_alpha;
|
||||
}
|
||||
|
||||
%colorBkgTopbarButton {
|
||||
background:$_color_dark_beta;
|
||||
}
|
||||
}
|
||||
|
||||
@ -20,22 +20,13 @@
|
||||
text-shadow:none;
|
||||
}
|
||||
|
||||
html,
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {/* color:$_color_text; */}
|
||||
|
||||
html,
|
||||
body {
|
||||
&.color-scheme--dark {background:$_color_dark_alpha;}
|
||||
|
||||
height:100%;
|
||||
min-height:100%;
|
||||
}
|
||||
|
||||
html {
|
||||
//@include line-height($_base_font_size, $_base_line_height);
|
||||
font-size:em($_base_font_size);
|
||||
font-family:$_font_family_alpha;
|
||||
-ms-text-size-adjust:100%;
|
||||
@ -43,6 +34,16 @@ html {
|
||||
}
|
||||
|
||||
body {
|
||||
&.color-scheme--dark {
|
||||
background:$_color_dark_gamma;
|
||||
color:$_color_dark_delta;
|
||||
}
|
||||
|
||||
&.color-scheme--light {
|
||||
background:$_color_light_gamma;
|
||||
color:$_color_light_delta;
|
||||
}
|
||||
|
||||
font-size:inherit;
|
||||
line-height:inherit;
|
||||
margin:0;
|
||||
@ -74,22 +75,20 @@ audio:not([controls]) {
|
||||
[hidden],
|
||||
template {display:none;}
|
||||
|
||||
a {background:transparent;}
|
||||
a {
|
||||
@extend %colorLink;
|
||||
background:transparent;
|
||||
}
|
||||
|
||||
a:focus {outline:thin dotted;}
|
||||
|
||||
a:active,
|
||||
a:hover {outline:0;}
|
||||
|
||||
h1 {
|
||||
font-size:2em;
|
||||
margin:0.67em 0;
|
||||
}
|
||||
|
||||
abbr[title] {border-bottom:1px dotted;}
|
||||
|
||||
b,
|
||||
strong {font-weight:bold;}
|
||||
strong {font-weight:700;}
|
||||
|
||||
dfn {font-style:italic;}
|
||||
|
||||
@ -116,7 +115,7 @@ pre {white-space:pre-wrap;}
|
||||
|
||||
q {quotes:"\201C" "\201D" "\2018" "\2019";}
|
||||
|
||||
small {font-size:80%;}
|
||||
small {font-size:em(10, $_base_font_size);}
|
||||
|
||||
sub,
|
||||
sup {
|
||||
@ -151,6 +150,7 @@ button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
@extend %colorTxtCurrent;
|
||||
font-family:inherit;
|
||||
font-size:100%;
|
||||
margin:0;
|
||||
@ -205,10 +205,25 @@ table {
|
||||
border-spacing:0;
|
||||
}
|
||||
|
||||
td,
|
||||
th {text-align:left;}
|
||||
|
||||
thead {
|
||||
th {padding:0 0 $_space_narrow;}
|
||||
}
|
||||
|
||||
tbody {
|
||||
td,
|
||||
th {padding:$_space_narrow 0;}
|
||||
}
|
||||
|
||||
menu,
|
||||
nav {
|
||||
a {text-decoration:none;}
|
||||
margin:0;
|
||||
padding:0;
|
||||
|
||||
a {text-decoration:none;}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
list-style-type:none;
|
||||
|
||||
@ -110,11 +110,15 @@ body:after {
|
||||
}
|
||||
|
||||
//----------------------------------*\
|
||||
// JAVASCRIPT CLASSES
|
||||
// STATES CLASSES
|
||||
//----------------------------------*/
|
||||
|
||||
.js-is--hidden {display:none;}
|
||||
.js-is--visible {display:block;}
|
||||
//.js-is--current {}
|
||||
//.js-is--open {}
|
||||
//.js-is--close {}
|
||||
.state--hidden {display:none;}
|
||||
.state--visible {display:block;}
|
||||
/* .state--current {} */
|
||||
/* .state--hasChild {} */
|
||||
/* .state--open {} */
|
||||
/* .state--close {} */
|
||||
/* .state--error {} */
|
||||
/* .state--warning {} */
|
||||
/* .state--ok {} */
|
||||
/* etc. */
|
||||
|
||||
94
app/assets/sass/global/_iconography.scss
Normal file
94
app/assets/sass/global/_iconography.scss
Normal file
File diff suppressed because one or more lines are too long
@ -5,80 +5,46 @@
|
||||
display:table;
|
||||
min-height:100%;
|
||||
width:100%;
|
||||
|
||||
.flexbox & {
|
||||
display:flex;
|
||||
min-height:100vh;
|
||||
flex-direction:column;
|
||||
}
|
||||
}
|
||||
|
||||
.layout__container {
|
||||
//background:yellow;
|
||||
display:table-row;
|
||||
min-height:100%;
|
||||
|
||||
.flexbox & {
|
||||
display:block; /* IE fix */
|
||||
display:flex;
|
||||
flex:1;
|
||||
flex-direction:row;
|
||||
}
|
||||
}
|
||||
|
||||
.layout__main {
|
||||
display:table-cell;
|
||||
//min-width:320px;
|
||||
vertical-align:top;
|
||||
width:100%;
|
||||
|
||||
.flexbox & {
|
||||
display:block; /* IE fix */
|
||||
flex:1;
|
||||
}
|
||||
}
|
||||
|
||||
.layout__aside {
|
||||
//background:red;
|
||||
display:table-cell;
|
||||
min-height:100%;
|
||||
min-width:320px;
|
||||
vertical-align:top;
|
||||
width:320px;
|
||||
|
||||
.flexbox & {
|
||||
display:block;
|
||||
}
|
||||
|
||||
@include large-xlarge-screen {
|
||||
min-width:250px;
|
||||
width:250px;
|
||||
}
|
||||
/* */
|
||||
|
||||
&.collapse {
|
||||
display:none;
|
||||
visibility:hidden;
|
||||
|
||||
&.in {
|
||||
display:block;
|
||||
display:table-cell;
|
||||
visibility:visible;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.layout__row {
|
||||
/* background:black; */
|
||||
margin-bottom:1em;
|
||||
}
|
||||
.layout__full {width:100%;}
|
||||
|
||||
.layout__flexrow {
|
||||
/* background:yellow; */
|
||||
.layout__half {width:50%;}
|
||||
|
||||
/* > :nth-child(even) {background-color:aquamarine;} */
|
||||
/* > :nth-child(odd) {background-color:pink;} */
|
||||
.layout__third {width:33.333333333%;}
|
||||
|
||||
.flexbox & {
|
||||
display:flex;
|
||||
flex-direction:row;
|
||||
}
|
||||
}
|
||||
.layout__quarter {width:25%;}
|
||||
|
||||
49
app/assets/sass/global/_typography.scss
Normal file
49
app/assets/sass/global/_typography.scss
Normal file
@ -0,0 +1,49 @@
|
||||
//----------------------------------*\
|
||||
// TYPOGRAPHY
|
||||
//----------------------------------*/
|
||||
%typo-logo-title {
|
||||
font:400 em(26, $_base_font_size)(/ 1) $_font_family_alpha;
|
||||
text-transform:uppercase;
|
||||
// Tracking 300 PSD = Combien en letterspacing CSS ?
|
||||
}
|
||||
|
||||
|
||||
%typo-title {font:400 em(24, $_base_font_size)(/ 1) $_font_family_alpha;}
|
||||
|
||||
%typo-subtitle {font:700 em(14, $_base_font_size)(/ 1) $_font_family_alpha;}
|
||||
|
||||
%typo-header-table {
|
||||
font:400 em(14, $_base_font_size)(/ 1) $_font_family_alpha;
|
||||
text-transform:uppercase;
|
||||
}
|
||||
|
||||
%typo-current-text {font:400 em(14, $_base_font_size)(/ 1) $_font_family_alpha;}
|
||||
|
||||
%typo-more-info {font:italic 400 em(14, $_base_font_size)(/ 1) $_font_family_alpha;}
|
||||
|
||||
%typo-more-info--little {font:400 em(12, $_base_font_size)(/ 1) $_font_family_alpha;}
|
||||
|
||||
%typo-menu {font:400 em(14, $_base_font_size)(/ 1) $_font_family_alpha;}
|
||||
|
||||
/* h1, h2, h3, h4, h5, h6 {margin:0;} */
|
||||
|
||||
h1,
|
||||
.like-h1 {@extend %typo-logo-title;}
|
||||
|
||||
h2,
|
||||
.like-h2 {
|
||||
@extend %typo-title;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
/* h3, */
|
||||
/* .like-h3 {} */
|
||||
|
||||
/* h4, */
|
||||
/* .like-h4 {} */
|
||||
|
||||
/* h5, */
|
||||
/* .like-h5 {} */
|
||||
|
||||
/* h6, */
|
||||
/* .like-h6 {} */
|
||||
155
app/assets/sass/modules-interface/_main.scss
Normal file
155
app/assets/sass/modules-interface/_main.scss
Normal file
@ -0,0 +1,155 @@
|
||||
//----------------------------------*\
|
||||
// MAIN BLOCK INTERFACE
|
||||
//----------------------------------*/
|
||||
|
||||
.main[role="main"] {}
|
||||
|
||||
.main__overview {
|
||||
padding:$_space $_space_narrow $_space_narrow;
|
||||
position:relative;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
padding:$_space;
|
||||
}
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_beta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_beta;
|
||||
}
|
||||
|
||||
table {width:100%;}
|
||||
|
||||
td,
|
||||
th {
|
||||
text-align:right;
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_alpha;
|
||||
}
|
||||
|
||||
&:first-child {text-align:left;}
|
||||
|
||||
&.state--error {color:$_color_error;}
|
||||
&.state--warning {color:$_color_warning;}
|
||||
&.state--ok {color:$_color_ok;}
|
||||
}
|
||||
|
||||
thead th {
|
||||
@extend %typo-subtitle;
|
||||
|
||||
&:first-child {
|
||||
.color-scheme--dark & {
|
||||
color:$_color_dark_alpha;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_light_alpha;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
td,
|
||||
th {
|
||||
border-top-style:solid;
|
||||
border-top-width:1px;
|
||||
|
||||
.color-scheme--dark & {
|
||||
border-top-color:$_color_dark_beta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
border-top-color:$_color_light_beta;
|
||||
}
|
||||
}
|
||||
|
||||
tr:first-child {
|
||||
td,
|
||||
th {border-top:0;}
|
||||
}
|
||||
|
||||
th {@extend %typo-header-table;}
|
||||
}
|
||||
}
|
||||
|
||||
.main__overview__title {
|
||||
margin-bottom:$_space_narrow;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
margin-bottom:$_space;
|
||||
}
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_alpha;
|
||||
}
|
||||
}
|
||||
|
||||
.main__content {
|
||||
padding:$_space $_space_narrow;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
padding:$_space;
|
||||
}
|
||||
|
||||
// Togglable tabs variations
|
||||
.tablist {margin-bottom:$_space;}
|
||||
|
||||
.tabpanel__tab {
|
||||
font-size:1em;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
font-size:em(24, $_base_font_size);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main__content__header {
|
||||
|
||||
.main__content__title,
|
||||
.main__content__alert {
|
||||
|
||||
@include large-xlarge-screen {
|
||||
float:left;
|
||||
margin-top:0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main__content__title {
|
||||
margin-right:$_space_narrow;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
display:inline-block;
|
||||
}
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_alpha;
|
||||
}
|
||||
}
|
||||
|
||||
.main__content__alert {
|
||||
@extend %typo-more-info;
|
||||
background:$_color_ok;
|
||||
color:$_color_omega;
|
||||
display:inline-block;
|
||||
padding:8px 11px;
|
||||
|
||||
&.state--error {background:$_color_error;}
|
||||
&.state--warning {background:$_color_warning;}
|
||||
&.state--ok {background:$_color_ok;}
|
||||
}
|
||||
165
app/assets/sass/modules-objects/_data-table.scss
Normal file
165
app/assets/sass/modules-objects/_data-table.scss
Normal file
@ -0,0 +1,165 @@
|
||||
//----------------------------------*\
|
||||
// DATA TABLE
|
||||
//----------------------------------*/
|
||||
|
||||
.data-table {
|
||||
width:100%;
|
||||
|
||||
input[type="checkbox"] {background:red;}
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_alpha;
|
||||
}
|
||||
|
||||
a {
|
||||
display:inline-block;
|
||||
text-decoration:none;
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_alpha;
|
||||
}
|
||||
}
|
||||
|
||||
td, th {
|
||||
border-style:solid;
|
||||
border-width:0 0 1px;
|
||||
padding-left:$_space_narrow;
|
||||
padding-right:$_space_narrow;
|
||||
vertical-align:top;
|
||||
|
||||
.color-scheme--dark & {
|
||||
border-color:$_color_dark_beta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
border-color:$_color_light_beta;
|
||||
}
|
||||
}
|
||||
|
||||
thead {
|
||||
th {
|
||||
border-style:solid;
|
||||
border-width:0 0 0 1px;
|
||||
padding-top:$_space_narrow;
|
||||
vertical-align:middle;
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_beta;
|
||||
border-color:$_color_dark_gamma;
|
||||
|
||||
&.state--current {background:$_color_dark_alpha;}
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_beta;
|
||||
border-color:$_color_light_gamma;
|
||||
|
||||
&.state--current {background:$_color_light_alpha;}
|
||||
}
|
||||
|
||||
&.data-table__host,
|
||||
&.data-table__checkbox {border:0;}
|
||||
}
|
||||
}
|
||||
|
||||
.state--hasChild,
|
||||
.state--isChild {
|
||||
|
||||
td, th {
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_beta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_beta;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.data-table__data {
|
||||
margin:0;
|
||||
|
||||
.state--error &,
|
||||
.state--warning &,
|
||||
.state--ok & {
|
||||
position:relative;
|
||||
|
||||
&:before {
|
||||
top:0;
|
||||
font-family:"adagios-fontawesome";
|
||||
left:0;
|
||||
position:absolute;
|
||||
z-index:988888;
|
||||
}
|
||||
}
|
||||
|
||||
.state--error & {
|
||||
@extend .ico-error;
|
||||
padding-left:(16 + $_space_narrow);
|
||||
|
||||
&:before {
|
||||
color:$_color_error;
|
||||
font-size:em(13, $_base_font_size);
|
||||
}
|
||||
}
|
||||
|
||||
.state--warning & {
|
||||
@extend .ico-warning;
|
||||
padding-left:(16 + $_space_narrow);
|
||||
|
||||
&:before {
|
||||
color:$_color_warning;
|
||||
font-size:em(16, $_base_font_size);
|
||||
}
|
||||
}
|
||||
|
||||
.state--ok & {
|
||||
@extend .ico-ok;
|
||||
padding-left:(18 + $_space_narrow);
|
||||
|
||||
&:before {
|
||||
color:$_color_ok;
|
||||
font-size:em(20, $_base_font_size);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.data-table__checkbox {width:auto;}
|
||||
|
||||
.data-table__host {width:percentage(367 / 1200);}
|
||||
|
||||
.data-table__service__summary,
|
||||
.data-table__duration,
|
||||
.data-table__lastcheck {
|
||||
@extend %typo-more-info--little;
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_dark_delta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_light_delta;
|
||||
}
|
||||
}
|
||||
|
||||
.data-table__service {
|
||||
width:percentage(501 / 1200);
|
||||
//.data-table__service__name {}
|
||||
|
||||
.data-table__service__summary {
|
||||
font-style:italic;
|
||||
margin-left:0;
|
||||
}
|
||||
}
|
||||
|
||||
.data-table__duration {width:percentage(166 / 1200);}
|
||||
128
app/assets/sass/modules-objects/_filters.scss
Normal file
128
app/assets/sass/modules-objects/_filters.scss
Normal file
@ -0,0 +1,128 @@
|
||||
//----------------------------------*\
|
||||
// FILTERS
|
||||
//----------------------------------*/
|
||||
.filters__list {
|
||||
border-style:solid;
|
||||
border-width:1px 0;
|
||||
position:relative;
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_gamma;
|
||||
border-color:$_color_dark_beta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_gamma;
|
||||
border-color:$_color_light_beta;
|
||||
}
|
||||
}
|
||||
|
||||
.filters__item {
|
||||
display:inline-block;
|
||||
float:left;
|
||||
position:relative;
|
||||
|
||||
&.filters__item--settings {float:right;}
|
||||
}
|
||||
|
||||
.filters__sublist {
|
||||
padding:$_space_narrow;
|
||||
|
||||
.filters__item,
|
||||
.filters__subitem {display:block;}
|
||||
}
|
||||
|
||||
|
||||
.filters__button {
|
||||
@extend %button-reset;
|
||||
@extend %colorLink;
|
||||
border-style:solid;
|
||||
border-width:0 0 0 1px;
|
||||
display:block;
|
||||
min-height:56px;
|
||||
padding:0 $_space_narrow;
|
||||
position:relative;
|
||||
width:auto;
|
||||
|
||||
.color-scheme--dark & {
|
||||
border-color:$_color_dark_beta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
border-color:$_color_light_beta;
|
||||
}
|
||||
|
||||
.filters__item--more &,
|
||||
.filters__item--settings & {border-right-width:1px;}
|
||||
|
||||
.filters__item--problems & {
|
||||
min-width:180px;
|
||||
text-align:left;
|
||||
|
||||
.ico-down-dir {float:right;}
|
||||
}
|
||||
|
||||
.filters__item--more & {
|
||||
min-width:87px;
|
||||
text-align:left;
|
||||
text-transform:lowercase;
|
||||
|
||||
.ico-down-dir {
|
||||
float:right;
|
||||
}
|
||||
}
|
||||
|
||||
&[aria-expanded="true"],
|
||||
&:hover {
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_beta;
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_beta;
|
||||
color:$_color_alpha;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.filters__panel {
|
||||
left:0;
|
||||
min-width:100%;
|
||||
position:absolute;
|
||||
top:100%;
|
||||
z-index:999999;
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_beta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_beta;
|
||||
}
|
||||
|
||||
.filters__item--more & {
|
||||
display:block;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
display:inline;
|
||||
}
|
||||
}
|
||||
|
||||
.filters__item--settings & {
|
||||
left:auto;
|
||||
right:0;
|
||||
}
|
||||
}
|
||||
|
||||
.filters__link {
|
||||
&.state--current {
|
||||
.color-scheme--dark & {
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_alpha;
|
||||
}
|
||||
}
|
||||
}
|
||||
42
app/assets/sass/modules-objects/_panes.scss
Normal file
42
app/assets/sass/modules-objects/_panes.scss
Normal file
@ -0,0 +1,42 @@
|
||||
//----------------------------------*\
|
||||
// PANES
|
||||
//----------------------------------*/
|
||||
.panes {
|
||||
background:aquamarine;
|
||||
display:table;
|
||||
width:100%;
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_gamma;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_gamma;
|
||||
}
|
||||
}
|
||||
|
||||
.panes__pane {
|
||||
//background:blue;
|
||||
border-style:solid;
|
||||
border-width:0 0 0 1px;
|
||||
display:table-cell;
|
||||
padding:$_space_narrow;
|
||||
|
||||
&:first-child {border-left:0;}
|
||||
|
||||
@include large-xlarge-screen {
|
||||
padding:$_space;
|
||||
}
|
||||
|
||||
.color-scheme--dark & {
|
||||
border-color:$_color_dark_beta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
border-color:$_color_light_beta;
|
||||
}
|
||||
|
||||
.panes--2 & {width:50%;}
|
||||
|
||||
.panes--3 & {width:33.333333333%;}
|
||||
}
|
||||
179
app/assets/sass/modules-objects/_problems.scss
Normal file
179
app/assets/sass/modules-objects/_problems.scss
Normal file
@ -0,0 +1,179 @@
|
||||
//----------------------------------*\
|
||||
// PROBLEMS LIST AND TABLE
|
||||
//----------------------------------*/
|
||||
.problems__list {
|
||||
margin-bottom:$_space;
|
||||
|
||||
.state--error,
|
||||
.state--warning,
|
||||
.state--ok {
|
||||
position:relative;
|
||||
|
||||
&:before {
|
||||
top:0;
|
||||
font-family:"adagios-fontawesome";
|
||||
left:0;
|
||||
position:absolute;
|
||||
z-index:988888;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.state--error {
|
||||
@extend .ico-error;
|
||||
|
||||
&:before {
|
||||
color:$_color_error;
|
||||
font-size:em(13, $_base_font_size);
|
||||
}
|
||||
}
|
||||
|
||||
.state--warning {
|
||||
@extend .ico-warning;
|
||||
|
||||
&:before {
|
||||
color:$_color_warning;
|
||||
font-size:em(16, $_base_font_size);
|
||||
}
|
||||
}
|
||||
|
||||
.state--ok {
|
||||
@extend .ico-ok;
|
||||
|
||||
&:before {
|
||||
color:$_color_ok;
|
||||
font-size:em(20, $_base_font_size);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.problems__item {
|
||||
border-top:1px solid;
|
||||
padding-top:$_space_narrow;
|
||||
|
||||
.color-scheme--dark & {
|
||||
border-color:$_color_dark_gamma;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
border-color:$_color_light_gamma;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
border-top:0;
|
||||
padding-top:0;
|
||||
}
|
||||
}
|
||||
|
||||
.problems__host,
|
||||
.problems__name,
|
||||
.problems__description {padding-left:25px;}
|
||||
|
||||
.problems__host,
|
||||
.problems__name {
|
||||
font-weight:normal;
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_alpha;
|
||||
}
|
||||
}
|
||||
|
||||
.problems__name,
|
||||
.problems__description {margin-left:25px;}
|
||||
|
||||
.problems__host,
|
||||
.problems__description {margin-bottom:$_space_narrow;}
|
||||
|
||||
.problems__host {display:block;}
|
||||
|
||||
.problems__desclist {
|
||||
position:relative;
|
||||
|
||||
&:before {
|
||||
background:$_color_dark_gamma;
|
||||
content:"";
|
||||
display:block;
|
||||
height:calc(100% - 2.143em);
|
||||
left:8px;
|
||||
position:absolute;
|
||||
top:0;
|
||||
width:1px;
|
||||
}
|
||||
}
|
||||
|
||||
.problems__name {
|
||||
&:after {
|
||||
background:transparent;
|
||||
border:1px solid;
|
||||
border-radius:0 0 0 5px;
|
||||
content:"";
|
||||
display:block;
|
||||
height:24px;
|
||||
left:-17px;
|
||||
position:absolute;
|
||||
top:-18px;
|
||||
width:20px;
|
||||
|
||||
.color-scheme--dark & {
|
||||
border-color:transparent transparent $_color_dark_gamma $_color_dark_gamma;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
border-color:transparent transparent $_color_light_gamma $_color_light_gamma;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
display:inline-block;
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.problems__duration {
|
||||
display:none;
|
||||
float:right;
|
||||
|
||||
@include medium-and-up-screen {
|
||||
display:inline-block;
|
||||
}
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_dark_delta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_light_delta;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.problems__description {
|
||||
@extend %typo-more-info--little;
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.problems__viewall {
|
||||
@extend %button-reset;
|
||||
@extend %typo-more-info;
|
||||
display:block;
|
||||
padding:$_space_narrow;
|
||||
text-align:center;
|
||||
width:100%;
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_gamma;
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_gamma;
|
||||
color:$_color_alpha;
|
||||
}
|
||||
}
|
||||
@ -1,20 +1,49 @@
|
||||
//----------------------------------*\
|
||||
// TOGGLABLE TABS
|
||||
//----------------------------------*/
|
||||
/* */
|
||||
.tabpanel {
|
||||
.tablist__item {
|
||||
display:inline-block;
|
||||
.tablist {}
|
||||
|
||||
.tablist__item {
|
||||
display:block;
|
||||
float:left;
|
||||
width:50%;
|
||||
}
|
||||
|
||||
.tabpanel__tab {
|
||||
border-style:solid;
|
||||
border-width:0 0 1px;
|
||||
display:block;
|
||||
line-height:1;
|
||||
margin:0 0 0 ($_space / 3);
|
||||
padding:0 $_space .5em 0;
|
||||
position:relative;
|
||||
text-decoration:none;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
margin:0 0 0 $_space;
|
||||
}
|
||||
|
||||
.tabpanel__tab {
|
||||
color:white;
|
||||
border-bottom:5px solid white;
|
||||
width:50%;
|
||||
|
||||
&[aria-expanded="true"] {
|
||||
border-width:0 0 3px;
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
:first-child > & {margin:0;}
|
||||
|
||||
&:after {
|
||||
bottom:em($_base_font_size);
|
||||
content:attr(data-problems);
|
||||
display:inline-block;
|
||||
font-size:em(10, $_base_font_size);
|
||||
position:absolute;
|
||||
right:0;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
clear:both;
|
||||
padding:$_space 0 $_space_narrow;
|
||||
|
||||
> .tab-pane {
|
||||
display:none;
|
||||
visibility:hidden;
|
||||
|
||||
@ -1,37 +1,37 @@
|
||||
//----------------------------------*\
|
||||
// VARIABLES
|
||||
// DEFAULT VARIABLES
|
||||
//----------------------------------*/
|
||||
|
||||
// Image Path
|
||||
//----------------------------------*/
|
||||
$_img_path: "../images/" !default;
|
||||
|
||||
// Color Schemes
|
||||
// Colors
|
||||
//----------------------------------*/
|
||||
// Light scheme
|
||||
$_color_light_alpha: '' !default;
|
||||
$_color_light_beta: '' !default;
|
||||
$_color_light_gamma: '' !default;
|
||||
$_color_light_delta: '' !default;
|
||||
$_color_light_epsilon: red !default;
|
||||
$_color_light_delta: red !default;
|
||||
|
||||
// Dark scheme
|
||||
$_color_dark_alpha: #353D48 !default;
|
||||
$_color_dark_beta: #49515C !default;
|
||||
$_color_dark_gamma: #23282E !default;
|
||||
$_color_dark_delta: #2e353d !default;
|
||||
$_color_dark_epsilon: #aeb5bf !default;
|
||||
$_color_dark_alpha: #252C35 !default;
|
||||
$_color_dark_beta: #353D48 !default;
|
||||
$_color_dark_gamma: #49515C !default;
|
||||
$_color_dark_delta: #A2AAB4 !default;
|
||||
|
||||
// Typography
|
||||
$_base_font_size: 14 !default;
|
||||
$_base_line_height: 18 !default;
|
||||
// Black and White
|
||||
$_color_alpha: #000 !default;
|
||||
$_color_omega: #FFF !default;
|
||||
|
||||
// Colors for states
|
||||
$_color_error: #E84C3D !default;
|
||||
$_color_warning: #F9A13B !default;
|
||||
$_color_ok: #81A854 !default;
|
||||
|
||||
// Fonts Family
|
||||
//----------------------------------*/
|
||||
$_font_family_alpha: sans-serif !default;
|
||||
$_font_family_beta: sans-serif !default;
|
||||
$_font_family_gamma: serif !default;
|
||||
|
||||
$_font_family_alpha: 'Roboto', sans-serif !default; // fonts.googleapis.com/css?family=Roboto
|
||||
|
||||
// Media Queries Breakpoints
|
||||
//----------------------------------*/
|
||||
@ -40,3 +40,13 @@ $_screen_small: 480 !default;
|
||||
$_screen_medium: 768 !default;
|
||||
$_screen_large: 992 !default;
|
||||
$_screen_xlarge: 1200 !default;
|
||||
|
||||
// Typography
|
||||
//----------------------------------*/
|
||||
$_base_font_size: 14 !default;
|
||||
$_base_line_height: 18 !default;
|
||||
|
||||
// X Y Rhythm
|
||||
//----------------------------------*/
|
||||
$_space:30px !default;
|
||||
$_space_narrow:15px !default;
|
||||
|
||||
@ -1,148 +1,244 @@
|
||||
//----------------------------------*\
|
||||
// SIDEBAR
|
||||
//----------------------------------*/
|
||||
.sidebar-wrapper {
|
||||
//.color-scheme--dark & {background:$_color_dark_delta;}
|
||||
@extend %colorBkgPanel;
|
||||
padding-bottom:em(72+$_space, $_base_font_size);
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.nav-side-menu {
|
||||
//overflow: auto;
|
||||
font-family: verdana;
|
||||
font-size: 12px;
|
||||
font-weight: 200;
|
||||
//position: fixed;
|
||||
//top: 0px;
|
||||
//height: 100%;
|
||||
color: #e1ffff;
|
||||
//.sidebar {}
|
||||
|
||||
.sidebar__close {
|
||||
@extend %button-reset;
|
||||
display:block;
|
||||
font-size:em(15, $_base_font_size);
|
||||
height:45px;
|
||||
margin:0 auto;
|
||||
text-align:center;
|
||||
width:45px;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_beta;
|
||||
color:$_color_omega;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_beta;
|
||||
color:$_color_alpha;
|
||||
}
|
||||
|
||||
.no-js & {display:none;}
|
||||
}
|
||||
|
||||
.nav-side-menu .brand {
|
||||
background-color: #23282e;
|
||||
line-height: 50px;
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
.sidebar__header {
|
||||
text-align:center;
|
||||
|
||||
padding:$_space $_space_narrow;
|
||||
|
||||
|
||||
@include large-xlarge-screen {
|
||||
padding:$_space $_space;
|
||||
}
|
||||
}
|
||||
.nav-side-menu .toggle-btn {
|
||||
display: none;
|
||||
|
||||
.sidebar__appname {
|
||||
@extend %colorHightContrast;
|
||||
margin:0;
|
||||
}
|
||||
.nav-side-menu ul,
|
||||
.nav-side-menu li {
|
||||
list-style: none;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
line-height: 35px;
|
||||
cursor: pointer;
|
||||
/*
|
||||
.collapsed{
|
||||
.arrow:before{
|
||||
font-family: FontAwesome;
|
||||
content: "\f053";
|
||||
display: inline-block;
|
||||
padding-left:10px;
|
||||
padding-right: 10px;
|
||||
vertical-align: middle;
|
||||
float:right;
|
||||
|
||||
.sidebar__date {
|
||||
@extend %typo-more-info--little;
|
||||
display:block;
|
||||
margin-top:$_space_narrow;
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_dark_gamma;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_light_gamma;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar__nav {}
|
||||
|
||||
.sidebar__item {
|
||||
border-top:1px solid;
|
||||
margin-bottom:$_space;
|
||||
|
||||
.color-scheme--dark & {
|
||||
border-top-color:$_color_dark_gamma;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
border-top-color:$_color_light_gamma;
|
||||
}
|
||||
|
||||
&:first-child {border:0;}
|
||||
}
|
||||
|
||||
.sidebar__category {
|
||||
@extend %typo-title;
|
||||
display:block;
|
||||
position:relative;
|
||||
padding:$_space $_space_narrow 0 $_space;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
padding:$_space $_space 0;
|
||||
}
|
||||
|
||||
.js & {
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_dark_gamma;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_light_gamma;
|
||||
}
|
||||
|
||||
.sidebar__item:first-child & {padding-top:0;}
|
||||
|
||||
&:after {
|
||||
@extend %ico;
|
||||
content:"\e801";
|
||||
display:inline-block;
|
||||
font-size:1em;
|
||||
position:absolute;
|
||||
right:$_space_narrow;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
right:$_space;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar__sublist {
|
||||
padding:0 $_space_narrow 0 $_space;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
padding:0 $_space;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar__subitem {
|
||||
@extend %typo-menu;
|
||||
margin-top:$_space;
|
||||
|
||||
.state--current {
|
||||
color:$_color_omega;
|
||||
position:relative;
|
||||
|
||||
&:before {
|
||||
@extend %ico;
|
||||
content:"\e812";
|
||||
display:inline-block;
|
||||
font-size:em(8, $_base_font_size);
|
||||
left:-$_space_narrow;
|
||||
margin-top:-0.5em;
|
||||
position:absolute;
|
||||
top:50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar__profile {
|
||||
bottom:0;
|
||||
left:0;
|
||||
padding:0 $_space_narrow 0 $_space;
|
||||
position:absolute;
|
||||
right:0;
|
||||
|
||||
@include large-xlarge-screen {
|
||||
padding:0 $_space;
|
||||
}
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_beta;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_beta;
|
||||
}
|
||||
|
||||
.sidebar__profile__toggle {
|
||||
@extend %typo-more-info--little;
|
||||
color:$_color_omega;
|
||||
display:block;
|
||||
line-height:72px;
|
||||
min-height:72px;
|
||||
padding-left:(36+15) + px;
|
||||
position:relative;
|
||||
text-decoration:none;
|
||||
|
||||
&:after {
|
||||
@extend %ico;
|
||||
content:"\e809";
|
||||
display:inline-block;
|
||||
position:absolute;
|
||||
right:0;
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_omega;
|
||||
}
|
||||
}
|
||||
*/
|
||||
}
|
||||
.nav-side-menu ul :not(collapsed) .arrow:before,
|
||||
.nav-side-menu li :not(collapsed) .arrow:before {
|
||||
font-family: FontAwesome;
|
||||
content: "\f078";
|
||||
display: inline-block;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
vertical-align: middle;
|
||||
float: right;
|
||||
}
|
||||
.nav-side-menu ul .active,
|
||||
.nav-side-menu li .active {
|
||||
border-left: 3px solid #d19b3d;
|
||||
background-color: #4f5b69;
|
||||
}
|
||||
.nav-side-menu ul .sub-menu li.active,
|
||||
.nav-side-menu li .sub-menu li.active {
|
||||
color: #d19b3d;
|
||||
}
|
||||
.nav-side-menu ul .sub-menu li.active a,
|
||||
.nav-side-menu li .sub-menu li.active a {
|
||||
color: #d19b3d;
|
||||
}
|
||||
.nav-side-menu ul .sub-menu li,
|
||||
.nav-side-menu li .sub-menu li {
|
||||
background-color: #181c20;
|
||||
border: none;
|
||||
line-height: 28px;
|
||||
border-bottom: 1px solid #23282e;
|
||||
margin-left: 0px;
|
||||
}
|
||||
.nav-side-menu ul .sub-menu li:hover,
|
||||
.nav-side-menu li .sub-menu li:hover {
|
||||
background-color: #020203;
|
||||
}
|
||||
.nav-side-menu ul .sub-menu li:before,
|
||||
.nav-side-menu li .sub-menu li:before {
|
||||
font-family: FontAwesome;
|
||||
content: "\f105";
|
||||
display: inline-block;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.nav-side-menu li {
|
||||
padding-left: 0px;
|
||||
border-left: 3px solid #2e353d;
|
||||
border-bottom: 1px solid #23282e;
|
||||
}
|
||||
.nav-side-menu li a {
|
||||
text-decoration: none;
|
||||
color: #e1ffff;
|
||||
}
|
||||
.nav-side-menu li a i {
|
||||
padding-left: 10px;
|
||||
width: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
.nav-side-menu li:hover {
|
||||
border-left: 3px solid #d19b3d;
|
||||
background-color: #4f5b69;
|
||||
-webkit-transition: all 1s ease;
|
||||
-moz-transition: all 1s ease;
|
||||
-o-transition: all 1s ease;
|
||||
-ms-transition: all 1s ease;
|
||||
transition: all 1s ease;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.nav-side-menu {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.nav-side-menu .toggle-btn {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
z-index: 10 !important;
|
||||
padding: 3px;
|
||||
background-color: #ffffff;
|
||||
color: #000;
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
.brand {
|
||||
text-align: left !important;
|
||||
font-size: 22px;
|
||||
padding-left: 20px;
|
||||
line-height: 50px !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 767px) {
|
||||
.nav-side-menu .menu-list .menu-content {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
body {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_alpha;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar__profile__name {
|
||||
display:inline-block;
|
||||
line-height:em(18, 12);
|
||||
vertical-align:middle;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
display:block;
|
||||
position:absolute;
|
||||
}
|
||||
|
||||
&:before {
|
||||
border-radius:100%;
|
||||
content:"";
|
||||
height:36px;
|
||||
left:0;
|
||||
top:18px;
|
||||
width:36px;
|
||||
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_gamma;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_gamma;
|
||||
}
|
||||
}
|
||||
|
||||
&:after {
|
||||
@extend %ico;
|
||||
content:"\e800";
|
||||
font-size:em(24, $_base_font_size);
|
||||
left:7px;
|
||||
position:absolute;
|
||||
top:28px;
|
||||
|
||||
.color-scheme--dark & {
|
||||
color:$_color_dark_alpha;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
color:$_color_light_alpha;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
@ -1,56 +1,59 @@
|
||||
<div nv-app="adagios.sidebar" class="nav-side-menu" ng-controller="SideBarCtrl">
|
||||
<div class="brand">ADAGIOS</div>
|
||||
<div class="menu-list">
|
||||
|
||||
<ul id="menu-content" class="menu-content out">
|
||||
<li class="menu-title">
|
||||
<a href="#"> Shortcut <span class="arrow"></span></a>
|
||||
<ul class="sub-menu" id="shortcut">
|
||||
<li><a href="#/dashboard">Dashboard</a></li>
|
||||
<li><a href="#/hosts">Hosts</a></li>
|
||||
<li><a href="#/services">Services</a></li>
|
||||
<li><a href="#">Networks parents</a></li>
|
||||
<div ng-app="adagios.sidebar" class="sidebar" ng-controller="SideBarCtrl">
|
||||
<button class="sidebar__close">
|
||||
<span class="visuallyhidden">Close the sidebar</span>
|
||||
<i class="ico-cancel"></i>
|
||||
</button>
|
||||
|
||||
<header class="sidebar__header">
|
||||
<h1 class="sidebar__appname">ADAGIOS</h1>
|
||||
<time class="sidebar__date" datetime="2014-11-24 16:04">24 nov. 16:04</time>
|
||||
</header>
|
||||
|
||||
<nav class="sidebar__nav" role="navigation">
|
||||
<ul class="sidebar__list" id="sidebarList">
|
||||
<li class="sidebar__item">
|
||||
<span class="sidebar__category">Shortcut</span>
|
||||
|
||||
<ul class="sidebar__sublist" id="shortcutList">
|
||||
<li class="sidebar__subitem"><a class="state--current" href="#/dashboard">Dashboard</a></li>
|
||||
<li class="sidebar__subitem"><a href="#/hosts">Hosts</a></li>
|
||||
<li class="sidebar__subitem"><a href="#/services">Services</a></li>
|
||||
<li class="sidebar__subitem"><a href="#">Networks parents</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
|
||||
<li class="menu-title">
|
||||
<a href="#"> Reports <span class="arrow"></span></a>
|
||||
</li>
|
||||
<ul class="sub-menu" id="reports">
|
||||
<li><a href="#">State History</a></li>
|
||||
<li><a href="#">Log</a></li>
|
||||
<li><a href="#">Comments</a></li>
|
||||
<li><a href="#">Downtimes</a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
<li class="menu-title">
|
||||
<a href="#"> Groups <span class="arrow"></span></a>
|
||||
<li class="sidebar__item">
|
||||
<span class="sidebar__category">Reports</span>
|
||||
|
||||
<ul class="sidebar__sublist" id="reportsList">
|
||||
<li class="sidebar__subitem"><a href="#">State History</a></li>
|
||||
<li class="sidebar__subitem"><a href="#">Log</a></li>
|
||||
<li class="sidebar__subitem"><a href="#">Comments</a></li>
|
||||
<li class="sidebar__subitem"><a href="#">Downtimes</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<ul class="sub-menu" id="groups">
|
||||
<li><a href="#">Hostgroups</a></li>
|
||||
<li><a href="#">Servicegroups</a></li>
|
||||
<li><a href="#">Contactgroups</a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
<li class="menu-title">
|
||||
<a href="#"> Other <span class="arrow"></span></a>
|
||||
<li class="sidebar__item">
|
||||
<span class="sidebar__category">Groups</span>
|
||||
|
||||
<ul class="sidebar__sublist" id="groupsList">
|
||||
<li class="sidebar__subitem"><a href="#">Hostgroups</a></li>
|
||||
<li class="sidebar__subitem"><a href="#">Servicegroups</a></li>
|
||||
<li class="sidebar__subitem"><a href="#">Contactgroups</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<ul class="sub-menu" id="other">
|
||||
<li><a href="#">Grafana</a></li>
|
||||
<li><a href="#">Nagvis</a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
|
||||
<li>
|
||||
<a href="#">
|
||||
<i class="fa fa-user fa-lg"></i> Profile
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="sidebar__item">
|
||||
<span class="sidebar__category">Other</span>
|
||||
|
||||
<ul class="sidebar__sublist" id="otherList">
|
||||
<li class="sidebar__subitem"><a href="#">Grafana</a></li>
|
||||
<li class="sidebar__subitem"><a href="#">Nagvis</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<footer class="sidebar__profile">
|
||||
<a class="sidebar__profile__toggle" href="#profile">
|
||||
<span class="sidebar__profile__name">Jean-Michel <br>Vasquez-Peruz</span>
|
||||
</a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@ -1,10 +1,8 @@
|
||||
#tactical {
|
||||
background-color: #353d48;
|
||||
color: white;
|
||||
padding: 20px;
|
||||
|
||||
}
|
||||
|
||||
#tactical #summary {
|
||||
background-color: #49515c;
|
||||
}
|
||||
//----------------------------------*\
|
||||
// TACTICAL
|
||||
//----------------------------------*/
|
||||
.current-health {
|
||||
tbody {
|
||||
td, th {padding-top:0;}
|
||||
}
|
||||
}
|
||||
@ -1,17 +1,18 @@
|
||||
<div ng-app="adagios.tactical.current_health" ng-controller="TacticalCurrentHealth" class="row">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
Current Health
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
<div class="col-md-6">
|
||||
<just-gage id="allservices" class="someClass" min=0 max=100 value=services title="ALL SERVICES"></just-gage>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<just-gage id="allhosts" class="someClass" min=0 max=100 value=hosts title="ALL HOSTS"></just-gage>
|
||||
</div>
|
||||
</div>
|
||||
<table class="current-health" ng-app="adagios.tactical.current_health" ng-controller="TacticalCurrentHealth">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Current health</th>
|
||||
<th> </th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="layout__half">
|
||||
<just-gage id="allservices" class="someClass" min=0 max=100 value=services title="ALL SERVICES"></just-gage>
|
||||
</td>
|
||||
<td class="layout__half">
|
||||
<just-gage id="allhosts" class="someClass" min=0 max=100 value=hosts title="ALL HOSTS"></just-gage>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
@ -1,39 +1,24 @@
|
||||
<table ng-app="adagios.tactical.status_overview" ng-controller="TacticalStatusOverViewCtrl" class="table">
|
||||
<table ng-app="adagios.tactical.status_overview" ng-controller="TacticalStatusOverViewCtrl" class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Status overview</th>
|
||||
<th>#</th>
|
||||
<th>
|
||||
Status overview
|
||||
</th>
|
||||
<th>
|
||||
#
|
||||
</th>
|
||||
<th>
|
||||
<i class="fa fa-bell"></i>
|
||||
<span class="visuallyhidden">Notifications number</span>
|
||||
<i class="ico-bell-alt"></i>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
HOSTS
|
||||
</td>
|
||||
<td>
|
||||
{{ hosts.count }}
|
||||
</td>
|
||||
<td class="alerts">
|
||||
{{ hosts.problems }}
|
||||
</td>
|
||||
<th>Hosts</th>
|
||||
<td>{{ hosts.count }}</td>
|
||||
<td class="state--error alerts">{{ hosts.problems }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
SERVICES
|
||||
</td>
|
||||
<td>
|
||||
{{ services.count }}
|
||||
</td>
|
||||
<td class="alerts">
|
||||
{{ services.problems }}
|
||||
</td>
|
||||
<th>Services</th>
|
||||
<td>{{ services.count }}</td>
|
||||
<td class="state--error alerts">{{ services.problems }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
@ -1,21 +1,13 @@
|
||||
<div ng-app="adagios.tactical" ng-controller="TacticalCtrl" id="tactical" class="">
|
||||
|
||||
<h2>Tactical Overview</h2>
|
||||
|
||||
<div id="summary" class="jumbotron">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<adg-status-overview></adg-status-overview>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<adg-current-health></adg-current-health>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<adg-top-alert-producers></adg-top-alert-producers>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="panes panes--3" ng-controller="TacticalCtrl" id="tactical">
|
||||
<div class="panes__pane">
|
||||
<adg-status-overview></adg-status-overview>
|
||||
</div>
|
||||
|
||||
<div class="panes__pane">
|
||||
<adg-current-health></adg-current-health>
|
||||
</div>
|
||||
|
||||
<div class="panes__pane">
|
||||
<adg-top-alert-producers></adg-top-alert-producers>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -2,10 +2,21 @@
|
||||
|
||||
angular.module('adagios.tactical', ['adagios.tactical.status_overview',
|
||||
'adagios.tactical.current_health',
|
||||
'adagios.tactical.top_alert_producers',
|
||||
'adagios.table'
|
||||
])
|
||||
'adagios.tactical.top_alert_producers'
|
||||
])
|
||||
|
||||
.controller('TacticalCtrl', ['$scope', '$http', function ($scope, $http) {
|
||||
return;
|
||||
}]);
|
||||
|
||||
// Togglable tabs
|
||||
// Don't follow hyperlinks
|
||||
$('a[data-toggle="tab"]').on('click', function (evt) {
|
||||
evt.preventDefault();
|
||||
});
|
||||
}])
|
||||
|
||||
.directive('adgTactical', function () {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'components/tactical/tactical.html'
|
||||
};
|
||||
});
|
||||
|
||||
@ -1,22 +1,14 @@
|
||||
<table ng-app="adagios.tactical.top_alert_producers" ng-controller="TacticalTopAlertProducers" class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
Top Alert Producers
|
||||
</th>
|
||||
<th>
|
||||
<i class="fa fa-bell"></i>
|
||||
</th>
|
||||
<th>Top alert producers</th>
|
||||
<th><i class="ico-bell-alt"></i></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="host in hosts">
|
||||
<td>
|
||||
{{ host.host_name }}
|
||||
</td>
|
||||
<td>
|
||||
{{ host.problems }}
|
||||
</td>
|
||||
<th>{{ host.host_name }}</th>
|
||||
<td class="state--error">{{ host.problems }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
@ -1,180 +1,221 @@
|
||||
//----------------------------------*\
|
||||
// TOPBAR MODULE
|
||||
//----------------------------------*/
|
||||
.topbar-wrapper {
|
||||
border-bottom:1px solid;
|
||||
@extend %colorBkgTopbar;
|
||||
@extend %colorBorderThin;
|
||||
border-bottom:1px solid;
|
||||
}
|
||||
|
||||
.topbar {
|
||||
a {@extend %colorLink;}
|
||||
.topbar a {@extend %colorLink;}
|
||||
|
||||
&.layout__flexrow {
|
||||
.flexbox & {}
|
||||
}
|
||||
}
|
||||
|
||||
.topbar__list {
|
||||
display:block;
|
||||
|
||||
.flexbox .layout__flexrow & {
|
||||
flex:1;
|
||||
}
|
||||
|
||||
&.topbar__list--left {text-align:left;}
|
||||
&.topbar__list--right {text-align:right;}
|
||||
}
|
||||
.topbar__list {display:block;}
|
||||
|
||||
.topbar__item {
|
||||
@extend %colorBorderThin;
|
||||
border-right:1px solid;
|
||||
border:0 solid;
|
||||
display:inline-block;
|
||||
float:left;
|
||||
position:relative;
|
||||
|
||||
.topbar__list--right &.topbar__search {
|
||||
border-left:1px solid;
|
||||
@extend %colorBorderThin;
|
||||
.topbar__list--left & {
|
||||
border-right-width:1px;
|
||||
float:left;
|
||||
}
|
||||
|
||||
.topbar__button {
|
||||
@extend %button-reset;
|
||||
@extend %colorLink;
|
||||
padding:32px;
|
||||
.topbar__list--right & {
|
||||
border-left-width:1px;
|
||||
float:right;
|
||||
}
|
||||
|
||||
%topbar__panel {
|
||||
@extend %colorBkgTopbarPanel;
|
||||
max-width:485px;
|
||||
min-width:320px;
|
||||
@extend %colorBkgPanel;
|
||||
width:320px;
|
||||
position:absolute;
|
||||
top:100%;
|
||||
top:100%;
|
||||
z-index:999999;
|
||||
}
|
||||
|
||||
.topbar__panel--fromleft {
|
||||
@extend %topbar__panel;
|
||||
left:-1px;
|
||||
left:-81px;
|
||||
|
||||
@include medium-and-up-screen {
|
||||
left:-1px;
|
||||
width:485px;
|
||||
}
|
||||
}
|
||||
|
||||
.topbar__panel--fromright {
|
||||
@extend %topbar__panel;
|
||||
right:-1px;
|
||||
right:0;
|
||||
|
||||
@include medium-and-up-screen {
|
||||
width:190px;
|
||||
}
|
||||
}
|
||||
|
||||
.topbar__panel__content {padding:$_space $_space_narrow 0;}
|
||||
}
|
||||
|
||||
.topbar__button {
|
||||
@extend %button-reset;
|
||||
@extend %colorBkgTopbarButton;
|
||||
@extend %colorLink;
|
||||
height:80px;
|
||||
position:relative;
|
||||
width:79px;
|
||||
|
||||
&[aria-expanded="true"] {color:$_color_omega;}
|
||||
|
||||
[class^="ico-"],
|
||||
[class*=" ico-"] {
|
||||
bottom:30px;
|
||||
display:block;
|
||||
font-size:em(20, $_base_font_size);
|
||||
height:1em;
|
||||
left:0;
|
||||
line-height:1em;
|
||||
margin:0 auto;
|
||||
position:absolute;
|
||||
right:0;
|
||||
text-align:center;
|
||||
top:auto;
|
||||
width:1em;
|
||||
|
||||
&:before {margin:0;}
|
||||
}
|
||||
}
|
||||
|
||||
.topbar__toggle-sidebar {
|
||||
|
||||
.topbar__button {
|
||||
position:relative;
|
||||
&[aria-expanded="true"],
|
||||
&:hover {
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_alpha;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_alpha;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ico-menu {
|
||||
|
||||
&:after {
|
||||
//bottom:0;
|
||||
@extend %ico;
|
||||
bottom:0;
|
||||
display:inline-block;
|
||||
font:normal 10px FontAwesome;
|
||||
font-size:10px;
|
||||
margin:auto 0;
|
||||
position:absolute;
|
||||
//top:0;
|
||||
top:0;
|
||||
}
|
||||
}
|
||||
|
||||
&[aria-expanded="false"]:after {
|
||||
content:'\f0da';
|
||||
left:auto;
|
||||
right:8px;
|
||||
}
|
||||
[aria-expanded="false"] .ico-menu:after {
|
||||
content:'\e808';
|
||||
right:-7px;
|
||||
}
|
||||
|
||||
&[aria-expanded="true"]:after {
|
||||
content:'\f0d9';
|
||||
left:8px;
|
||||
right:auto;
|
||||
}
|
||||
[aria-expanded="true"] .ico-menu:after {
|
||||
content:'\e807';
|
||||
left:-7px;
|
||||
}
|
||||
}
|
||||
|
||||
.topbar__notifications {
|
||||
.topbar__button {
|
||||
position:relative;
|
||||
&[aria-expanded="true"],
|
||||
&:hover {
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_alpha;
|
||||
}
|
||||
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_alpha;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ico-bell-alt {
|
||||
&:after {
|
||||
background:red;
|
||||
background:$_color_error;
|
||||
border-radius:100%;
|
||||
color:white;
|
||||
color:$_color_omega;
|
||||
content:attr(data-notifications);
|
||||
font-size:10px;
|
||||
font-style:normal;
|
||||
height:18px;
|
||||
left:7px;
|
||||
line-height:18px;
|
||||
position:absolute;
|
||||
right:5px;
|
||||
text-align:center;
|
||||
top:5px;
|
||||
top:-9px;
|
||||
width:18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.topbar__search {
|
||||
|
||||
.topbar__button {float:left;}
|
||||
|
||||
.topbar__search #searchfield {
|
||||
display:none;
|
||||
.topbar__searchfield {
|
||||
background:transparent;
|
||||
border:0;
|
||||
display:none;
|
||||
float:right;
|
||||
font-size:1em;
|
||||
height:14px;
|
||||
margin:36px $_space 0 0;
|
||||
vertical-align:baseline;
|
||||
|
||||
@include medium-and-up-screen {
|
||||
display:inline-block;
|
||||
margin-right:15px;
|
||||
@include large-xlarge-screen {
|
||||
display:inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* #topbar { */
|
||||
/* border-radius: 0px; */
|
||||
/* border: none; */
|
||||
/* height: 82px; */
|
||||
/* min-height: 82px; */
|
||||
/* margin-bottom: 0px; */
|
||||
/* } */
|
||||
.topbar__settings {
|
||||
.topbar__button {
|
||||
&[aria-expanded="true"],
|
||||
&:hover {
|
||||
.color-scheme--dark & {
|
||||
background:$_color_dark_alpha;
|
||||
}
|
||||
|
||||
/* #topbar .container-fluid{ */
|
||||
/* padding-left: 0px; */
|
||||
/* } */
|
||||
.color-scheme--light & {
|
||||
background:$_color_light_alpha;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* #topbar .topbar-brand{ padding: 0px 30px;font-size: 1.5em;line-height: 80px; } */
|
||||
/* #topbar .topbar-nav > li > a { padding: 0px 30px; line-height: 80px; font-size: 1.5em; } */
|
||||
/* #topbar .topbar-nav > li > form div { */
|
||||
/* line-height: 55px; */
|
||||
/* font-size: 1.5em; */
|
||||
/* } */
|
||||
/* #topbar .topbar-nav > li > form input { */
|
||||
/* height: 60px; */
|
||||
/* } */
|
||||
.ico-sliders:before {
|
||||
@include vendor(transform, rotate(90deg));
|
||||
}
|
||||
}
|
||||
|
||||
.topbar__settings__category {
|
||||
@extend %typo-title;
|
||||
display:block;
|
||||
margin-bottom:$_space;
|
||||
|
||||
/* #topbar div.topbar-collapse { */
|
||||
/* padding-left: 0px; */
|
||||
/* } */
|
||||
.color-scheme--dark & {
|
||||
color:$_color_dark_gamma;
|
||||
}
|
||||
|
||||
/* #search input { */
|
||||
/* border: none; */
|
||||
/* background-color: #353d48; */
|
||||
/* font-size: 1.5em; */
|
||||
/* color: #aeb5bf; */
|
||||
/* width: 400px; */
|
||||
/* } */
|
||||
.color-scheme--light & {
|
||||
color:$_color_light_gamma;
|
||||
}
|
||||
}
|
||||
|
||||
.topbar__settings__item,
|
||||
.topbar__settings__subitem {display:block;}
|
||||
|
||||
/* a#toggle-sidebar .fa-chevron-left { */
|
||||
/* font-size: 0.5em; */
|
||||
/* vertical-align: super; */
|
||||
/* } */
|
||||
.topbar__settings__subitem {
|
||||
@extend %typo-menu;
|
||||
margin-bottom:$_space;
|
||||
|
||||
|
||||
/* #search i, */
|
||||
/* #settings i, */
|
||||
/* #notifications i, */
|
||||
/* #toggle-sidebar i { */
|
||||
/* font-size: 1.5em; */
|
||||
/* } */
|
||||
|
||||
|
||||
/* #topbar li { */
|
||||
/* border-color: #252b37; */
|
||||
/* border-style: solid; */
|
||||
/* border-width: 1px; */
|
||||
/* } */
|
||||
|
||||
/* #topbar li #search { */
|
||||
/* float: left; */
|
||||
/* } */
|
||||
a {display:block;}
|
||||
}
|
||||
@ -1,4 +1,4 @@
|
||||
<nav ng-app="adagios.topbar" id="topbar" class="topbar layout__flexrow" role="navigation" ng-controller="TopBarCtrl">
|
||||
<nav ng-app="adagios.topbar" id="topbar" class="topbar" role="navigation" ng-controller="TopBarCtrl">
|
||||
<ul class="topbar__list topbar__list--left">
|
||||
<li class="topbar__item topbar__toggle-sidebar">
|
||||
<button class="topbar__button"
|
||||
@ -8,65 +8,108 @@
|
||||
aria-expanded="false"
|
||||
aria-controls="sidebarWrapper">
|
||||
<span class="visuallyhidden">Ouvrir la barre de navigation latérale</span>
|
||||
<i class="fa fa-bars"></i>
|
||||
<i class="ico-menu"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="topbar__item topbar__notifications">
|
||||
<button class="topbar__button"
|
||||
id="notifications"
|
||||
type="button"
|
||||
data-notifications="{{ notifications }}"
|
||||
data-toggle="collapse"
|
||||
data-target="#notificationsPanel"
|
||||
aria-expanded="false"
|
||||
aria-controls="notificationsPanel">
|
||||
<span class="visuallyhidden">Voir les notifications</span>
|
||||
<i class="fa fa-bell"></i>
|
||||
<i class="ico-bell-alt" data-notifications="{{ notifications }}"></i>
|
||||
</button>
|
||||
|
||||
|
||||
<div class="topbar__panel--fromleft collapse" id="notificationsPanel">
|
||||
<div class="tabpanel">
|
||||
<ul role="tablist">
|
||||
<div class="topbar__panel__content tabpanel">
|
||||
<ul class="tablist clearfix">
|
||||
<li role="presentation" class="tablist__item active">
|
||||
<a href="#openProblems"
|
||||
<a href="#topOpenProblems"
|
||||
class="tabpanel__tab"
|
||||
aria-controls="openProblems"
|
||||
aria-controls="topOpenProblems"
|
||||
aria-expanded="true"
|
||||
role="tab"
|
||||
data-toggle="tab"
|
||||
data-openproblems="27">Open problems
|
||||
data-problems="27">Open problems
|
||||
</a>
|
||||
</li>
|
||||
<li role="presentation" class="tablist__item">
|
||||
<a href="#allProblems"
|
||||
<a href="#topAllProblems"
|
||||
class="tabpanel__tab"
|
||||
aria-controls="allProblems"
|
||||
aria-controls="topAllProblems"
|
||||
aria-expanded="false"
|
||||
role="tab"
|
||||
data-toggle="tab"
|
||||
data-allproblems="38">All problems
|
||||
data-problems="38">All problems
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<div class="tab-content">
|
||||
<div role="tabpanel" class="tab-pane active" id="openProblems">Open problems</div>
|
||||
<div role="tabpanel" class="tab-pane" id="allProblems">All problems</div>
|
||||
<div role="tabpanel" class="problems tab-pane active" id="topOpenProblems">
|
||||
<ol class="problems__list">
|
||||
<li class="problems__item">
|
||||
<strong class="problems__host state--ok">localhost</strong>
|
||||
|
||||
<dl class="problems__desclist">
|
||||
<dt class="problems__name state--warning">
|
||||
<span>Root partition</span>
|
||||
<small class="problems__duration">2 days, 8 hours</small>
|
||||
</dt>
|
||||
<dd class="problems__description">Disk warning - free space : / 673 MB (12% inode = 59%)</dd>
|
||||
</dl>
|
||||
</li>
|
||||
<li class="problems__item">
|
||||
<strong class="problems__host state--warning">www.theatlantic.com</strong>
|
||||
|
||||
<dl class="problems__desclist">
|
||||
<dt class="problems__name state--warning">
|
||||
<span>HTTP www.theatlantic.com</span>
|
||||
<small class="problems__duration">6 days, 5 hours</small>
|
||||
</dt>
|
||||
<dd class="problems__description">Check_http: invalid onedirection - $</dd>
|
||||
</dl>
|
||||
</li>
|
||||
<li class="problems__item">
|
||||
<strong class="problems__host state--error">www.savoirfairelinux.com</strong>
|
||||
|
||||
<dl class="problems__desclist">
|
||||
<dt class="problems__name state--warning">
|
||||
<span>Verbis se superiores opere enim</span>
|
||||
<small class="problems__duration">8 days, 5 hours</small>
|
||||
</dt>
|
||||
<dd class="problems__description">Check_http: invalid onedirection option - $</dd>
|
||||
|
||||
<dt class="problems__name state--error">
|
||||
<span>CPU utilization</span>
|
||||
<small class="problems__duration">1 days, 3 hours</small>
|
||||
</dt>
|
||||
<dd class="problems__description">NRPE: Command checkCPU not defined</dd>
|
||||
|
||||
<dt class="problems__name state--ok">
|
||||
<span>Runnning services</span>
|
||||
<small class="problems__duration">1 days, 12 hours</small>
|
||||
</dt>
|
||||
<dd class="problems__description">Levandi amicitias se fere - $</dd>
|
||||
</dl>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
<button class="problems__viewall" type="button">View all open problems</button>
|
||||
</div>
|
||||
|
||||
<div role="tabpanel" class="tab-pane" id="topAllProblems">
|
||||
ALL PROBLEMS
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<ul class="topbar__list topbar__list--right">
|
||||
<li class="topbar__item topbar__search">
|
||||
<form class="topbar-form topbar-left" role="search" id="search">
|
||||
<button class="topbar__button" id="search" type="submit">
|
||||
<span class="visuallyhidden">Lancer une recherche</span>
|
||||
<i class="fa fa-search"></i>
|
||||
</button>
|
||||
|
||||
<label class="visuallyhidden" for="searchfield">Recherche</label>
|
||||
<input id="searchfield" type="search" class="form-control" placeholder="Search hosts, services, ...">
|
||||
</form>
|
||||
</li>
|
||||
<li class="topbar__item topbar__settings">
|
||||
<button class="topbar__button"
|
||||
id="settings"
|
||||
@ -75,10 +118,45 @@
|
||||
aria-expanded="false"
|
||||
aria-controls="settingsPanel">
|
||||
<span class="visuallyhidden">Afficher la liste des paramètres</span>
|
||||
<i class="fa fa-sliders fa-rotate-90"></i>
|
||||
<i class="ico-sliders"></i>
|
||||
</button>
|
||||
|
||||
<div class="topbar__panel--fromright collapse" id="settingsPanel">...</div>
|
||||
|
||||
<div class="topbar__panel--fromright collapse" id="settingsPanel">
|
||||
<nav class="topbar__panel__content" role="navigation">
|
||||
<ul class="topbar__settings__list">
|
||||
<li class="topbar__settings__item">
|
||||
<span class="topbar__settings__category">Adagios</span>
|
||||
|
||||
<ul class="topbar__settings__sublist">
|
||||
<li class="topbar__settings__subitem"><a href="#">Missing Plugins</a></li>
|
||||
<li class="topbar__settings__subitem"><a href="#">Object History</a></li>
|
||||
<li class="topbar__settings__subitem"><a href="#">Configure</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="topbar__settings__item">
|
||||
<span class="topbar__settings__category">Nagios</span>
|
||||
|
||||
<ul class="topbar__settings__sublist">
|
||||
<li class="topbar__settings__subitem"><a href="#">Settings</a></li>
|
||||
<li class="topbar__settings__subitem"><a href="#">Edit nagios.cfg</a></li>
|
||||
<li class="topbar__settings__subitem"><a href="#">Nagios Service</a></li>
|
||||
<li class="topbar__settings__subitem"><a href="#">Pnp intergration</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</li>
|
||||
<li class="topbar__item topbar__search">
|
||||
<form class="topbar-form topbar-left" role="search" id="search">
|
||||
<button class="topbar__button" type="button">
|
||||
<span class="visuallyhidden">Lancer une recherche</span>
|
||||
<i class="ico-search"></i>
|
||||
</button>
|
||||
|
||||
<label class="visuallyhidden" for="searchfield">Recherche</label>
|
||||
<input id="searchfield" type="search" class="topbar__searchfield form-control" placeholder="Search hosts, services, ...">
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
@ -1,23 +1,241 @@
|
||||
<div ng-app="adagios.tactical" ng-controller="DashboardCtrl" id="tactical" class="">
|
||||
<article ng-app="adagios.tactical" ng-controller="TacticalCtrl" id="tactical">
|
||||
<header class="main__overview">
|
||||
<h2 class="main__overview__title">Tactical Overview</h2>
|
||||
|
||||
<adg-tactical></adg-tactical>
|
||||
|
||||
<h2>Tactical Overview</h2>
|
||||
</header>
|
||||
|
||||
<section class="main__content tabpanel">
|
||||
<nav>
|
||||
<ul class="tablist clearfix">
|
||||
<li role="presentation" class="tablist__item active">
|
||||
<a href="#openProblems"
|
||||
class="tabpanel__tab"
|
||||
aria-controls="openProblems"
|
||||
aria-expanded="true"
|
||||
role="tab"
|
||||
data-toggle="tab"
|
||||
data-problems="27">Open problems
|
||||
</a>
|
||||
</li>
|
||||
<li role="presentation" class="tablist__item">
|
||||
<a href="#allProblems"
|
||||
class="tabpanel__tab"
|
||||
aria-controls="allProblems"
|
||||
aria-expanded="false"
|
||||
role="tab"
|
||||
data-toggle="tab"
|
||||
data-problems="38">All problems
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<menu class="filters">
|
||||
<ul class="filters__list clearfix">
|
||||
<li class="filters__item filters__item--problems">
|
||||
<button class="filters__button"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#filtersProblems"
|
||||
aria-expanded="false"
|
||||
aria-controls="filtersProblems">
|
||||
<span>All</span>
|
||||
<i class="ico-down-dir"></i>
|
||||
</button>
|
||||
|
||||
<div class="filters__panel collapse" id="filtersProblems">
|
||||
<ul class="filters__sublist">
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link state--current" href="#">All</a>
|
||||
</li>
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">All OK</a>
|
||||
</li>
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">All Acknowledged</a>
|
||||
</li>
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">All in Downtime</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="filters__item filters__item--recheck">
|
||||
<button class="filters__button" type="button">
|
||||
<span class="visuallyhidden">Recheck</span>
|
||||
<i class="ico-arrows-cw"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="filters__item filters__item--acknowledge"
|
||||
data-mover="true">
|
||||
<button class="filters__button" type="button">
|
||||
<span class="visuallyhidden">Acknowledge</span>
|
||||
<i class="ico-thumbs-up"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="filters__item filters__item--downtime"
|
||||
data-mover="true">
|
||||
<button class="filters__button" type="button">
|
||||
<span class="visuallyhidden">Downtime</span>
|
||||
<i class="ico-clock"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="filters__item filters__item--more clearfix">
|
||||
<button class="filters__button"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#filtersMore"
|
||||
aria-expanded="false"
|
||||
aria-controls="filtersMore">
|
||||
<span>More</span>
|
||||
<i class="ico-down-dir"></i>
|
||||
</button>
|
||||
|
||||
<div class="filters__panel collapse" id="filtersMore">
|
||||
<ul class="filters__sublist">
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">More I</a>
|
||||
</li>
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">More II</a>
|
||||
</li>
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">More III</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="filters__item filters__item--settings">
|
||||
<button class="filters__button"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#filtersSettings"
|
||||
aria-expanded="false"
|
||||
aria-controls="filtersSettings">
|
||||
<span class="visuallyhidden">Filters Settings</span>
|
||||
<i class="ico-cog"></i>
|
||||
</button>
|
||||
|
||||
<div class="filters__panel collapse" id="filtersSettings">
|
||||
<ul class="filters__sublist">
|
||||
<li>...</li>
|
||||
<li>...</li>
|
||||
<li>...</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</menu>
|
||||
|
||||
<div class="tab-content">
|
||||
<div role="tabpanel" class="problems tab-pane active" id="openProblems">
|
||||
<header class="main__content__header clearfix">
|
||||
<h2 class="main__content__title">Unhandled service problems</h2>
|
||||
<p class="main__content__alert state--error">There are 5 host problems.</p>
|
||||
</header>
|
||||
|
||||
<adg-table cells="{{dashboardCells}}" api-name="{{dashboardApiName}}" filters="{{dashboardFilters}}"></adg-table>
|
||||
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="data-table__checkbox"><input type="checkbox"></th>
|
||||
<th class="state--current data-table__host">
|
||||
<span class="data-table__cell__string">Host</span>
|
||||
<i class="ico-up-dir"></i>
|
||||
</th>
|
||||
<th class="data-table__service">Service check</th>
|
||||
<th class="data-table__duration">Duration</th>
|
||||
<th class="data-table__lastcheck">Last check</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tr>
|
||||
<td class="data-table__checkbox"><input type="checkbox"></td>
|
||||
<td class="data-table__host state--ok">
|
||||
<a class="data-table__data" href="#">localhost</a>
|
||||
</td>
|
||||
<td class="data-table__service state--warning">
|
||||
<dl class="data-table__data">
|
||||
<dt class="data-table__service__name">Root partition</dt>
|
||||
<dd class="data-table__service__summary">DISK WARNING - free space : / 673 MB (12% inode = 59%)</dd>
|
||||
</dl>
|
||||
</td>
|
||||
<td class="data-table__duration">1 month, 2 weeks</td>
|
||||
<td class="data-table__lastcheck">0 minutes ago</td>
|
||||
</tr>
|
||||
|
||||
<tr class="state--hasChild">
|
||||
<td class="data-table__checkbox"><input type="checkbox"></td>
|
||||
<td class="data-table__host state--ok">
|
||||
<a class="data-table__data" href="#">srv-apache-01</a>
|
||||
</td>
|
||||
<td class="data-table__service state--warning">
|
||||
<dl class="data-table__data">
|
||||
<dt class="data-table__service__name">Root partition</dt>
|
||||
<dd class="data-table__service__summary">DISK WARNING - free space : / 673 MB (12% inode = 59%)</dd>
|
||||
</dl>
|
||||
</td>
|
||||
<td class="data-table__duration">1 month, 2 weeks</td>
|
||||
<td class="data-table__lastcheck">0 minutes ago</td>
|
||||
</tr>
|
||||
|
||||
<tbody class="state--isChild">
|
||||
<tr>
|
||||
<td class="data-table__checkbox"><input type="checkbox"></td>
|
||||
<td class=""> </td>
|
||||
<td class="data-table__service state--error">
|
||||
<dl class="data-table__data">
|
||||
<dt class="data-table__service__name">Root partition</dt>
|
||||
<dd class="data-table__service__summary">DISK ERROR - free space : / 673 MB (12% inode = 59%)</dd>
|
||||
</dl>
|
||||
</td>
|
||||
<td class="data-table__duration">1 month, 2 weeks</td>
|
||||
<td class="data-table__lastcheck">0 minutes ago</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
||||
<tr>
|
||||
<td class="data-table__checkbox"><input type="checkbox"></td>
|
||||
<td class="data-table__host state--ok">
|
||||
<a class="data-table__data" href="#">localhost</a>
|
||||
</td>
|
||||
<td class="data-table__service state--warning">
|
||||
<dl class="data-table__data">
|
||||
<dt class="data-table__service__name">Root partition</dt>
|
||||
<dd class="data-table__service__summary">DISK WARNING - free space : / 673 MB (12% inode = 59%)</dd>
|
||||
</dl>
|
||||
</td>
|
||||
<td class="data-table__duration">1 month, 2 weeks</td>
|
||||
<td class="data-table__lastcheck">0 minutes ago</td>
|
||||
</tr>
|
||||
|
||||
<div id="summary" class="jumbotron">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<adg-status-overview></adg-status-overview>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<adg-current-health></adg-current-health>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<adg-top-alert-producers></adg-top-alert-producers>
|
||||
</div>
|
||||
<tr>
|
||||
<td class="data-table__checkbox"><input type="checkbox"></td>
|
||||
<td class="data-table__host state--ok">
|
||||
<a class="data-table__data" href="#">localhost</a>
|
||||
</td>
|
||||
<td class="data-table__service state--warning">
|
||||
<dl class="data-table__data">
|
||||
<dt class="data-table__service__name">Root partition</dt>
|
||||
<dd class="data-table__service__summary">DISK WARNING - free space : / 673 MB (12% inode = 59%)</dd>
|
||||
</dl>
|
||||
</td>
|
||||
<td class="data-table__duration">1 month, 2 weeks</td>
|
||||
<td class="data-table__lastcheck">0 minutes ago</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div role="tabpanel" class="problems tab-pane" id="allProblems">
|
||||
<header class="main__content__header">
|
||||
<h2 class="main__content__title">All service problems</h2>
|
||||
|
||||
<p class="main__content__alert">...</p>
|
||||
</header>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<adg-table cells="{{dashboardCells}}" api-name="{{dashboardApiName}}" filters="{{dashboardFilters}}"></adg-table>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
@ -8,15 +8,14 @@
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<title>Adagios</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href='http://fonts.googleapis.com/css?family=Roboto:400,700,400italic' rel='stylesheet' type='text/css'>
|
||||
<link rel="stylesheet" href="assets/css/app.css">
|
||||
<meta name="description" content="">
|
||||
|
||||
<script src="bower_components/jquery/dist/jquery.min.js"></script>
|
||||
|
||||
<!-- Angular -->
|
||||
<script src="bower_components/angular/angular.js"></script>
|
||||
<script src="bower_components/angular-route/angular-route.js"></script>
|
||||
|
||||
|
||||
<!-- Application -->
|
||||
<script src="app.js"></script>
|
||||
<script src="components/config/config.js"></script>
|
||||
@ -48,8 +47,8 @@
|
||||
<script src="components/table/cell_host_address/cell_host_address.js"></script>
|
||||
<script src="components/table/cell_host_status/cell_host_status.js"></script>
|
||||
|
||||
<script src="bower_components/html5-boilerplate/js/vendor/modernizr-2.6.2.min.js"></script>
|
||||
<script src="bower_components/moment/moment.js"></script>
|
||||
<script src="bower_components/html5-boilerplate/js/vendor/modernizr-2.6.2.min.js"></script>
|
||||
<script src="bower_components/moment/moment.js"></script>
|
||||
|
||||
<!-- VIEWS -->
|
||||
<script src="dashboard/dashboard.js"></script>
|
||||
@ -65,19 +64,21 @@
|
||||
<aside class="layout__aside sidebar-wrapper collapse" id="sidebarWrapper">
|
||||
<adg-sidebar></adg-sidebar>
|
||||
</aside>
|
||||
|
||||
|
||||
<div class="layout__main">
|
||||
<div class="layout__row topbar-wrapper">
|
||||
<div class="topbar-wrapper clearfix">
|
||||
<adg-topbar></adg-topbar>
|
||||
</div>
|
||||
|
||||
<main ng-view id="page" class="main layout__row" role="main"></main>
|
||||
<footer class="footer layout__row" role="contentinfo">...</footer>
|
||||
|
||||
<main ng-view id="page" class="main" role="main"></main>
|
||||
<footer class="footer" role="contentinfo">...</footer>
|
||||
</div>
|
||||
|
||||
<script src="bower_components/raphael/raphael-min.js"></script>
|
||||
<script src="bower_components/justgage-toorshia/justgage.js"></script>
|
||||
<script src="bower_components/bootstrap-sass-official/assets/javascripts/bootstrap.js"></script>
|
||||
<script src="assets/js/scripts.js"></script>
|
||||
</div>
|
||||
|
||||
<script src="bower_components/jquery/dist/jquery.min.js"></script>
|
||||
<script src="bower_components/raphael/raphael-min.js"></script>
|
||||
<script src="bower_components/justgage-toorshia/justgage.js"></script>
|
||||
<script src="bower_components/bootstrap-sass-official/assets/javascripts/bootstrap.js"></script>
|
||||
<script src="assets/js/scripts.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user