Ajout du sous-menu
This commit is contained in:
xdrm-brackets
parent
8ed2e14304
commit
6e01601baf
|
|
@ -1,2 +1,2 @@
|
|||
#WRAPPER>#CONTAINER>section{display:block;position:relative;flex-grow:1;padding:1.5em;border-radius:5px;background-color:#fff;color:#000;font-size:1.2em}#WRAPPER>#CONTAINER>section h6{color:#848484;font-size:1.2em;text-transform:uppercase;font-weight:300;letter-spacing:.2em;margin:0;padding:0}#WRAPPER>#CONTAINER>section input[type="radio"],#WRAPPER>#CONTAINER>section input[type="checkbox"]{display:none}#WRAPPER>#CONTAINER>section input[type="radio"]+label[for],#WRAPPER>#CONTAINER>section input[type="checkbox"]+label[for]{padding-left:.8em;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#WRAPPER>#CONTAINER>section input[type="radio"]+label[for]:before,#WRAPPER>#CONTAINER>section input[type="checkbox"]+label[for]:before{content:'';display:inline-block;position:relative;top:.1em;left:-.8em;width:calc( 1em - 2*.15em );height:calc( 1em - 2*.15em );border-radius:50% / 50%;border:0.15em solid #53d192;background:#fff center center no-repeat;background-image:none;background-size:70% auto;transition:background .2s ease-in-out;cursor:pointer}#WRAPPER>#CONTAINER>section input[type="radio"]:checked+label[for]:before,#WRAPPER>#CONTAINER>section input[type="checkbox"]:checked+label[for]:before{background-color:#53d192;background-image:url("/f/svg/checked/st/container")}#WRAPPER>#CONTAINER>section input[type="checkbox"]+label[for]:before{border-radius:3px}#WRAPPER>#CONTAINER>section input[type="button"]{margin:.5em;padding:.5em;border-radius:5px;border:3px solid #515151;font-weight:bold;color:#515151;background-color:#fff;transition:background .1s ease-in-out, color .1s ease-in-out}#WRAPPER>#CONTAINER>section input[type="button"]:active{background-color:#515151;color:#fff}#WRAPPER>#CONTAINER>section input[type="button"].primary{border-color:#53d192;color:#53d192;background-color:#fff}#WRAPPER>#CONTAINER>section input[type="button"].primary:active{background-color:#53d192;color:#fff}
|
||||
#WRAPPER>#CONTAINER>section{display:none;position:relative;flex-grow:1;padding:1.5em;border-radius:5px;background-color:#fff;color:#000;font-size:1.2em}#WRAPPER>#CONTAINER>section.active{display:block}#WRAPPER>#CONTAINER>section h6{color:#848484;font-size:1.2em;text-transform:uppercase;font-weight:300;letter-spacing:.2em;margin:0;padding:0}#WRAPPER>#CONTAINER>section input[type="radio"],#WRAPPER>#CONTAINER>section input[type="checkbox"]{display:none}#WRAPPER>#CONTAINER>section input[type="radio"]+label[for],#WRAPPER>#CONTAINER>section input[type="checkbox"]+label[for]{padding-left:.8em;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#WRAPPER>#CONTAINER>section input[type="radio"]+label[for]:before,#WRAPPER>#CONTAINER>section input[type="checkbox"]+label[for]:before{content:'';display:inline-block;position:relative;top:.1em;left:-.8em;width:calc( 1em - 2*.15em );height:calc( 1em - 2*.15em );border-radius:50% / 50%;border:0.15em solid #53d192;background:#fff center center no-repeat;background-image:none;background-size:70% auto;transition:background .2s ease-in-out;cursor:pointer}#WRAPPER>#CONTAINER>section input[type="radio"]:checked+label[for]:before,#WRAPPER>#CONTAINER>section input[type="checkbox"]:checked+label[for]:before{background-color:#53d192;background-image:url("/f/svg/checked/st/container")}#WRAPPER>#CONTAINER>section input[type="checkbox"]+label[for]:before{border-radius:3px}#WRAPPER>#CONTAINER>section input[type="button"]{margin:.5em;padding:.5em;border-radius:5px;border:3px solid #515151;font-weight:bold;color:#515151;background-color:#fff;transition:background .1s ease-in-out, color .1s ease-in-out}#WRAPPER>#CONTAINER>section input[type="button"]:active{background-color:#515151;color:#fff}#WRAPPER>#CONTAINER>section input[type="button"].primary{border-color:#53d192;color:#53d192;background-color:#fff}#WRAPPER>#CONTAINER>section input[type="button"].primary:active{background-color:#53d192;color:#fff}
|
||||
/*# sourceMappingURL=container.css.map */
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "AAMC,2BAAW,CACV,OAAO,CAAE,KAAK,CACd,QAAQ,CAAE,QAAQ,CAClB,SAAS,CAAE,CAAC,CAEZ,OAAO,CAAE,KAAK,CAEd,aAAa,CAAE,GAAG,CAElB,gBAAgB,CAAE,IAAI,CAEtB,KAAK,CAAE,IAAI,CACX,SAAS,CAAE,KAAK,CAMhB,8BAAI,CACH,KAAK,CAAE,OAAsB,CAC7B,SAAS,CAAE,KAAK,CAChB,cAAc,CAAE,SAAS,CACzB,WAAW,CAAE,GAAG,CAChB,cAAc,CAAE,IAAI,CAEpB,MAAM,CAAE,CAAC,CACT,OAAO,CAAE,CAAC,CAYX,kGACwB,CACvB,OAAO,CAAE,IAAI,CAId,wHACqC,CACpC,YAAY,CAAE,IAAI,CAGlB,qBAAqB,CAAE,IAAI,CAC3B,mBAAmB,CAAI,IAAI,CAC3B,kBAAkB,CAAK,IAAI,CAC3B,gBAAgB,CAAO,IAAI,CAC3B,eAAe,CAAQ,IAAI,CAC3B,WAAW,CAAY,IAAI,CAI3B,sIAAQ,CACP,OAAO,CAAE,EAAE,CACX,OAAO,CAAE,YAAY,CACrB,QAAQ,CAAE,QAAQ,CACjB,GAAG,CAAE,IAAI,CACT,IAAI,CAAE,KAAK,CACX,KAAK,CAAE,qBAAqB,CAC5B,MAAM,CAAE,qBAAqB,CAE9B,aAAa,CAAE,SAAS,CACxB,MAAM,CAAE,oBAA6B,CAErC,UAAU,CAAE,4BAA4B,CACxC,gBAAgB,CAAE,IAAI,CACtB,eAAe,CAAE,QAAQ,CAEzB,UAAU,CAAE,0BAA0B,CAEtC,MAAM,CAAE,OAAO,CAKjB,sJACoD,CACnD,gBAAgB,CCnFA,OAAO,CDoFvB,gBAAgB,CAAE,kCAAkC,CAKrD,oEAA4C,CAC3C,aAAa,CAAE,GAAG,CASnB,gDAAsB,CACrB,MAAM,CAAE,IAAI,CACZ,OAAO,CAAE,IAAI,CAEb,aAAa,CAAE,GAAG,CAClB,MAAM,CAAE,iBAAmB,CAE3B,WAAW,CAAE,IAAI,CACjB,KAAK,CC5GW,OAAO,CD8GvB,gBAAgB,CAAE,IAAI,CAEtB,UAAU,CAAE,iDAAiD,CAG7D,uDAAQ,CACP,gBAAgB,CCpHD,OAAO,CDqHtB,KAAK,CAAE,IAAI,CAKZ,wDAAS,CACR,YAAY,CC1HG,OAAO,CD2HtB,KAAK,CC3HU,OAAO,CD4HtB,gBAAgB,CAAE,IAAI,CAItB,+DAAQ,CACP,gBAAgB,CCjIF,OAAO,CDkIrB,KAAK,CAAE,IAAI",
|
||||
"mappings": "AAMC,2BAAW,CACV,OAAO,CAAE,IAAI,CAKb,QAAQ,CAAE,QAAQ,CAClB,SAAS,CAAE,CAAC,CAEZ,OAAO,CAAE,KAAK,CAEd,aAAa,CAAE,GAAG,CAElB,gBAAgB,CAAE,IAAI,CAEtB,KAAK,CAAE,IAAI,CACX,SAAS,CAAE,KAAK,CAZhB,kCAAQ,CAAC,OAAO,CAAE,KAAK,CAkBvB,8BAAI,CACH,KAAK,CAAE,OAAsB,CAC7B,SAAS,CAAE,KAAK,CAChB,cAAc,CAAE,SAAS,CACzB,WAAW,CAAE,GAAG,CAChB,cAAc,CAAE,IAAI,CAEpB,MAAM,CAAE,CAAC,CACT,OAAO,CAAE,CAAC,CAYX,kGACwB,CACvB,OAAO,CAAE,IAAI,CAId,wHACqC,CACpC,YAAY,CAAE,IAAI,CAGlB,qBAAqB,CAAE,IAAI,CAC3B,mBAAmB,CAAI,IAAI,CAC3B,kBAAkB,CAAK,IAAI,CAC3B,gBAAgB,CAAO,IAAI,CAC3B,eAAe,CAAQ,IAAI,CAC3B,WAAW,CAAY,IAAI,CAI3B,sIAAQ,CACP,OAAO,CAAE,EAAE,CACX,OAAO,CAAE,YAAY,CACrB,QAAQ,CAAE,QAAQ,CACjB,GAAG,CAAE,IAAI,CACT,IAAI,CAAE,KAAK,CACX,KAAK,CAAE,qBAAqB,CAC5B,MAAM,CAAE,qBAAqB,CAE9B,aAAa,CAAE,SAAS,CACxB,MAAM,CAAE,oBAA6B,CAErC,UAAU,CAAE,4BAA4B,CACxC,gBAAgB,CAAE,IAAI,CACtB,eAAe,CAAE,QAAQ,CAEzB,UAAU,CAAE,0BAA0B,CAEtC,MAAM,CAAE,OAAO,CAKjB,sJACoD,CACnD,gBAAgB,CCvFA,OAAO,CDwFvB,gBAAgB,CAAE,kCAAkC,CAKrD,oEAA4C,CAC3C,aAAa,CAAE,GAAG,CASnB,gDAAsB,CACrB,MAAM,CAAE,IAAI,CACZ,OAAO,CAAE,IAAI,CAEb,aAAa,CAAE,GAAG,CAClB,MAAM,CAAE,iBAAmB,CAE3B,WAAW,CAAE,IAAI,CACjB,KAAK,CChHW,OAAO,CDkHvB,gBAAgB,CAAE,IAAI,CAEtB,UAAU,CAAE,iDAAiD,CAG7D,uDAAQ,CACP,gBAAgB,CCxHD,OAAO,CDyHtB,KAAK,CAAE,IAAI,CAKZ,wDAAS,CACR,YAAY,CC9HG,OAAO,CD+HtB,KAAK,CC/HU,OAAO,CDgItB,gBAAgB,CAAE,IAAI,CAItB,+DAAQ,CACP,gBAAgB,CCrIF,OAAO,CDsIrB,KAAK,CAAE,IAAI",
|
||||
"sources": ["container.scss","constants.scss"],
|
||||
"names": [],
|
||||
"file": "container.css"
|
||||
|
|
|
|||
|
|
@ -5,7 +5,11 @@
|
|||
/* [1] Section (contenu)
|
||||
=========================================================*/
|
||||
& > section{
|
||||
display: block;
|
||||
display: none;
|
||||
|
||||
// Gestion de l'activation des sous-parties
|
||||
&.active{display: block;}
|
||||
|
||||
position: relative;
|
||||
flex-grow: 1;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,2 +1,2 @@
|
|||
#WRAPPER>#MENU-SIDE>span:not(.icon){display:block;position:relative;width:calc( 100% - 2*1em - 2*1.5em );padding:1.5em 1.5em;padding-left:calc( 1.5em + 2*1em );border-bottom:1px solid transparent;background:#32323a url("/f/svg/circle/st/menu-side/29282e") 1em center no-repeat;background-size:2em 2em;color:#ddd;text-shadow:1px 1px 0 #26262c;transition:color .2s ease-in-out, background .2s ease-in-out, box-shadow .2s ease-in-out, border .2s ease-in-out;cursor:pointer}#WRAPPER>#MENU-SIDE>span:not(.icon)>svg,#WRAPPER>#MENU-SIDE>span:not(.icon)>svg *{position:absolute;top:calc( 50% - 1em/2 );left:1.5em;width:1em;height:1em;fill:#ddd !important;transition:fill .2s ease-in-out}#WRAPPER>#MENU-SIDE>span:not(.icon):hover,#WRAPPER>#MENU-SIDE>span:not(.icon).active{border-bottom-color:#242329;box-shadow:inset 0 0 1em #27262b;background-color:#29282e;color:#fff;text-shadow:1px 1px 0 #1d1c20}#WRAPPER>#MENU-SIDE>span:not(.icon):hover>svg,#WRAPPER>#MENU-SIDE>span:not(.icon):hover>svg *,#WRAPPER>#MENU-SIDE>span:not(.icon).active>svg,#WRAPPER>#MENU-SIDE>span:not(.icon).active>svg *{fill:#53d192 !important}#WRAPPER>#MENU-SIDE>span.icon{display:block;position:relative;width:calc( 100% - 3em - 2*1.5em );height:calc( 5em - 1px );padding:0 1.5em;padding-left:calc( 1.5em + 3em );border-bottom:1px solid transparent;background:#32323a;color:#fff;text-shadow:1px 1px 0 #26262c;font-weight:bold;line-height:5em}#WRAPPER>#MENU-SIDE>span.icon>svg,#WRAPPER>#MENU-SIDE>span.icon>svg *{position:absolute;top:calc( 50% - 5em/2 );left:1.5em;height:5em}#WRAPPER>#MENU-SIDE>span.icon:hover{border-bottom-color:#242329;box-shadow:inset 0 0 1em #27262b;background-color:#29282e;color:#fff;text-shadow:1px 1px 0 #1d1c20}#WRAPPER>#MENU-SIDE>span.sep{border-bottom:1px solid #4a4a55}
|
||||
#WRAPPER>#MENU-SIDE>span:not(.icon){display:block;position:relative;width:calc( 100% - 2*1em - 2*1.5em );padding:1.5em 1.5em;padding-left:calc( 1.5em + 2*1em );border-bottom:1px solid transparent;background:url("/f/svg/circle/st/menu-side/29282e") 1em center no-repeat,url("/f/svg/sub/st/menu-side/777777") right 1em center no-repeat;background-size:2em 2em, 1em 1em;color:#ddd;text-shadow:1px 1px 0 #26262c;transition:color .2s ease-in-out, background .2s ease-in-out, box-shadow .2s ease-in-out, border .2s ease-in-out;cursor:pointer}#WRAPPER>#MENU-SIDE>span:not(.icon).active{background:url("/f/svg/circle/st/menu-side/29282e") 1em center no-repeat,url("/f/svg/sub-active/st/menu-side/dddddd") right 1em center no-repeat;background-size:2em 2em, 1em 1em}#WRAPPER>#MENU-SIDE>span:not(.icon)>svg,#WRAPPER>#MENU-SIDE>span:not(.icon)>svg *{position:absolute;top:calc( 50% - 1em/2 );left:1.5em;width:1em;height:1em;fill:#ddd !important;transition:fill .2s ease-in-out}#WRAPPER>#MENU-SIDE>span:not(.icon):hover,#WRAPPER>#MENU-SIDE>span:not(.icon).active{border-bottom-color:#242329;box-shadow:inset 0 0 1em #27262b;background-color:#29282e;color:#fff;text-shadow:1px 1px 0 #1d1c20}#WRAPPER>#MENU-SIDE>span:not(.icon):hover>svg,#WRAPPER>#MENU-SIDE>span:not(.icon):hover>svg *,#WRAPPER>#MENU-SIDE>span:not(.icon).active>svg,#WRAPPER>#MENU-SIDE>span:not(.icon).active>svg *{fill:#53d192 !important}#WRAPPER>#MENU-SIDE>span.icon{display:block;position:relative;width:calc( 100% - 3em - 2*1.5em );height:calc( 5em - 1px );padding:0 1.5em;padding-left:calc( 1.5em + 3em );border-bottom:1px solid transparent;background:#32323a;color:#fff;text-shadow:1px 1px 0 #26262c;font-weight:bold;line-height:5em}#WRAPPER>#MENU-SIDE>span.icon>svg,#WRAPPER>#MENU-SIDE>span.icon>svg *{position:absolute;top:calc( 50% - 5em/2 );left:1.5em;height:5em}#WRAPPER>#MENU-SIDE>span.icon:hover{border-bottom-color:#242329;box-shadow:inset 0 0 1em #27262b;background-color:#29282e;color:#fff;text-shadow:1px 1px 0 #1d1c20}#WRAPPER>#MENU-SIDE>span.sep{border-bottom:1px solid #4a4a55}#WRAPPER>#MENU-SIDE>span:not(.icon).active+div.sub>span{display:block;position:relative;width:calc( 100% - 2*1.5em );padding:.5em 1.5em;padding-left:1.5em;border-bottom:1px solid transparent;background:#242329 url("/f/svg/sub/st/menu-side/888888") 0.5em center no-repeat;background-size:.5em;color:#aaa;font-size:.85em;cursor:pointer;transition:color .2s ease-in-out}#WRAPPER>#MENU-SIDE>span:not(.icon).active+div.sub>span:hover,#WRAPPER>#MENU-SIDE>span:not(.icon).active+div.sub>span.active{color:#fff;background-image:url("/f/svg/sub/st/menu-side/ffffff")}#WRAPPER>#MENU-SIDE>span:not(.icon):not(.active)+div.sub>span{display:none}
|
||||
/*# sourceMappingURL=menu-side.css.map */
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "AAMC,mCAAmB,CAClB,OAAO,CAAE,KAAK,CACd,QAAQ,CAAE,QAAQ,CACjB,KAAK,CAAE,8BAA8B,CAEtC,OAAO,CAAE,WAAW,CACpB,YAAY,CAAE,qBAAqB,CAEnC,aAAa,CAAE,qBAAqB,CAEpC,UAAU,CAAE,qEAAsE,CAClF,eAAe,CAAE,OAAO,CACxB,KAAK,CCPW,IAAO,CDQvB,WAAW,CAAE,iBAA6B,CAE1C,UAAU,CAAE,qGAAqG,CAEjH,MAAM,CAAE,OAAO,CAGf,iFAAkB,CACjB,QAAQ,CAAE,QAAQ,CACjB,GAAG,CAAE,mBAAmB,CACxB,IAAI,CAAE,KAAK,CACX,KAAK,CAAE,GAAG,CACV,MAAM,CAAE,GAAG,CAEZ,IAAI,CAAE,eAAmB,CACzB,UAAU,CAAE,oBAAoB,CAKjC,oFACQ,CACP,mBAAmB,CAAE,OAA2B,CAChD,UAAU,CAAE,qBAAyC,CAErD,gBAAgB,CClCD,OAAO,CDmCtB,KAAK,CCjCU,IAAO,CDkCtB,WAAW,CAAE,iBAAqC,CAElD,6LAAkB,CACjB,IAAI,CAAE,kBAA4B,CASrC,6BAAa,CACZ,OAAO,CAAE,KAAK,CACd,QAAQ,CAAE,QAAQ,CACjB,KAAK,CAAE,4BAA4B,CACnC,MAAM,CAAE,iBAA+B,CAExC,OAAO,CAAE,OAAO,CAChB,YAAY,CAAE,mBAAmB,CAEjC,aAAa,CAAE,qBAAqB,CAEpC,UAAU,CC5DM,OAAO,CD8DvB,KAAK,CC3DW,IAAO,CD4DvB,WAAW,CAAE,iBAA6B,CAC1C,WAAW,CAAE,IAAI,CACjB,WAAW,CCvDK,GAAG,CDyDnB,qEAAkB,CACjB,QAAQ,CAAE,QAAQ,CACjB,GAAG,CAAE,mBAAmB,CACxB,IAAI,CAAE,KAAK,CACX,MAAM,CAAE,GAAG,CAIb,mCAAO,CACN,mBAAmB,CAAE,OAA2B,CAChD,UAAU,CAAE,qBAAyC,CAErD,gBAAgB,CC9ED,OAAO,CD+EtB,KAAK,CC7EU,IAAO,CD8EtB,WAAW,CAAE,iBAAqC,CASpD,4BAAY,CACX,aAAa,CAAE,iBAA+B",
|
||||
"mappings": "AAMC,mCAAmB,CAClB,OAAO,CAAE,KAAK,CACd,QAAQ,CAAE,QAAQ,CACjB,KAAK,CAAE,8BAA8B,CAEtC,OAAO,CAAE,WAAW,CACpB,YAAY,CAAE,qBAAqB,CAEnC,aAAa,CAAE,qBAAqB,CAEpC,UAAU,CAAE,8HAC0D,CACtE,eAAe,CAAE,gBAAgB,CAUjC,KAAK,CCjBW,IAAO,CDkBvB,WAAW,CAAE,iBAA6B,CAE1C,UAAU,CAAE,qGAAqG,CAEjH,MAAM,CAAE,OAAO,CAXf,0CAAQ,CACP,UAAU,CAAE,qIACgE,CAC5E,eAAe,CAAE,gBAAgB,CAWlC,iFAAkB,CACjB,QAAQ,CAAE,QAAQ,CACjB,GAAG,CAAE,mBAAmB,CACxB,IAAI,CAAE,KAAK,CACX,KAAK,CAAE,GAAG,CACV,MAAM,CAAE,GAAG,CAEZ,IAAI,CAAE,eAAmB,CACzB,UAAU,CAAE,oBAAoB,CAKjC,oFACQ,CACP,mBAAmB,CAAE,OAA2B,CAChD,UAAU,CAAE,qBAAyC,CAErD,gBAAgB,CC5CD,OAAO,CD6CtB,KAAK,CC3CU,IAAO,CD4CtB,WAAW,CAAE,iBAAqC,CAElD,6LAAkB,CACjB,IAAI,CAAE,kBAA4B,CASrC,6BAAa,CACZ,OAAO,CAAE,KAAK,CACd,QAAQ,CAAE,QAAQ,CACjB,KAAK,CAAE,4BAA4B,CACnC,MAAM,CAAE,iBAA+B,CAExC,OAAO,CAAE,OAAO,CAChB,YAAY,CAAE,mBAAmB,CAEjC,aAAa,CAAE,qBAAqB,CAEpC,UAAU,CCtEM,OAAO,CDwEvB,KAAK,CCrEW,IAAO,CDsEvB,WAAW,CAAE,iBAA6B,CAC1C,WAAW,CAAE,IAAI,CACjB,WAAW,CCjEK,GAAG,CDmEnB,qEAAkB,CACjB,QAAQ,CAAE,QAAQ,CACjB,GAAG,CAAE,mBAAmB,CACxB,IAAI,CAAE,KAAK,CACX,MAAM,CAAE,GAAG,CAIb,mCAAO,CACN,mBAAmB,CAAE,OAA2B,CAChD,UAAU,CAAE,qBAAyC,CAErD,gBAAgB,CCxFD,OAAO,CDyFtB,KAAK,CCvFU,IAAO,CDwFtB,WAAW,CAAE,iBAAqC,CASpD,4BAAY,CACX,aAAa,CAAE,iBAA+B,CAO/C,uDAAyC,CACxC,OAAO,CAAE,KAAK,CACd,QAAQ,CAAE,QAAQ,CACjB,KAAK,CAAE,sBAAsB,CAE9B,OAAO,CAAE,UAAU,CACnB,YAAY,CAAE,KAAK,CAEnB,aAAa,CAAE,qBAAqB,CAEpC,UAAU,CAAE,oEAAuF,CACnG,eAAe,CAAE,IAAI,CAErB,KAAK,CAAE,IAAoB,CAC3B,SAAS,CAAE,KAAK,CAEhB,MAAM,CAAE,OAAO,CAEf,UAAU,CAAE,qBAAqB,CAGjC,4HACQ,CACP,KAAK,CChIU,IAAO,CDiItB,gBAAgB,CAAE,qCAAqC,CAMzD,6DAA+C,CAC9C,OAAO,CAAE,IAAI",
|
||||
"sources": ["menu-side.scss","constants.scss"],
|
||||
"names": [],
|
||||
"file": "menu-side.css"
|
||||
|
|
|
|||
|
|
@ -14,8 +14,18 @@
|
|||
|
||||
border-bottom: 1px solid transparent;
|
||||
|
||||
background: $dark-bg url('/f/svg/circle/st/menu-side/29282e') 1em center no-repeat;
|
||||
background-size: 2em 2em;
|
||||
background: url('/f/svg/circle/st/menu-side/29282e') 1em center no-repeat,
|
||||
url('/f/svg/sub/st/menu-side/777777') right 1em center no-repeat;
|
||||
background-size: 2em 2em, 1em 1em;
|
||||
|
||||
|
||||
// Modification du sens de la fleche quand le sous-menu est deroule
|
||||
&.active{
|
||||
background: url('/f/svg/circle/st/menu-side/29282e') 1em center no-repeat,
|
||||
url('/f/svg/sub-active/st/menu-side/dddddd') right 1em center no-repeat;
|
||||
background-size: 2em 2em, 1em 1em;
|
||||
}
|
||||
|
||||
color: $dark-fg;
|
||||
text-shadow: 1px 1px 0 darken($dark-bg, 5);
|
||||
|
||||
|
|
@ -102,4 +112,40 @@
|
|||
}
|
||||
|
||||
|
||||
/* [4] Gestion du menu deroulant
|
||||
=========================================================*/
|
||||
/* (1) Quand le menu est deroule */
|
||||
& > span:not(.icon).active + div.sub>span{
|
||||
display: block;
|
||||
position: relative;
|
||||
width: calc( 100% - 2*1.5em );
|
||||
|
||||
padding: .5em 1.5em;
|
||||
padding-left: 1.5em;
|
||||
|
||||
border-bottom: 1px solid transparent;
|
||||
|
||||
background: darken($dark-bg-primary, 2) url('/f/svg/sub/st/menu-side/888888') .5em center no-repeat;;
|
||||
background-size: .5em;
|
||||
|
||||
color: darken($dark-fg, 20);
|
||||
font-size: .85em;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
transition: color .2s ease-in-out;
|
||||
|
||||
// Animation de @hover ou .active
|
||||
&:hover,
|
||||
&.active{
|
||||
color: $dark-fg-primary;
|
||||
background-image: url('/f/svg/sub/st/menu-side/ffffff');
|
||||
}
|
||||
}
|
||||
|
||||
/* (2) Quand le menu est replie */
|
||||
|
||||
& > span:not(.icon):not(.active) + div.sub>span{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -23,7 +23,73 @@
|
|||
|
||||
|
||||
|
||||
/* [1] Toggle du side-menu <-> navigation
|
||||
|
||||
/* [1] Toggle du sub-menu-side <-> navigation
|
||||
===========================================*/
|
||||
function navSubMenu(subsection){
|
||||
/* [1] Format du param
|
||||
------------------------------------------------*/
|
||||
// Contient l'element courant
|
||||
var current = document.querySelector('#MENU-SIDE > span[data-link='+pageManager.page+'] + div.sub > span[data-sublink="'+pageManager.vars[0]+'"]');
|
||||
|
||||
// Contiendra l'element cible
|
||||
var target = null;
|
||||
|
||||
// si @subsection est un element, on le prends
|
||||
target = (subsection instanceof Element) ? subsection : null;
|
||||
|
||||
// Si string, on trouve l'element correspondant
|
||||
target = (typeof subsection == 'string') ? document.querySelector('#MENU-SIDE > span[data-link='+pageManager.page+'] + div.sub > span[data-sublink="'+subsection+'"]') : target;
|
||||
|
||||
// Si rien trouve, on prend le premier element correspondant a la premiere page
|
||||
target = (target == null) ? document.querySelector('#MENU-SIDE > span[data-link='+pageManager.page+'] + div.sub > span[data-sublink]') : target;
|
||||
|
||||
// Si le param n'est toujours pas bon, on retourne une erreur
|
||||
if( target == null ) return false;
|
||||
|
||||
/* [2] Gestion de l'affichage de l'element
|
||||
------------------------------------------------*/
|
||||
// On desactive l'element courant
|
||||
if( current != null )
|
||||
current.remClass('active');
|
||||
|
||||
// On cache les sections visibles
|
||||
var visibleSections = document.querySelectorAll('#CONTAINER > section[data-sublink].active');
|
||||
for( var i = 0 ; i < visibleSections.length ; i++ )
|
||||
visibleSections[i].remClass('active');
|
||||
|
||||
// On active le nouveau
|
||||
if( target != null ){
|
||||
target.addClass('active');
|
||||
|
||||
// On affiche la section associee
|
||||
var targetSection = document.querySelector('#CONTAINER > section[data-sublink="'+target.getData('sublink')+'"]');
|
||||
if( targetSection != null )
|
||||
targetSection.addClass('active');
|
||||
|
||||
}
|
||||
|
||||
/* [3] Gestion de pageManager
|
||||
------------------------------------------------*/
|
||||
// Si element, on recupere le data-link
|
||||
var page = null;
|
||||
|
||||
// Si erreur, on retourne FALSE
|
||||
if( !target.getData('sublink') ) return false
|
||||
|
||||
var mustRefresh = pageManager.vars[0] != target.getData('sublink');
|
||||
|
||||
// On met a jour la variable page-manager si data-link trouve
|
||||
pageManager.vars[0] = target.getData('sublink');
|
||||
|
||||
if( mustRefresh )
|
||||
// navMenu(pageManager.page);
|
||||
pageManager.updateURL();
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* [4 Toggle du side-menu <-> navigation
|
||||
===========================================*/
|
||||
function navMenu(section){
|
||||
|
||||
|
|
@ -69,6 +135,28 @@
|
|||
|
||||
pageManager.activeXHR.addEventListener('loadend', function(){
|
||||
|
||||
// On gere la navigation du sous-menu (si defini, utilise)
|
||||
var subSectionExists = pageManager.vars.length >= 1 && document.querySelector('#CONTAINER > section[data-sublink="'+pageManager.vars[0]+'"]') != null;
|
||||
if( subSectionExists ) // Si le lien du menu associe existe
|
||||
navSubMenu(pageManager.vars[0]); // on charge la page associee
|
||||
else // sinon
|
||||
navSubMenu(null); // on charge le lien par defaut
|
||||
|
||||
|
||||
// GESTION DE LA NAVIGATION DU SOUS-MENU
|
||||
// si le sous-menu existe
|
||||
var smenu = document.querySelector('#MENU-SIDE > span[data-link='+pageManager.page+'] + div.sub');
|
||||
if( smenu != null )
|
||||
smenu.addEventListener('click', function(e){
|
||||
var target = e.target;
|
||||
|
||||
while( target != document.body && !target.getData('sublink') )
|
||||
target = target.parentNode;
|
||||
|
||||
if( target.getData('sublink') )
|
||||
navSubMenu(target);
|
||||
}, false);
|
||||
|
||||
// On retire l'icone de chargement
|
||||
DOM.HEADER.remClass('loading');
|
||||
}, false);
|
||||
|
|
@ -93,7 +181,7 @@
|
|||
|
||||
|
||||
|
||||
/* [2] Gestion de la navigation (physique)
|
||||
/* [5] Gestion de la navigation (physique)
|
||||
===========================================*/
|
||||
DOM.MENUSIDE.addEventListener('click', function(e){
|
||||
var target = e.target;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,65 @@
|
|||
<?php
|
||||
|
||||
namespace manager\repo;
|
||||
use \manager\Database;
|
||||
|
||||
class Token{
|
||||
|
||||
/* Gestion de la table Token (pour secu) et des derivations
|
||||
*
|
||||
* 1. Gestion de la verification
|
||||
* - check(token, id_personne)
|
||||
*
|
||||
* 3. Gestion de la
|
||||
* - merge(idA, idB)
|
||||
*
|
||||
* 4. Gestion de creation
|
||||
* - create(pseudo, nom, prenom, facebook, telephone)
|
||||
*
|
||||
*
|
||||
*/
|
||||
|
||||
|
||||
/* RENVOIE LES DONNEES D'UN UTILISATEUR D'UID DONNE
|
||||
*
|
||||
* @id_personne<int> UID de la personne en question
|
||||
*
|
||||
* @return personne<Array> Tableau associatif contenant les informations utiles de la personne
|
||||
* @return FALSE<boolean> Si une erreur occure ou qu'aucune personne n'est trouvee, retourne FALSE
|
||||
*
|
||||
*/
|
||||
public static function getById($id_personne=null){
|
||||
/* [0] Verification des INPUT
|
||||
=========================================================*/
|
||||
if( !Database::check('id', $id_personne) ) return false;
|
||||
|
||||
/* [1] On prepare et execute la requete
|
||||
=========================================================*/
|
||||
$request = Database::getPDO()->prepare("SELECT idPersonne as id, pseudo, nom, prenom, id_facebook, telephone
|
||||
FROM Personnes
|
||||
WHERE idPersonne = :uid");
|
||||
$request->execute(array(
|
||||
':uid' => $id_personne
|
||||
));
|
||||
|
||||
|
||||
/* [2] On recupere le resultat
|
||||
=========================================================*/
|
||||
// si aucun resultat, on retourne FALSE
|
||||
if( ($personne=$request->fetch()) === false ) return false;
|
||||
|
||||
|
||||
/* [3] On retourne les donnees
|
||||
=========================================================*/
|
||||
return Database::delNumeric( $personne, true );
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
?>
|
||||
|
|
@ -0,0 +1,65 @@
|
|||
<?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="32"
|
||||
viewBox="0 0 32.000001 32"
|
||||
width="32"
|
||||
id="svg4213"
|
||||
version="1.1"
|
||||
inkscape:version="0.91 r13725"
|
||||
sodipodi:docname="sub-active.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" />
|
||||
<dc:title />
|
||||
</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"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:snap-page="true"
|
||||
inkscape:zoom="19.875"
|
||||
inkscape:cx="40.585896"
|
||||
inkscape:cy="12"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="24"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg4213" />
|
||||
<path
|
||||
d="M 32,9.8866669 28.226667,6.1133338 16,18.340001 3.7733329,6.1133338 -1.5e-7,9.8866669 16,25.886666 Z"
|
||||
id="stylisable"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m -17.17,-4 48,0 0,48 -48,0 z"
|
||||
id="s"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:none" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
|
|
@ -0,0 +1,65 @@
|
|||
<?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="32"
|
||||
viewBox="0 0 32.000001 32"
|
||||
width="32"
|
||||
id="svg4213"
|
||||
version="1.1"
|
||||
inkscape:version="0.91 r13725"
|
||||
sodipodi:docname="sub.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" />
|
||||
<dc:title></dc:title>
|
||||
</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"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:snap-page="true"
|
||||
inkscape:zoom="19.875"
|
||||
inkscape:cx="6.83"
|
||||
inkscape:cy="12"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="24"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg4213" />
|
||||
<path
|
||||
d="M 9.8866668,0 6.1133337,3.7733333 18.340001,16 6.1133337,28.226667 9.8866668,32 25.886666,16 Z"
|
||||
id="stylisable"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m -17.17,-4 48,0 0,48 -48,0 z"
|
||||
id="s"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:none" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
9
view.php
9
view.php
|
|
@ -62,9 +62,18 @@
|
|||
|
||||
<span data-link='dashboard' ><?= ResourceDispatcher::getResource('f/svg/home/st/menu-side'); ?>Tableau de bord</span>
|
||||
<span data-link='input' ><?= ResourceDispatcher::getResource('f/svg/input/st/menu-side'); ?>Acquisition</span>
|
||||
<div class='sub'>
|
||||
<span data-sublink='q'>Questionnaire</span>
|
||||
<span data-sublink='fb'>Facebook</span>
|
||||
<span data-sublink='tel'>Journal d'appel</span>
|
||||
</div>
|
||||
<span data-link='analytics' ><?= ResourceDispatcher::getResource('f/svg/analytics/st/menu-side'); ?>Statistiques</span>
|
||||
<span data-link='charts' class='sep'><?= ResourceDispatcher::getResource('f/svg/charts/st/menu-side'); ?>Visualisation</span>
|
||||
<span data-link='settings' ><?= ResourceDispatcher::getResource('f/svg/settings/st/menu-side' ); ?>Paramètres</span>
|
||||
<div class='sub'>
|
||||
<span data-sublink='tokens'>Gestion des tokens</span>
|
||||
<span data-sublink='users'>Gestion des utilisateurs</span>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -6,4 +6,10 @@
|
|||
?>
|
||||
|
||||
|
||||
Parametres
|
||||
<section data-sublink='tokens' class='active'>
|
||||
Gestion des tokens
|
||||
</section>
|
||||
|
||||
<section data-sublink='users'>
|
||||
Gestion des utilisateurs
|
||||
</section>
|
||||
|
|
|
|||
Loading…
Reference in New Issue