ndi-2018
/
main
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

upd: updated iface

This commit is contained in:
xdrm-brackets 2017-12-03 16:02:18 +01:00
parent c5fae9e7ce
commit 43e1c742b7
16 changed files with 257 additions and 127 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
public_html/css/header.css
View File

@ -4,16 +4,15 @@
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: calc( 20em - 3em - 2px ); width: calc( 15em - 3em );
height: calc( 100% - 2*1.7em ); height: calc( 100% - 2*1em );
padding: 1.7em 0; padding: 1em 0;
padding-left: 3em; padding-left: 3em;
border-right: 2px solid #294496;
background: url('/image/header-icon.svg') center left 2em no-repeat; background: url('/image/header-icon.svg') center left 2em no-repeat;
background-size: 1.7em; background-size: 1.7em;
background-color: #2a469c; background-color: rgba(0,0,0,.7);
color: #fff; color: #fff;
} }
@ -27,6 +26,10 @@
font-size: 1.2em; font-size: 1.2em;
letter-spacing: 2px; letter-spacing: 2px;
background: -webkit-linear-gradient(top left, #474dff, #00E288);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
overflow: hidden; overflow: hidden;
} }
@ -40,19 +43,19 @@
display: block; display: block;
position: absolute; position: absolute;
top: 0; top: 0;
left: 20em; left: 15em;
width: calc( 100% - 20em - 12em - 2em - 5em ); width: calc( 100% - 15em - 12em - 2em - 5em );
height: calc( 100% - 2*1.7em ); height: calc( 100% - 2*1.2em );
padding: 1.7em 0; padding: 1.2em 0;
padding-left: 5em; padding-left: 5em;
background: url('/image/header/info/info.svg') center left 2em no-repeat; background: url('/image/header/info/info.svg@2299e3') center left 2em no-repeat;
background-size: 1.6em; background-size: 1.6em;
} }
#header-info.info{ background-image: url('/image/header/info/info.svg'); } #header-info.info{ background-image: url('/image/header/info/info.svg@2299e3'); }
#header-info.warning{ background-image: url('/image/header/info/warning.svg'); } #header-info.warning{ background-image: url('/image/header/info/warning.svg@ed5e17'); }
#header-info.error{ background-image: url('/image/header/info/error.svg'); } #header-info.error{ background-image: url('/image/header/info/error.svg@d7373a'); }
/****************************/ /****************************/
@ -84,7 +87,7 @@
width: 2em; width: 2em;
height: 2em; height: 2em;
background: url('/image/header/notif/bell.svg') center center no-repeat; background: url('/image/header/notif/bell.svg@aaaaaa') center center no-repeat;
background-size: 50%; background-size: 50%;
background-color: transparent; background-color: transparent;
@ -92,16 +95,23 @@
cursor: pointer; cursor: pointer;
transition: background-color .2s ease-in-out; transition: background .2s ease-in-out;
} }
#header-notif .hnotif.message{ background-image: url('/image/header/notif/message.svg@aaaaaa'); }
#header-notif .hnotif.search{ background-image: url('/image/header/notif/search.svg@aaaaaa'); }
#header-notif .hnotif.menu{ background-image: url('/image/header/notif/menu.svg@aaaaaa'); }
/* HOVER */
#header-notif .hnotif:hover{ #header-notif .hnotif:hover{
background-color: #294496; background-color: #ddd;
background-image: url('/image/header/notif/bell.svg@ee9a31');
} }
#header-notif .hnotif.message{ background-image: url('/image/header/notif/message.svg'); } #header-notif .hnotif.message:hover{ background-image: url('/image/header/notif/message.svg@23c795'); }
#header-notif .hnotif.search{ background-image: url('/image/header/notif/search.svg'); } #header-notif .hnotif.search:hover{ background-image: url('/image/header/notif/search.svg@ae51da'); }
#header-notif .hnotif.menu{ background-image: url('/image/header/notif/menu.svg'); } #header-notif .hnotif.menu:hover{ background-image: url('/image/header/notif/menu.svg@4a8ad8'); }
/* Counter element */ /* Counter element */
#header-notif .hnotif[data-count]:before{ #header-notif .hnotif[data-count]:before{

15
public_html/css/layout.css
View File

@ -27,7 +27,7 @@ body{
width: 100%; width: 100%;
height: 100%; height: 100%;
background-color: #fff; background-color: #eee;
overflow: hidden; overflow: hidden;
} }
@ -39,14 +39,15 @@ body{
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: calc( 4.5em - 1px ); height: calc( 3.5em - 1px );
background: #3756b2; background: #fff;
/* background: -webkit-linear-gradient(top right, #2428ff, #00E288); */
color: #fff; color: #fff;
font-family: inherit; font-family: inherit;
border-bottom: 1px solid #2a469c; border-bottom: 1px solid #ddd;
overflow: hidden; overflow: hidden;
} }
@ -55,14 +56,14 @@ body{
#MENU{ #MENU{
display: flex; display: flex;
position: absolute; position: absolute;
top: 4.5em; top: 3.5em;
left: 0; left: 0;
width: calc( 20em - 2px ); width: calc( 15em - 1px );
height: calc( 100% - 5em ); height: calc( 100% - 5em );
background-color: #fff; background-color: #fff;
border-right: 2px solid #eee; border-right: 1px solid #ddd;
flex-direction: column; flex-direction: column;
justify-content: flex-start; justify-content: flex-start;

7
public_html/css/menu.css
View File

@ -19,11 +19,12 @@
top: 0; top: 0;
left: 0; left: 0;
width: calc( 100% - 3em ); width: calc( 100% - 3em );
height: calc( 100% - 1.5em ); height: calc( 100% - 1.4em );
background-color: #fff; background: #fff url('/image/menu/dashboard.svg') center left 1em no-repeat;
background-size: 1.2em auto;
padding-top: 1.5em; padding-top: 1.4em;
padding-left: 3em; padding-left: 3em;
color: #888; color: #888;

6
public_html/image/header/info/error.svg
View File

@ -21,7 +21,7 @@
<dc:format>image/svg+xml</dc:format> <dc:format>image/svg+xml</dc:format>
<dc:type <dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title> <dc:title />
</cc:Work> </cc:Work>
</rdf:RDF> </rdf:RDF>
</metadata> </metadata>
@ -42,7 +42,7 @@
showgrid="false" showgrid="false"
inkscape:zoom="14.024285" inkscape:zoom="14.024285"
inkscape:cx="5.7725748" inkscape:cx="5.7725748"
inkscape:cy="4.573557" inkscape:cy="10.277948"
inkscape:window-x="0" inkscape:window-x="0"
inkscape:window-y="24" inkscape:window-y="24"
inkscape:window-maximized="1" inkscape:window-maximized="1"
@ -57,7 +57,7 @@
<path <path
d="M 22,12 C 22,17.523 17.523,22 12,22 6.4772,22 2,17.523 2,12 2,6.4772 6.4772,2 12,2 17.523,2 22,6.4772 22,12 Z" d="M 22,12 C 22,17.523 17.523,22 12,22 6.4772,22 2,17.523 2,12 2,6.4772 6.4772,2 12,2 17.523,2 22,6.4772 22,12 Z"
transform="translate(0,1028.4)" transform="translate(0,1028.4)"
id="path4179" id="fill-edit"
style="fill:#e9202a;fill-opacity:1" style="fill:#e9202a;fill-opacity:1"
inkscape:connector-curvature="0" /> inkscape:connector-curvature="0" />
<path <path

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.1 KiB

After

Width:  |  Height:  |  Size: 2.1 KiB

22
public_html/image/header/info/info.svg
View File

@ -44,26 +44,14 @@
inkscape:window-x="0" inkscape:window-x="0"
inkscape:window-y="24" inkscape:window-y="24"
inkscape:window-maximized="1" inkscape:window-maximized="1"
inkscape:current-layer="Icons with numbers" /> inkscape:current-layer="svg4175" />
<title <title
id="title4177" /> id="title4177" />
<defs <defs
id="defs4179" /> id="defs4179" />
<g
fill="none"
fill-rule="evenodd"
id="Icons with numbers"
stroke="none"
stroke-width="1">
<g
fill="#000000"
id="Group"
transform="translate(-576.000000, -432.000000)"
style="fill:#e8b522;fill-opacity:1">
<path <path
d="M583,435 L583,437 L585,437 L585,435 Z M584,448 C579.581722,448 576,444.418278 576,440 C576,435.581722 579.581722,432 584,432 C588.418278,432 592,435.581722 592,440 C592,444.418278 588.418278,448 584,448 Z M583,439 L583,445 L585,445 L585,439 Z M583,439" d="M 7,3 7,5 9,5 9,3 Z M 8,16 C 3.58172,16 0,12.41828 0,8 0,3.58172 3.58172,0 8,0 c 4.41828,0 8,3.58172 8,8 0,4.41828 -3.58172,8 -8,8 z M 7,7 7,13 9,13 9,7 Z m 0,0"
id="Oval 208" id="fill-edit"
style="fill:#e8b522;fill-opacity:1" /> style="fill:#e8b522;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1"
</g> inkscape:connector-curvature="0" />
</g>
</svg> </svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.0 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

21
public_html/image/header/info/warning.svg
View File

@ -22,7 +22,7 @@
<dc:format>image/svg+xml</dc:format> <dc:format>image/svg+xml</dc:format>
<dc:type <dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title> <dc:title />
</cc:Work> </cc:Work>
</rdf:RDF> </rdf:RDF>
</metadata> </metadata>
@ -40,30 +40,21 @@
id="namedview4207" id="namedview4207"
showgrid="false" showgrid="false"
inkscape:zoom="10.518213" inkscape:zoom="10.518213"
inkscape:cx="-9.6618773" inkscape:cx="-25.586636"
inkscape:cy="6.3550537" inkscape:cy="6.3550537"
inkscape:window-x="0" inkscape:window-x="0"
inkscape:window-y="24" inkscape:window-y="24"
inkscape:window-maximized="1" inkscape:window-maximized="1"
inkscape:current-layer="Icons new Arranged Names" inkscape:current-layer="svg4198"
fit-margin-top="0" fit-margin-top="0"
fit-margin-left="0" fit-margin-left="0"
fit-margin-right="0" fit-margin-right="0"
fit-margin-bottom="0" /> fit-margin-bottom="0" />
<defs <defs
id="defs4202" /> id="defs4202" />
<g
id="Icons new Arranged Names"
style="fill:none;fill-rule:evenodd;stroke:none;stroke-width:1"
transform="translate(-3.1164357,-5.0939031)">
<g
id="101 Warning"
style="fill:#e9202a;fill-opacity:1">
<path <path
d="m 14.424233,6.1483927 c 0.870066,-1.4076629 2.282795,-1.4043083 3.150787,0 L 28.36011,23.59738 C 29.521639,25.476595 28.675546,27 26.471407,27 L 5.5278464,27 C 3.3232156,27 2.4738632,25.482664 3.6391433,23.59738 Z M 16,20 c 0.552285,0 1,-0.453036 1,-0.99703 l 0,-6.00594 C 17,12.446386 16.556135,12 16,12 c -0.552285,0 -1,0.453036 -1,0.99703 l 0,6.00594 C 15,19.553614 15.443865,20 16,20 Z m 0,4 c 0.552285,0 1,-0.447715 1,-1 0,-0.552285 -0.447715,-1 -1,-1 -0.552285,0 -1,0.447715 -1,1 0,0.552285 0.447715,1 1,1 z m 0,0" d="m 11.307797,1.0544896 c 0.870066,-1.4076629 2.282795,-1.4043083 3.150787,0 l 10.78509,17.4489874 c 1.161529,1.879215 0.315436,3.40262 -1.888703,3.40262 l -20.9435603,0 c -2.2046308,0 -3.0539832,-1.517336 -1.8887031,-3.40262 z m 1.575767,13.8516074 c 0.552285,0 1,-0.453036 1,-0.99703 l 0,-6.0059401 c 0,-0.550644 -0.443865,-0.99703 -1,-0.99703 -0.552285,0 -1,0.453036 -1,0.99703 l 0,6.0059401 c 0,0.550644 0.443865,0.99703 1,0.99703 z m 0,4 c 0.552285,0 1,-0.447715 1,-1 0,-0.552285 -0.447715,-1 -1,-1 -0.552285,0 -1,0.447715 -1,1 0,0.552285 0.447715,1 1,1 z m 0,0"
id="Triangle 29" id="fill-edit"
style="fill:#eb8c1e;fill-opacity:1" style="fill:#eb8c1e;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1"
inkscape:connector-curvature="0" /> inkscape:connector-curvature="0" />
</g>
</g>
</svg> </svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 2.3 KiB

12
public_html/image/header/notif/bell.svg
View File

@ -33,14 +33,14 @@
id="namedview4201" id="namedview4201"
showgrid="false" showgrid="false"
inkscape:zoom="6.7169026" inkscape:zoom="6.7169026"
inkscape:cx="70.865997" inkscape:cx="68.781703"
inkscape:cy="70.865997" inkscape:cy="70.865997"
inkscape:window-x="0" inkscape:window-x="0"
inkscape:window-y="24" inkscape:window-y="24"
inkscape:window-maximized="1" inkscape:window-maximized="1"
inkscape:current-layer="Livello_1" /><g inkscape:current-layer="Livello_1" /><g
id="Livello_114"><path id="g5841"><path
d="M135.055,115.131c0-3.528-2.861-6.396-6.395-6.396c-8.83,0-15.988-7.158-15.988-15.99V54.367 c0-20.006-14.209-36.709-33.139-40.679c0.588-1.242,0.928-2.628,0.928-4.095C80.462,4.296,76.165,0,70.866,0 c-5.299,0-9.594,4.296-9.594,9.598c0,1.467,0.339,2.853,0.927,4.095c-18.928,3.97-33.137,20.673-33.137,40.679v38.377 c0,8.832-7.159,15.99-15.99,15.99c-3.533,0-6.396,2.864-6.396,6.396c0,3.531,2.862,6.396,6.396,6.396h15.99h29.011 c0,9.716,5.729,17.591,12.793,17.591c7.064,0,12.792-7.875,12.792-17.591h29.014h15.988l0,0 C132.194,121.526,135.055,118.664,135.055,115.131" d="m 135.055,115.131 c 0,-3.528 -2.861,-6.396 -6.395,-6.396 -8.83,0 -15.988,-7.158 -15.988,-15.99 l 0,-38.378 C 112.672,34.361 98.463,17.658 79.533,13.688 80.121,12.446 80.461,11.06 80.461,9.593 80.462,4.296 76.165,0 70.866,0 c -5.299,0 -9.594,4.296 -9.594,9.598 0,1.467 0.339,2.853 0.927,4.095 -18.928,3.97 -33.137,20.673 -33.137,40.679 l 0,38.377 c 0,8.832 -7.159,15.99 -15.99,15.99 -3.533,0 -6.396,2.864 -6.396,6.396 0,3.531 2.862,6.396 6.396,6.396 l 15.99,0 29.011,0 c 0,9.716 5.729,17.591 12.793,17.591 7.064,0 12.792,-7.875 12.792,-17.591 l 29.014,0 15.988,0 0,0 c 3.534,-0.005 6.395,-2.867 6.395,-6.4"
id="path4198" id="fill-edit"
style="fill:#ffffff" /></g><g style="fill:#ffffff"
id="Livello_1_1_" /></svg> inkscape:connector-curvature="0" /></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.1 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

36
public_html/image/header/notif/menu.svg
View File

@ -34,16 +34,16 @@
guidetolerance="10" guidetolerance="10"
inkscape:pageopacity="0" inkscape:pageopacity="0"
inkscape:pageshadow="2" inkscape:pageshadow="2"
inkscape:window-width="640" inkscape:window-width="1920"
inkscape:window-height="480" inkscape:window-height="1056"
id="namedview4219" id="namedview4219"
showgrid="false" showgrid="false"
inkscape:zoom="14.75" inkscape:zoom="3.6875"
inkscape:cx="8" inkscape:cx="-10.285784"
inkscape:cy="8" inkscape:cy="17.130472"
inkscape:window-x="0" inkscape:window-x="0"
inkscape:window-y="24" inkscape:window-y="24"
inkscape:window-maximized="0" inkscape:window-maximized="1"
inkscape:current-layer="svg4207" /> inkscape:current-layer="svg4207" />
<title <title
id="title4209" /> id="title4209" />
@ -51,24 +51,10 @@
id="desc4211" /> id="desc4211" />
<defs <defs
id="defs4213" /> id="defs4213" />
<g
fill="none"
fill-rule="evenodd"
id="Page-1"
stroke="none"
stroke-width="1">
<g
fill="#000000"
id="Core"
transform="translate(-340.000000, -4.000000)">
<g
id="apps"
transform="translate(340.000000, 4.000000)">
<path <path
d="M0,4 L4,4 L4,0 L0,0 L0,4 L0,4 Z M6,16 L10,16 L10,12 L6,12 L6,16 L6,16 Z M0,16 L4,16 L4,12 L0,12 L0,16 L0,16 Z M0,10 L4,10 L4,6 L0,6 L0,10 L0,10 Z M6,10 L10,10 L10,6 L6,6 L6,10 L6,10 Z M12,0 L12,4 L16,4 L16,0 L12,0 L12,0 Z M6,4 L10,4 L10,0 L6,0 L6,4 L6,4 Z M12,10 L16,10 L16,6 L12,6 L12,10 L12,10 Z M12,16 L16,16 L16,12 L12,12 L12,16 L12,16 Z" inkscape:connector-curvature="0"
id="Shape" style="fill:#ffffff;fill-rule:evenodd;stroke:none;stroke-width:1"
style="fill:#ffffff" /> id="fill-edit"
</g> d="M 0,4 4,4 4,0 0,0 0,4 0,4 Z m 6,12 4,0 0,-4 -4,0 0,4 0,0 z m -6,0 4,0 0,-4 -4,0 0,4 0,0 z m 0,-6 4,0 0,-4 -4,0 0,4 0,0 z m 6,0 4,0 0,-4 -4,0 0,4 0,0 z m 6,-10 0,4 4,0 0,-4 -4,0 0,0 z M 6,4 10,4 10,0 6,0 6,4 6,4 Z m 6,6 4,0 0,-4 -4,0 0,4 0,0 z m 0,6 4,0 0,-4 -4,0 0,4 0,0 z"
</g> class="fill-edit" />
</g>
</svg> </svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

18
public_html/image/header/notif/message.svg
View File

@ -28,19 +28,19 @@
guidetolerance="10" guidetolerance="10"
inkscape:pageopacity="0" inkscape:pageopacity="0"
inkscape:pageshadow="2" inkscape:pageshadow="2"
inkscape:window-width="640" inkscape:window-width="1920"
inkscape:window-height="480" inkscape:window-height="1056"
id="namedview4226" id="namedview4226"
showgrid="false" showgrid="false"
inkscape:zoom="9.8333333" inkscape:zoom="9.8333333"
inkscape:cx="12" inkscape:cx="-22.067797"
inkscape:cy="12" inkscape:cy="12"
inkscape:window-x="0" inkscape:window-x="0"
inkscape:window-y="24" inkscape:window-y="24"
inkscape:window-maximized="0" inkscape:window-maximized="1"
inkscape:current-layer="Layer_1" /><path inkscape:current-layer="Layer_1" /><path
clip-rule="evenodd" d="M 11.984,13 C 10.031,13 -0.031,4.891 -0.031,4.891 l 0,-0.891 c 0,-1.104 0.896,-2 2.002,-2 L 21.997,2 C 23.104,2 24,2.896 24,4 l -0.016,1 c 0,0 -9.953,8 -12,8 z m 0,2.75 c 2.141,0 12,-7.75 12,-7.75 L 24,20 c 0,1.104 -0.896,2 -2.003,2 L 1.971,22 C 0.866,22 -0.031,21.104 -0.031,20 L -0.015,8 c -0.001,0 10.046,7.75 11.999,7.75 z"
d="M11.984,13C10.031,13-0.031,4.891-0.031,4.891V4c0-1.104,0.896-2,2.002-2h20.026 C23.104,2,24,2.896,24,4l-0.016,1C23.984,5,14.031,13,11.984,13z M11.984,15.75c2.141,0,12-7.75,12-7.75L24,20 c0,1.104-0.896,2-2.003,2H1.971c-1.105,0-2.002-0.896-2.002-2l0.016-12C-0.016,8,10.031,15.75,11.984,15.75z" id="fill-edit"
fill-rule="evenodd" style="clip-rule:evenodd;fill:#ffffff;fill-rule:evenodd"
id="path4224" class="fill-edit"
style="fill:#ffffff" /></svg> inkscape:connector-curvature="0" /></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

14
public_html/image/header/notif/search.svg
View File

@ -32,13 +32,15 @@
inkscape:window-height="1056" inkscape:window-height="1056"
id="namedview4235" id="namedview4235"
showgrid="false" showgrid="false"
inkscape:zoom="0.4609375" inkscape:zoom="1.3037281"
inkscape:cx="256" inkscape:cx="-124.44228"
inkscape:cy="516.33898" inkscape:cy="283.03834"
inkscape:window-x="0" inkscape:window-x="0"
inkscape:window-y="24" inkscape:window-y="24"
inkscape:window-maximized="1" inkscape:window-maximized="1"
inkscape:current-layer="Layer_1" /><path inkscape:current-layer="Layer_1" /><path
d="M445,386.7l-84.8-85.9c13.8-24.1,21-50.9,21-77.9c0-87.6-71.2-158.9-158.6-158.9C135.2,64,64,135.3,64,222.9 c0,87.6,71.2,158.9,158.6,158.9c27.9,0,55.5-7.7,80.1-22.4l84.4,85.6c1.9,1.9,4.6,3.1,7.3,3.1c2.7,0,5.4-1.1,7.3-3.1l43.3-43.8 C449,397.1,449,390.7,445,386.7z M222.6,125.9c53.4,0,96.8,43.5,96.8,97c0,53.5-43.4,97-96.8,97c-53.4,0-96.8-43.5-96.8-97 C125.8,169.4,169.2,125.9,222.6,125.9z" d="m 445,386.7 -84.8,-85.9 c 13.8,-24.1 21,-50.9 21,-77.9 C 381.2,135.3 310,64 222.6,64 135.2,64 64,135.3 64,222.9 c 0,87.6 71.2,158.9 158.6,158.9 27.9,0 55.5,-7.7 80.1,-22.4 l 84.4,85.6 c 1.9,1.9 4.6,3.1 7.3,3.1 2.7,0 5.4,-1.1 7.3,-3.1 L 445,401.2 c 4,-4.1 4,-10.5 0,-14.5 z M 222.6,125.9 c 53.4,0 96.8,43.5 96.8,97 0,53.5 -43.4,97 -96.8,97 -53.4,0 -96.8,-43.5 -96.8,-97 0,-53.5 43.4,-97 96.8,-97 z"
id="path4233" id="fill-edit"
style="fill:#ffffff" /></svg> style="fill:#ffffff"
class="fill-edit"
inkscape:connector-curvature="0" /></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

55
public_html/image/menu/dashboard.svg
View File

@ -1 +1,54 @@
<?xml version="1.0" ?><svg height="48" viewBox="0 0 48 48" width="48" xmlns="http://www.w3.org/2000/svg"><path d="M0 0h48v48h-48z" fill="none"/><path d="M6 26h16v-20h-16v20zm0 16h16v-12h-16v12zm20 0h16v-20h-16v20zm0-36v12h16v-12h-16z"/></svg> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
height="48"
viewBox="0 0 48 48"
width="48"
id="svg4262"
version="1.1"
inkscape:version="0.91 r13725"
sodipodi:docname="dashboard.svg">
<metadata
id="metadata4272">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs4270" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1056"
id="namedview4268"
showgrid="false"
inkscape:zoom="19.833333"
inkscape:cx="24"
inkscape:cy="24"
inkscape:window-x="0"
inkscape:window-y="24"
inkscape:window-maximized="1"
inkscape:current-layer="svg4262" />
<path
d="M 6,26 22,26 22,6 6,6 6,26 Z m 0,16 16,0 0,-12 -16,0 0,12 z m 20,0 16,0 0,-20 -16,0 0,20 z M 26,6 26,18 42,18 42,6 26,6 Z"
id="fill-edit"
inkscape:connector-curvature="0" />
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 242 B

After

Width:  |  Height:  |  Size: 1.6 KiB

44
public_html/image/menu/messages.svg
View File

@ -1 +1,43 @@
<?xml version="1.0" ?><svg style="enable-background:new 0 0 24 24;" version="1.1" viewBox="0 0 24 24" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="info"/><g id="icons"><path d="M20,1H4C1.8,1,0,2.8,0,5v10c0,2.2,1.8,4,4,4v3c0,0.9,1.1,1.3,1.7,0.7L9.4,19H20c2.2,0,4-1.8,4-4V5 C24,2.8,22.2,1,20,1z M14,13H8c-0.6,0-1-0.4-1-1c0-0.6,0.4-1,1-1h6c0.6,0,1,0.4,1,1C15,12.6,14.6,13,14,13z M16,9H8 C7.4,9,7,8.6,7,8c0-0.6,0.4-1,1-1h8c0.6,0,1,0.4,1,1C17,8.6,16.6,9,16,9z" id="message"/></g></svg> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
style="enable-background:new 0 0 24 24;"
version="1.1"
viewBox="0 0 24 24"
xml:space="preserve"
id="svg4274"
inkscape:version="0.91 r13725"
sodipodi:docname="messages.svg"><metadata
id="metadata4283"><rdf:RDF><cc:Work
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
id="defs4281" /><sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="715"
inkscape:window-height="480"
id="namedview4279"
showgrid="false"
inkscape:zoom="9.8333333"
inkscape:cx="12"
inkscape:cy="12"
inkscape:window-x="0"
inkscape:window-y="24"
inkscape:window-maximized="0"
inkscape:current-layer="svg4274" /><g
id="info" /><path
inkscape:connector-curvature="0"
id="fill-edit"
d="M 20,1 4,1 C 1.8,1 0,2.8 0,5 l 0,10 c 0,2.2 1.8,4 4,4 l 0,3 c 0,0.9 1.1,1.3 1.7,0.7 L 9.4,19 20,19 c 2.2,0 4,-1.8 4,-4 L 24,5 C 24,2.8 22.2,1 20,1 Z M 14,13 8,13 C 7.4,13 7,12.6 7,12 7,11.4 7.4,11 8,11 l 6,0 c 0.6,0 1,0.4 1,1 0,0.6 -0.4,1 -1,1 z M 16,9 8,9 C 7.4,9 7,8.6 7,8 7,7.4 7.4,7 8,7 l 8,0 c 0.6,0 1,0.4 1,1 0,0.6 -0.4,1 -1,1 z" /></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 545 B

After

Width:  |  Height:  |  Size: 1.8 KiB

46
public_html/image/menu/profile.svg
View File

@ -1 +1,45 @@
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg enable-background="new 0 0 48 48" height="48px" id="Layer_1" version="1.1" viewBox="0 0 48 48" width="48px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path clip-rule="evenodd" d="M43,42H5c-2.209,0-4-1.791-4-4V17c0-2.209,1.791-4,4-4h15V9c0-2.209,1.791-4,4-4 s4,1.791,4,4v4h15c2.209,0,4,1.791,4,4v21C47,40.209,45.209,42,43,42z M17.014,34.488c0,0.003,0,0.004,0,0.004 c-0.004,0-0.018-0.781-0.018-0.781s1.166-0.601,2.031-1.378c0.507-0.417,0.741-1.362,0.741-1.362 c0.137-0.828,0.238-2.877,0.238-3.703c0-2.062-1.033-4.28-4.007-4.28V22.98v0.007c-2.974,0-4.007,2.219-4.007,4.28 c0,0.826,0.102,2.875,0.238,3.703c0,0,0.234,0.945,0.741,1.362c0.865,0.777,2.031,1.378,2.031,1.378s-0.014,0.781-0.018,0.781 c0,0,0-0.001,0-0.004c0,0,0.029,1.146,0.029,1.487c0,1.362-1.365,2.018-2.223,2.018c-0.002,0-0.002,0-0.003,0 c-2.593,0.113-3.205,0.976-3.21,0.984C9.419,39.23,9.199,39.482,8.998,40h14.004c-0.201-0.518-0.421-0.77-0.582-1.022 c-0.005-0.009-0.617-0.871-3.21-0.984c-0.001,0-0.001,0-0.003,0c-0.857,0-2.223-0.655-2.223-2.018 C16.984,35.634,17.014,34.488,17.014,34.488z M26,9c0-1.104-0.896-2-2-2s-2,0.896-2,2v6c0,1.104,0.896,2,2,2s2-0.896,2-2V9z M45,17 c0-1.104-0.896-2-2-2H28c0,2.209-1.791,4-4,4s-4-1.791-4-4H5c-1.104,0-2,0.896-2,2v21c0,1.104,0.896,2,2,2h1.797 c0.231-0.589,0.656-1.549,1.16-2.24c0.025-0.014,0.848-1.739,4.998-1.79c0.006-0.021,0.01-1.042,0.022-1.027 c-0.32-0.202-0.737-0.516-1.051-0.816c-0.255-0.156-1.161-1.029-1.452-2.583c-0.087-0.542-0.488-3.099-0.488-4.166 c0-3.171,1.265-6.381,5.953-6.381c0.021,0,0.1,0,0.121,0c4.688,0,5.953,3.21,5.953,6.381c0,1.067-0.401,3.624-0.488,4.166 c-0.291,1.554-1.197,2.427-1.452,2.583c-0.313,0.301-0.73,0.614-1.051,0.816c0.013-0.015,0.017,1.007,0.022,1.027 c4.151,0.051,4.974,1.776,4.998,1.79c0.504,0.691,0.929,1.651,1.16,2.24H43c1.104,0,2-0.896,2-2V17z M40,26H28c-0.553,0-1-0.447-1-1 s0.447-1,1-1h12c0.553,0,1,0.447,1,1S40.553,26,40,26z M28,30h2c0.553,0,1,0.447,1,1s-0.447,1-1,1h-2c-0.553,0-1-0.447-1-1 S27.447,30,28,30z M28,34h6c0.553,0,1,0.447,1,1s-0.447,1-1,1h-6c-0.553,0-1-0.447-1-1S27.447,34,28,34z M32,31c0-0.553,0.447-1,1-1 h4c0.553,0,1,0.447,1,1s-0.447,1-1,1h-4C32.447,32,32,31.553,32,31z M23,9h2v2h-2V9z" fill-rule="evenodd"/></svg> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
enable-background="new 0 0 48 48"
height="48px"
id="Layer_1"
version="1.1"
viewBox="0 0 48 48"
width="48px"
xml:space="preserve"
inkscape:version="0.91 r13725"
sodipodi:docname="profile.svg"><metadata
id="metadata4223"><rdf:RDF><cc:Work
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
id="defs4221" /><sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1056"
id="namedview4219"
showgrid="false"
inkscape:zoom="13.906433"
inkscape:cx="16.712255"
inkscape:cy="22.408078"
inkscape:window-x="0"
inkscape:window-y="24"
inkscape:window-maximized="1"
inkscape:current-layer="Layer_1" /><path
d="M 43,42 5,42 C 2.791,42 1,40.209 1,38 L 1,17 c 0,-2.209 1.791,-4 4,-4 l 15,0 0,-4 c 0,-2.209 1.791,-4 4,-4 2.209,0 4,1.791 4,4 l 0,4 15,0 c 2.209,0 4,1.791 4,4 l 0,21 c 0,2.209 -1.791,4 -4,4 z M 17.014,34.488 c 0,0.003 0,0.004 0,0.004 -0.004,0 -0.018,-0.781 -0.018,-0.781 0,0 1.166,-0.601 2.031,-1.378 0.507,-0.417 0.741,-1.362 0.741,-1.362 0.137,-0.828 0.238,-2.877 0.238,-3.703 0,-2.062 -1.033,-4.28 -4.007,-4.28 l 0,-0.008 0,0.007 c -2.974,0 -4.007,2.219 -4.007,4.28 0,0.826 0.102,2.875 0.238,3.703 0,0 0.234,0.945 0.741,1.362 0.865,0.777 2.031,1.378 2.031,1.378 0,0 -0.014,0.781 -0.018,0.781 0,0 0,-10e-4 0,-0.004 0,0 0.029,1.146 0.029,1.487 0,1.362 -1.365,2.018 -2.223,2.018 -0.002,0 -0.002,0 -0.003,0 -2.593,0.113 -3.205,0.976 -3.21,0.984 C 9.419,39.23 9.199,39.482 8.998,40 l 14.004,0 c -0.201,-0.518 -0.421,-0.77 -0.582,-1.022 -0.005,-0.009 -0.617,-0.871 -3.21,-0.984 -0.001,0 -0.001,0 -0.003,0 -0.857,0 -2.223,-0.655 -2.223,-2.018 0,-0.342 0.03,-1.488 0.03,-1.488 z M 26,9 C 26,7.896 25.104,7 24,7 22.896,7 22,7.896 22,9 l 0,6 c 0,1.104 0.896,2 2,2 1.104,0 2,-0.896 2,-2 l 0,-6 z m 19,8 c 0,-1.104 -0.896,-2 -2,-2 l -15,0 c 0,2.209 -1.791,4 -4,4 -2.209,0 -4,-1.791 -4,-4 L 5,15 c -1.104,0 -2,0.896 -2,2 l 0,21 c 0,1.104 0.896,2 2,2 l 1.797,0 c 0.231,-0.589 0.656,-1.549 1.16,-2.24 0.025,-0.014 0.848,-1.739 4.998,-1.79 0.006,-0.021 0.01,-1.042 0.022,-1.027 -0.32,-0.202 -0.737,-0.516 -1.051,-0.816 -0.255,-0.156 -1.161,-1.029 -1.452,-2.583 -0.087,-0.542 -0.488,-3.099 -0.488,-4.166 0,-3.171 1.265,-6.381 5.953,-6.381 0.021,0 0.1,0 0.121,0 4.688,0 5.953,3.21 5.953,6.381 0,1.067 -0.401,3.624 -0.488,4.166 -0.291,1.554 -1.197,2.427 -1.452,2.583 -0.313,0.301 -0.73,0.614 -1.051,0.816 0.013,-0.015 0.017,1.007 0.022,1.027 4.151,0.051 4.974,1.776 4.998,1.79 0.504,0.691 0.929,1.651 1.16,2.24 L 43,40 c 1.104,0 2,-0.896 2,-2 l 0,-21 z m -5,9 -12,0 c -0.553,0 -1,-0.447 -1,-1 0,-0.553 0.447,-1 1,-1 l 12,0 c 0.553,0 1,0.447 1,1 0,0.553 -0.447,1 -1,1 z m -12,4 2,0 c 0.553,0 1,0.447 1,1 0,0.553 -0.447,1 -1,1 l -2,0 c -0.553,0 -1,-0.447 -1,-1 0,-0.553 0.447,-1 1,-1 z m 0,4 6,0 c 0.553,0 1,0.447 1,1 0,0.553 -0.447,1 -1,1 l -6,0 c -0.553,0 -1,-0.447 -1,-1 0,-0.553 0.447,-1 1,-1 z m 4,-3 c 0,-0.553 0.447,-1 1,-1 l 4,0 c 0.553,0 1,0.447 1,1 0,0.553 -0.447,1 -1,1 l -4,0 c -0.553,0 -1,-0.447 -1,-1 z m -9,-22 2,0 0,2 -2,0 0,-2 z"
id="fill-edit"
inkscape:connector-curvature="0"
style="clip-rule:evenodd;fill-rule:evenodd" /></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 3.8 KiB

14
view/vue-config.js
View File

@ -1,13 +1,22 @@
import {GlobalStore} from './lib/gstore-es6' import {GlobalStore} from './lib/gstore-es6'
window.gstore = new GlobalStore(); window.gstore = new GlobalStore();
// Header
window.gstore.add('header_title', 'ndli1718'); window.gstore.add('header_title', 'ndli1718');
window.gstore.add('notif', { window.gstore.add('info', {
active: false, active: false,
type: 'warning', type: 'warning',
message: 'Warning! blabla' message: 'Warning! blabla'
}); });
window.gstore.add('menu_item_active', 'dashboard'); window.gstore.add('notif', [
{ class: 'bell', count: 4 },
{ class: 'message', count: 23 },
{ class: 'search', count: '' },
{ class: 'menu', count: '' }
])
// Menu
window.gstore.add('menu_item', { window.gstore.add('menu_item', {
dashboard: { dashboard: {
label: 'Dashboard', label: 'Dashboard',
@ -20,3 +29,4 @@ window.gstore.add('menu_item', {
icon: 'messages' icon: 'messages'
} }
}); });
window.gstore.add('menu_item_active', 'dashboard');

14
view/vue/header.vue
View File

@ -8,14 +8,11 @@
</div> </div>
<!-- Header Info --> <!-- Header Info -->
<div id='header-info' v-show='gstore.notif.active' :class='gstore.notif.type'>{{ gstore.notif.message }}</div> <div id='header-info' v-show='gstore.info.active' :class='gstore.info.type'>{{ gstore.info.message }}</div>
<!-- Header Notif --> <!-- Header Notif -->
<div id='header-notif'> <div id='header-notif'>
<div class='hnotif bell' data-count='4'></div> <div v-for='notif in gstore.notif' :class='"hnotif " + notif.class' :data-count='notif.count'></div>
<div class='hnotif message'data-count='23'></div>
<div class='hnotif search'></div>
<div class='hnotif menu'></div>
</div> </div>
</div> </div>
@ -26,6 +23,11 @@
<script> <script>
export default { export default {
name: 'HEADER', name: 'HEADER',
data(){ return { gstore: window.gstore.data }; } data(){ return { gstore: window.gstore.data }; },
methods: {
show_notif(){
}
}
} }
</script> </script>

2
view/vue/menu.vue
View File

@ -4,7 +4,7 @@
<div v-for='(item, index) in gstore.menu_item' class='menu-item-wrapper'> <div v-for='(item, index) in gstore.menu_item' class='menu-item-wrapper'>
<div :class="(index == gstore.menu_item_active) ? 'menu-item active' : 'menu-item'" @click='navigate_menu(index)'>{{ item.label }}</div> <div :class="(index == gstore.menu_item_active) ? 'menu-item active' : 'menu-item'" @click='navigate_menu(index)' :style='"background-image: url(/image/menu/" + item.icon + ".svg@aaaaaa"'>{{ item.label }}</div>
</div> </div>