From 9a3d52d7471e92b043e9e553859c431f95c53386 Mon Sep 17 00:00:00 2001 From: xdrm-brackets Date: Tue, 2 Feb 2016 23:56:48 +0100 Subject: [PATCH] - [x] Design de structure (layout navigation) - [x] Header - [x] Menu-side - [x] Submenu-side --- css/constants.scss | 4 +- css/container.css | 2 +- css/container.scss | 33 ++++++++++-- src/static/sub-menu-side/create.svg | 31 +++++------ src/static/sub-menu-side/edit.svg | 59 ++++++++++++++++++++- src/static/sub-menu-side/filter.svg | 81 ++++++++++++++++++++++++++++- src/static/sub-menu-side/remove.svg | 62 +++++++++++++++++++++- src/static/sub-menu-side/search.svg | 51 +++++++++++++++++- src/static/sub-menu-side/view.svg | 48 +++++++++++++++++ todo.md | 5 +- view/machines.php | 35 +++++++++++-- 11 files changed, 380 insertions(+), 31 deletions(-) create mode 100644 src/static/sub-menu-side/view.svg diff --git a/css/constants.scss b/css/constants.scss index 0b86bd2..d0042b8 100644 --- a/css/constants.scss +++ b/css/constants.scss @@ -1,2 +1,4 @@ $theme-color: #4662d4; -$theme-color: #00A6EB; \ No newline at end of file +$theme-color: #00A6EB; + +$sub-menu-color: #5b5e63; \ No newline at end of file diff --git a/css/container.css b/css/container.css index 5ac7da1..0195c45 100755 --- a/css/container.css +++ b/css/container.css @@ -1,2 +1,2 @@ -#WRAPPER>#CONTAINER>.sub-menu-side{display:block;position:relative}#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink]{display:block;position:relative;padding:.3em 1.5em;border-radius:3px;background:url("../src/?static/sub-menu-side.svg") left 0.25em center no-repeat;background-size:1.1em;color:#5b5e63;text-shadow:1px 1px white;white-space:nowrap;transition:all .2s;cursor:pointer}#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink]:hover,#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink].active{background-color:#d8deea;box-shadow:inset 0 0 4px #c8ced9} +#WRAPPER>#CONTAINER>.sub-menu-side{display:block;position:relative}#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink]{display:block;position:relative;padding:.3em 1.5em;margin:1em 0;border-radius:3px;background:url("../src/?static/sub-menu-side.svg") left 0.25em center no-repeat;background-size:1.1em;color:#5b5e63;text-shadow:1px 1px white;white-space:nowrap;transition:all .2s;cursor:pointer}#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink]>.svg>svg{display:inline-block;position:absolute;left:.25em;top:50%;width:1em;height:1em;transform:translateY(-50%)}#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink]>.svg>svg path{fill:#5b5e63 !important}#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink]:hover,#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink].active{color:#121213;background-color:#d8deea;box-shadow:inset 0 0 4px #c8ced9}#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink]:hover>.svg>svg path,#WRAPPER>#CONTAINER>.sub-menu-side>span[data-sublink].active>.svg>svg path{fill:#121213 !important} /*# sourceMappingURL=container.css.map */ diff --git a/css/container.scss b/css/container.scss index 542d0dc..4589de6 100755 --- a/css/container.scss +++ b/css/container.scss @@ -1,3 +1,5 @@ +@import 'constants'; + #WRAPPER > #CONTAINER{ /**************************/ @@ -13,24 +15,49 @@ position: relative; padding: .3em 1.5em; + margin: 1em 0; border-radius: 3px; background: url('../src/?static/sub-menu-side.svg') left .25em center no-repeat; background-size: 1.1em; - color: #5b5e63; + color: $sub-menu-color; text-shadow: 1px 1px white; white-space: nowrap; transition: all .2s; - cursor: pointer; + cursor: pointer; + + // Dimension/Position des svg (icones) + & > .svg > svg{ + display: inline-block; + position: absolute; + left: .25em; + top: 50%; + width: 1em; + height: 1em; + + transform: translateY(-50%); + + // Coloration pour tous les elements du svg + & path{ + fill: $sub-menu-color !important; + } + } + &:hover, &.active{ + color: darken($sub-menu-color, 30); background-color: #d8deea; - box-shadow: inset 0 0 4px #c8ced9; + box-shadow: inset 0 0 4px #c8ced9; + + & > .svg > svg path{ + fill: darken($sub-menu-color, 30) !important; + } + } } diff --git a/src/static/sub-menu-side/create.svg b/src/static/sub-menu-side/create.svg index 5628266..622ee01 100644 --- a/src/static/sub-menu-side/create.svg +++ b/src/static/sub-menu-side/create.svg @@ -7,13 +7,13 @@ 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="32px" + height="32" version="1.1" viewBox="0 0 32 32" - width="32px" + width="32" id="svg3901" inkscape:version="0.48.4 r9939" - sodipodi:docname="18.svg"> + sodipodi:docname="create.svg"> @@ -22,7 +22,7 @@ image/svg+xml - + @@ -40,32 +40,33 @@ id="namedview3912" showgrid="false" inkscape:zoom="20.85965" - inkscape:cx="12.887181" - inkscape:cy="17.571155" + inkscape:cx="12.418431" + inkscape:cy="17.102405" inkscape:window-x="0" inkscape:window-y="24" inkscape:window-maximized="1" inkscape:current-layer="icon-150-tag-checked" - inkscape:snap-page="true" /> + inkscape:snap-page="true" + fit-margin-top="0" + fit-margin-left="0" + fit-margin-right="0" + fit-margin-bottom="0" /> + style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none" + transform="translate(-0.46875,0.46875)"> + d="m 16.46875,-0.46875 c -8.8297825,0 -16,7.1702185 -16,16 0,8.829782 7.1702175,16 16,16 8.829781,0 16,-7.170218 16,-16 0,-8.8297815 -7.170219,-16 -16,-16 z m 6.889336,9.3360161 2.124749,2.1247489 -11.20322,11.203219 -6.8249495,-6.82495 2.1247485,-2.156941 4.700201,4.732394 9.078471,-9.0784709 z" + id="path4447" + inkscape:connector-curvature="0" /> diff --git a/src/static/sub-menu-side/edit.svg b/src/static/sub-menu-side/edit.svg index 203eb70..4e0a0fb 100644 --- a/src/static/sub-menu-side/edit.svg +++ b/src/static/sub-menu-side/edit.svg @@ -1 +1,58 @@ - \ No newline at end of file + + + + + + image/svg+xml + + + + + + + + diff --git a/src/static/sub-menu-side/filter.svg b/src/static/sub-menu-side/filter.svg index 925e5dd..6061116 100644 --- a/src/static/sub-menu-side/filter.svg +++ b/src/static/sub-menu-side/filter.svg @@ -1 +1,80 @@ - \ No newline at end of file + +image/svg+xml \ No newline at end of file diff --git a/src/static/sub-menu-side/remove.svg b/src/static/sub-menu-side/remove.svg index 8ca0e3c..1cd55e8 100644 --- a/src/static/sub-menu-side/remove.svg +++ b/src/static/sub-menu-side/remove.svg @@ -1 +1,61 @@ - \ No newline at end of file + + + + + + image/svg+xml + + + + + + + + + diff --git a/src/static/sub-menu-side/search.svg b/src/static/sub-menu-side/search.svg index 8708b76..bbfb93a 100644 --- a/src/static/sub-menu-side/search.svg +++ b/src/static/sub-menu-side/search.svg @@ -1 +1,50 @@ - \ No newline at end of file + +image/svg+xml \ No newline at end of file diff --git a/src/static/sub-menu-side/view.svg b/src/static/sub-menu-side/view.svg new file mode 100644 index 0000000..dabe4ff --- /dev/null +++ b/src/static/sub-menu-side/view.svg @@ -0,0 +1,48 @@ + +image/svg+xml \ No newline at end of file diff --git a/todo.md b/todo.md index 4bbb1d8..f7366df 100644 --- a/todo.md +++ b/todo.md @@ -10,14 +10,15 @@ # EN COURS # ############ -- [.] Design de structure (layout) +- [x] Design de structure (layout navigation) - [x] Header - [x] Menu-side - - [.] Submenu-side + - [x] Submenu-side - [.] Gestion JS de la navigation - [x] Gestion de liens+URL du menu - [ ] Gestion des liens+URL du submenu + - [ ] onload du xhr, on lance le script sur le DOM ######## # FAIT # diff --git a/view/machines.php b/view/machines.php index fbcdb07..0ddbbc6 100644 --- a/view/machines.php +++ b/view/machines.php @@ -1,11 +1,36 @@