NxTIC/css/menu-side/nested.css

/* [1] COULEURS
=========================================================*/
/* (1) COULEURS DU THEME $DEFAULT */
/* (2) COULEURS DE THEME $DARK */
/* (3) Couleurs du theme pour la timeline */
/* [2] DIMENSIONS
=========================================================*/
/* (1) Layout de base */
/* [3] Mixins
=========================================================*/
#WRAPPER > #MENU-SIDE {
  /* [1] Elements du menu
	=========================================================*/
  /* [2] Gestion du menu deroulant
	=========================================================*/
  /* (1) Quand le menu est deroule */ }
  #WRAPPER > #MENU-SIDE > span {
    display: block;
    position: relative;
    width: calc( 100% - 2*1em - 2*1.5em);
    padding: .8em 1.5em;
    padding-left: calc( 1.5em + 2*1em);
    border-bottom: 1px solid transparent;
    background: url("/f/svg/sub/st/menu-side/aaaaaa") right 1.5em center no-repeat;
    background-size: .5em .5em;
    color: #666;
    font-size: .85em;
    -webkit-transition: color 0.2s ease-in-out, background 0.2s ease-in-out, box-shadow 0.2s ease-in-out, border 0.2s ease-in-out;
    transition: color 0.2s ease-in-out, background 0.2s ease-in-out, box-shadow 0.2s ease-in-out, border 0.2s ease-in-out;
    cursor: pointer;
    /* (1) Icone svg */
    /* (2) Animation de @hover */
    /* (3) Animation quand .active */ }
    #WRAPPER > #MENU-SIDE > span > svg, #WRAPPER > #MENU-SIDE > span > svg * {
      position: absolute;
      top: calc( 50% - 1em/2);
      left: 1.5em;
      width: 1em;
      height: 1em;
      fill: #939393 !important;
      -webkit-transition: fill 0.2s ease-in-out;
      transition: fill 0.2s ease-in-out; }
    #WRAPPER > #MENU-SIDE > span:not(.active):hover {
      background-image: url("/f/svg/sub/st/menu-side/000000");
      color: #000; }
      #WRAPPER > #MENU-SIDE > span:not(.active):hover > svg, #WRAPPER > #MENU-SIDE > span:not(.active):hover > svg * {
        fill: #000 !important; }
    #WRAPPER > #MENU-SIDE > span.active {
      border-bottom-color: #2290eb;
      background-color: #399ced;
      background-image: url("/f/svg/sub-active/st/menu-side/ffffff");
      color: #ffffff; }
      #WRAPPER > #MENU-SIDE > span.active > svg, #WRAPPER > #MENU-SIDE > span.active > svg * {
        fill: #fff !important; }
  #WRAPPER > #MENU-SIDE > span:not(.icon) + div.sub > span {
    display: block;
    position: relative;
    width: calc( 100% - 1.5em - 2.5em);
    padding: .5em 1.5em;
    padding-left: 2.5em;
    background: #313541 url("/f/svg/sub/st/menu-side/888888") 1.5em center no-repeat;
    background-size: .5em;
    color: #7a7a7a;
    font-size: .85em;
    cursor: pointer;
    -webkit-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out; }
    #WRAPPER > #MENU-SIDE > span:not(.icon) + div.sub > span:hover, #WRAPPER > #MENU-SIDE > span:not(.icon) + div.sub > span.active {
      color: #ffffff;
      background-image: url("/f/svg/sub/st/menu-side/ffffff"); }
  #WRAPPER > #MENU-SIDE > span:not(.icon):not(.active) + div.sub > span {
    display: none; }

/*# sourceMappingURL=data:application/json;base64,ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAibmVzdGVkLmNzcyIsCgkic291cmNlcyI6IFsKCQkiLi4vbWVudS1zaWRlLnNjc3MiLAoJCSIuLi9jb25zdGFudHMuc2NzcyIKCV0sCgkic291cmNlc0NvbnRlbnQiOiBbCgkJIkBpbXBvcnQgJ2NvbnN0YW50cyc7XG5cbiNXUkFQUEVSID4gI01FTlUtU0lERXtcblxuXHQvKiBbMV0gRWxlbWVudHMgZHUgbWVudVxuXHQ9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT0qL1xuXHQmID4gc3Bhbntcblx0XHRkaXNwbGF5OiBibG9jaztcblx0XHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0XHR3aWR0aDogY2FsYyggMTAwJSAtIDIqMWVtIC0gMioxLjVlbSApO1xuXG5cdFx0cGFkZGluZzogLjhlbSAxLjVlbTtcblx0XHRwYWRkaW5nLWxlZnQ6IGNhbGMoIDEuNWVtICsgMioxZW0gKTtcblxuXHRcdGJvcmRlci1ib3R0b206IDFweCBzb2xpZCB0cmFuc3BhcmVudDtcblxuXHRcdGJhY2tncm91bmQ6IHVybCgnL2Yvc3ZnL3N1Yi9zdC9tZW51LXNpZGUvYWFhYWFhJykgcmlnaHQgMS41ZW0gY2VudGVyIG5vLXJlcGVhdDtcblx0XHRiYWNrZ3JvdW5kLXNpemU6IC41ZW0gLjVlbTtcblxuXG5cdFx0Y29sb3I6ICM2NjY7XG5cdFx0Zm9udC1zaXplOiAuODVlbTtcblxuXHRcdEBpbmNsdWRlIHRyYW5zaXRpb24oIGNvbG9yIC4ycyBlYXNlLWluLW91dCwgYmFja2dyb3VuZCAuMnMgZWFzZS1pbi1vdXQsIGJveC1zaGFkb3cgLjJzIGVhc2UtaW4tb3V0LCBib3JkZXIgLjJzIGVhc2UtaW4tb3V0ICk7XG5cblx0XHRjdXJzb3I6IHBvaW50ZXI7XG5cblx0XHQvKiAoMSkgSWNvbmUgc3ZnICovXG5cdFx0JiA+IHN2ZywgJiA+IHN2ZyAqe1xuXHRcdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdFx0XHR0b3A6IGNhbGMoIDUwJSAtIDFlbS8yICk7XG5cdFx0XHRcdGxlZnQ6IDEuNWVtO1xuXHRcdFx0XHR3aWR0aDogMWVtO1xuXHRcdFx0XHRoZWlnaHQ6IDFlbTtcblxuXHRcdFx0ZmlsbDogJGRhcmstZmcgIWltcG9ydGFudDtcblx0XHRcdEBpbmNsdWRlIHRyYW5zaXRpb24oIGZpbGwgLjJzIGVhc2UtaW4tb3V0ICk7XG5cdFx0fVxuXG5cblx0XHQvKiAoMikgQW5pbWF0aW9uIGRlIEBob3ZlciAqL1xuXHRcdCY6bm90KC5hY3RpdmUpOmhvdmVye1xuXHRcdFx0YmFja2dyb3VuZC1pbWFnZTogdXJsKCcvZi9zdmcvc3ViL3N0L21lbnUtc2lkZS8wMDAwMDAnKTtcblx0XHRcdGNvbG9yOiAjMDAwO1xuXG5cdFx0XHQmID4gc3ZnLCAmID4gc3ZnICp7XG5cdFx0XHRcdGZpbGw6ICMwMDAgIWltcG9ydGFudDtcblx0XHRcdH1cblx0XHR9XG5cblx0XHQvKiAoMykgQW5pbWF0aW9uIHF1YW5kIC5hY3RpdmUgKi9cblx0XHQmLmFjdGl2ZXtcblx0XHRcdGJvcmRlci1ib3R0b20tY29sb3I6IGRhcmtlbigkdGhlbWUtZmctcHJpbWFyeSwgNSk7XG5cdFx0XHQvLyBib3gtc2hhZG93OiBpbnNldCAwIDAgMWVtIGRhcmtlbigkZGFyay1iZy1wcmltYXJ5LCAxKTtcblxuXHRcdFx0YmFja2dyb3VuZC1jb2xvcjogJHRoZW1lLWZnLXByaW1hcnk7XG5cdFx0XHRiYWNrZ3JvdW5kLWltYWdlOiB1cmwoJy9mL3N2Zy9zdWItYWN0aXZlL3N0L21lbnUtc2lkZS9mZmZmZmYnKTtcblx0XHRcdGNvbG9yOiAkZGFyay1mZy1wcmltYXJ5O1xuXG5cdFx0XHQmID4gc3ZnLCAmID4gc3ZnICp7XG5cdFx0XHRcdGZpbGw6ICNmZmYgIWltcG9ydGFudDtcblx0XHRcdH1cblx0XHR9XG5cblxuXHR9XG5cblxuXG5cdC8qIFsyXSBHZXN0aW9uIGR1IG1lbnUgZGVyb3VsYW50XG5cdD09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PSovXG5cdC8qICgxKSBRdWFuZCBsZSBtZW51IGVzdCBkZXJvdWxlICovXG5cdCYgPiBzcGFuOm5vdCguaWNvbikgKyBkaXYuc3ViPnNwYW57XG5cdFx0ZGlzcGxheTogYmxvY2s7XG5cdFx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdFx0d2lkdGg6IGNhbGMoIDEwMCUgLSAxLjVlbSAtIDIuNWVtICk7XG5cblx0XHRwYWRkaW5nOiAuNWVtIDEuNWVtO1xuXHRcdHBhZGRpbmctbGVmdDogMi41ZW07XG5cblx0XHRiYWNrZ3JvdW5kOiAkZGFyay1iZyB1cmwoJy9mL3N2Zy9zdWIvc3QvbWVudS1zaWRlLzg4ODg4OCcpIDEuNWVtIGNlbnRlciBuby1yZXBlYXQ7O1xuXHRcdGJhY2tncm91bmQtc2l6ZTogLjVlbTtcblxuXHRcdGNvbG9yOiBkYXJrZW4oJGRhcmstZmcsIDEwKTtcblx0XHRmb250LXNpemU6IC44NWVtO1xuXG5cdFx0Y3Vyc29yOiBwb2ludGVyO1xuXG5cdFx0QGluY2x1ZGUgdHJhbnNpdGlvbiggY29sb3IgLjJzIGVhc2UtaW4tb3V0ICk7XG5cblx0XHQvLyBBbmltYXRpb24gZGUgQGhvdmVyIG91IC5hY3RpdmVcblx0XHQmOmhvdmVyLFxuXHRcdCYuYWN0aXZle1xuXHRcdFx0Y29sb3I6ICRkYXJrLWZnLXByaW1hcnk7XG5cdFx0XHRiYWNrZ3JvdW5kLWltYWdlOiB1cmwoJy9mL3N2Zy9zdWIvc3QvbWVudS1zaWRlL2ZmZmZmZicpO1xuXHRcdH1cblx0fVxuXG5cblx0JiA+IHNwYW46bm90KC5pY29uKTpub3QoLmFjdGl2ZSkgKyBkaXYuc3ViPnNwYW57XG5cdFx0ZGlzcGxheTogbm9uZTtcblx0fVxufVxuIiwKCQkiLyogWzFdIENPVUxFVVJTXG49PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT0qL1xuLyogKDEpIENPVUxFVVJTIERVIFRIRU1FICRERUZBVUxUICovXG4kdGhlbWUtYmc6ICAgICAgICAgI2U4ZThlODtcbiR0aGVtZS1iZy1wcmltYXJ5OiAjZmZmZmZmO1xuJHRoZW1lLWZnOiAgICAgICAgICM1MTUxNTE7XG4kdGhlbWUtZmctcHJpbWFyeTogIzM5OWNlZDtcblxuLyogKDIpIENPVUxFVVJTIERFIFRIRU1FICREQVJLICovXG4kZGFyay1iZzogICAgICAgICAjMzEzNTQxO1xuJGRhcmstYmctcHJpbWFyeTogIzI5MjgyZTtcbiRkYXJrLWZnOiAgICAgICAgICM5MzkzOTM7XG4kZGFyay1mZy1wcmltYXJ5OiAjZmZmZmZmO1xuXG4kaGVhZGVyLWRhcms6ICAgICAjMzMzMzMzO1xuXG4vKiAoMykgQ291bGV1cnMgZHUgdGhlbWUgcG91ciBsYSB0aW1lbGluZSAqL1xuJ