Subversion Repositories wimsdev

Rev

Rev 13836 | Rev 15049 | Go to most recent revision | Blame | Compare with Previous | Last modification | View Log | RSS feed

  1. /** Menu style */
  2.  
  3. /** these are redefined in wims theme : **/
  4. /*  .menu .is-active > a {
  5.     background: #1779ba;
  6.     color: #fefefe; }
  7.   .menu .active > a {
  8.     background: #1779ba;
  9.     color: #fefefe; }*/
  10.  
  11. /**
  12.  * Foundation for Sites by ZURB
  13.  * Version 6.6.1
  14.  * foundation.zurb.com
  15.  * Licensed under MIT Open Source
  16.  */
  17. /* Foundation Menu styles */
  18. .menu {
  19.   padding: 0;
  20.   margin: 0;
  21.   list-style: none;
  22.   position: relative;
  23.   display: -webkit-box;
  24.   display: flex;
  25.   flex-wrap: wrap; }
  26.   [data-whatinput='mouse'] .menu li {
  27.     outline: 0; }
  28.   .menu a,
  29.   .menu .button {
  30.     line-height: 1;
  31.     text-decoration: none;
  32.     display: block;
  33.     padding: 0.7rem 1rem; }
  34.   .menu input,
  35.   .menu select,
  36.   .menu a,
  37.   .menu button {
  38.     margin-bottom: 0; }
  39.   .menu input {
  40.     display: inline-block; }
  41.   .menu, .menu.horizontal {
  42.     flex-wrap: wrap;
  43.     -webkit-box-orient: horizontal;
  44.     -webkit-box-direction: normal;
  45.             flex-direction: row; }
  46.   .menu.vertical {
  47.     flex-wrap: nowrap;
  48.     -webkit-box-orient: vertical;
  49.     -webkit-box-direction: normal;
  50.             flex-direction: column; }
  51.   .menu.expanded li {
  52.     -webkit-box-flex: 1;
  53.             flex: 1 1 0px; }
  54.   .menu.simple {
  55.     -webkit-box-align: center;
  56.             align-items: center; }
  57.     .menu.simple li + li {
  58.       margin-left: 1rem; }
  59.     .menu.simple a {
  60.       padding: 0; }
  61.   @media print, screen and (min-width: 40em) {
  62.     .menu.medium-horizontal {
  63.       flex-wrap: wrap;
  64.       -webkit-box-orient: horizontal;
  65.       -webkit-box-direction: normal;
  66.               flex-direction: row; }
  67.     .menu.medium-vertical {
  68.       flex-wrap: nowrap;
  69.       -webkit-box-orient: vertical;
  70.       -webkit-box-direction: normal;
  71.               flex-direction: column; }
  72.     .menu.medium-expanded li {
  73.       -webkit-box-flex: 1;
  74.               flex: 1 1 0px; }
  75.     .menu.medium-simple li {
  76.       -webkit-box-flex: 1;
  77.               flex: 1 1 0px; } }
  78.   @media print, screen and (min-width: 64em) {
  79.     .menu.large-horizontal {
  80.       flex-wrap: wrap;
  81.       -webkit-box-orient: horizontal;
  82.       -webkit-box-direction: normal;
  83.               flex-direction: row; }
  84.     .menu.large-vertical {
  85.       flex-wrap: nowrap;
  86.       -webkit-box-orient: vertical;
  87.       -webkit-box-direction: normal;
  88.               flex-direction: column; }
  89.     .menu.large-expanded li {
  90.       -webkit-box-flex: 1;
  91.               flex: 1 1 0px; }
  92.     .menu.large-simple li {
  93.       -webkit-box-flex: 1;
  94.               flex: 1 1 0px; } }
  95.   .menu.nested {
  96.     margin-right: 0;
  97.     margin-left: 1rem; }
  98.   .menu.icons a {
  99.     display: -webkit-box;
  100.     display: flex; }
  101.   .menu.icon-top a, .menu.icon-right a, .menu.icon-bottom a, .menu.icon-left a {
  102.     display: -webkit-box;
  103.     display: flex; }
  104.   .menu.icon-left li a {
  105.     -webkit-box-orient: horizontal;
  106.     -webkit-box-direction: normal;
  107.             flex-flow: row nowrap; }
  108.     .menu.icon-left li a img,
  109.     .menu.icon-left li a i,
  110.     .menu.icon-left li a svg {
  111.       margin-right: 0.25rem; }
  112.   .menu.icon-right li a {
  113.     -webkit-box-orient: horizontal;
  114.     -webkit-box-direction: normal;
  115.             flex-flow: row nowrap; }
  116.     .menu.icon-right li a img,
  117.     .menu.icon-right li a i,
  118.     .menu.icon-right li a svg {
  119.       margin-left: 0.25rem; }
  120.   .menu.icon-top li a {
  121.     -webkit-box-orient: vertical;
  122.     -webkit-box-direction: normal;
  123.             flex-flow: column nowrap; }
  124.     .menu.icon-top li a img,
  125.     .menu.icon-top li a i,
  126.     .menu.icon-top li a svg {
  127.       align-self: stretch;
  128.       margin-bottom: 0.25rem;
  129.       text-align: center; }
  130.   .menu.icon-bottom li a {
  131.     -webkit-box-orient: vertical;
  132.     -webkit-box-direction: normal;
  133.             flex-flow: column nowrap; }
  134.     .menu.icon-bottom li a img,
  135.     .menu.icon-bottom li a i,
  136.     .menu.icon-bottom li a svg {
  137.       align-self: stretch;
  138.       margin-bottom: 0.25rem;
  139.       text-align: center; }
  140.   /*.menu .is-active > a {
  141.     background: #1779ba;
  142.     color: #fefefe; }
  143.   .menu .active > a {
  144.     background: #1779ba;
  145.     color: #fefefe; }*/
  146.   .menu.align-left {
  147.     -webkit-box-pack: start;
  148.             justify-content: flex-start; }
  149.   .menu.align-right li {
  150.     display: -webkit-box;
  151.     display: flex;
  152.     -webkit-box-pack: end;
  153.             justify-content: flex-end; }
  154.     .menu.align-right li .submenu li {
  155.       -webkit-box-pack: start;
  156.               justify-content: flex-start; }
  157.   .menu.align-right.vertical li {
  158.     display: block;
  159.     text-align: right; }
  160.     .menu.align-right.vertical li .submenu li {
  161.       text-align: right; }
  162.   .menu.align-right .nested {
  163.     margin-right: 1rem;
  164.     margin-left: 0; }
  165.   .menu.align-center li {
  166.     display: -webkit-box;
  167.     display: flex;
  168.     -webkit-box-pack: center;
  169.             justify-content: center; }
  170.     .menu.align-center li .submenu li {
  171.       -webkit-box-pack: start;
  172.               justify-content: flex-start; }
  173.   .menu .menu-text {
  174.     padding: 0.7rem 1rem;
  175.     font-weight: bold;
  176.     line-height: 1;
  177.     color: inherit; }
  178.  
  179. .menu-centered > .menu {
  180.   -webkit-box-pack: center;
  181.           justify-content: center; }
  182.   .menu-centered > .menu li {
  183.     display: -webkit-box;
  184.     display: flex;
  185.     -webkit-box-pack: center;
  186.             justify-content: center; }
  187.     .menu-centered > .menu li .submenu li {
  188.       -webkit-box-pack: start;
  189.               justify-content: flex-start; }
  190.  
  191. .no-js [data-responsive-menu] ul {
  192.   display: none; }
  193.  
  194. .menu-icon {
  195.   position: relative;
  196.   display: inline-block;
  197.   vertical-align: middle;
  198.   width: 20px;
  199.   height: 16px;
  200.   cursor: pointer; }
  201.   .menu-icon::after {
  202.     position: absolute;
  203.     top: 0;
  204.     left: 0;
  205.     display: block;
  206.     width: 100%;
  207.     height: 2px;
  208.     background: #fefefe;
  209.     box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe;
  210.     content: ''; }
  211.   .menu-icon:hover::after {
  212.     background: #cacaca;
  213.     box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; }
  214.  
  215. .menu-icon.dark {
  216.   position: relative;
  217.   display: inline-block;
  218.   vertical-align: middle;
  219.   width: 20px;
  220.   height: 16px;
  221.   cursor: pointer; }
  222.   .menu-icon.dark::after {
  223.     position: absolute;
  224.     top: 0;
  225.     left: 0;
  226.     display: block;
  227.     width: 100%;
  228.     height: 2px;
  229.     background: #0a0a0a;
  230.     box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a;
  231.     content: ''; }
  232.   .menu-icon.dark:hover::after {
  233.     background: #8a8a8a;
  234.     box-shadow: 0 7px 0 #8a8a8a, 0 14px 0 #8a8a8a; }
  235.