Subversion Repositories wimsdev

Rev

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

  1. /** Dropdown Menu style (adapted from Foundation for Sites Dropdown menus) */
  2.  
  3. /* WIMS CUSTOM styles */
  4. .is-dropdown-submenu > li{
  5.   box-sizing: border-box;}
  6.  
  7. .dropdown.menu,
  8. .dropdown.menu ul{
  9.   list-style-type: none;
  10.   margin: 0;}
  11. .dropdown.menu ul{
  12.   text-align: left;
  13.   padding: 5px 0;}
  14. /* Overrides icon.css styles*/
  15. .dropdown .submenu a{
  16.   display:block;}
  17.  
  18. /* surpass other elements, like sliders (z-index=2)*/
  19. .menuitem>.is-dropdown-submenu{
  20.   z-index: 5;}
  21.  
  22. /*
  23. .dropdown li{
  24.   padding-bottom: 4px;
  25.   margin-bottom: 0;}
  26. /*.submenu li{
  27.   padding-left: .5em;}
  28. .dropdown img{
  29.   vertical-align: middle;}*/
  30.  
  31. /* adds padding to link even if they have no dropdown
  32. .dropdown.menu > li > a{
  33.   padding-right: 1.5rem;}*/
  34.  
  35.  
  36. /**
  37.  * Foundation for Sites by ZURB
  38.  * Version 6.6.1
  39.  * foundation.zurb.com
  40.  * Licensed under MIT Open Source
  41.  */
  42. /* Dropdown Menu styles */
  43. .dropdown.menu > li.opens-left > .is-dropdown-submenu {
  44.   top: 100%;
  45.   right: 0;
  46.   left: auto; }
  47.  
  48. .dropdown.menu > li.opens-right > .is-dropdown-submenu {
  49.   top: 100%;
  50.   right: auto;
  51.   left: 0; }
  52.  
  53. .dropdown.menu > li.is-dropdown-submenu-parent > a {
  54.   position: relative;
  55.   padding-right: 1.5rem; }
  56.  
  57. .dropdown.menu > li.is-dropdown-submenu-parent > a::after {
  58.   display: block;
  59.   width: 0;
  60.   height: 0;
  61.   border: inset 6px;
  62.   content: '';
  63.   border-bottom-width: 0;
  64.   border-top-style: solid;
  65.   border-color: var(--wims_link_color) transparent transparent;
  66.   right: 5px;
  67.   left: auto;
  68.   margin-top: -3px; }
  69.  
  70. [data-whatinput='mouse'] .dropdown.menu a {
  71.   outline: 0; }
  72.  
  73. .dropdown.menu > li > a {
  74.   padding: 0.7rem 1rem; }
  75.  
  76. /*.dropdown.menu > li.is-active > a {
  77.   background: transparent;
  78.   color: var(--wims_link_color); }*/
  79.  
  80. .no-js .dropdown.menu ul {
  81.   display: none; }
  82.  
  83. .dropdown.menu .nested.is-dropdown-submenu {
  84.   margin-right: 0;
  85.   margin-left: 0; }
  86.  
  87. .dropdown.menu.vertical > li .is-dropdown-submenu {
  88.   top: 0; }
  89.  
  90. .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu {
  91.   top: 0;
  92.   right: 100%;
  93.   left: auto; }
  94.  
  95. .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu {
  96.   right: auto;
  97.   left: 100%; }
  98.  
  99. .dropdown.menu.vertical > li > a::after {
  100.   right: 14px; }
  101.  
  102. .dropdown.menu.vertical > li.opens-left > a::after {
  103.   display: block;
  104.   width: 0;
  105.   height: 0;
  106.   border: inset 6px;
  107.   content: '';
  108.   border-left-width: 0;
  109.   border-right-style: solid;
  110.   border-color: transparent var(--wims_link_color) transparent transparent;
  111.   right: auto;
  112.   left: 5px; }
  113.  
  114. .dropdown.menu.vertical > li.opens-right > a::after {
  115.   display: block;
  116.   width: 0;
  117.   height: 0;
  118.   border: inset 6px;
  119.   content: '';
  120.   border-right-width: 0;
  121.   border-left-style: solid;
  122.   border-color: transparent transparent transparent var(--wims_link_color); }
  123.  
  124. @media print, screen and (min-width: 40em) {
  125.   .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu {
  126.     top: 100%;
  127.     right: 0;
  128.     left: auto; }
  129.   .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu {
  130.     top: 100%;
  131.     right: auto;
  132.     left: 0; }
  133.   .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a {
  134.     position: relative;
  135.     padding-right: 1.5rem; }
  136.   .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after {
  137.     display: block;
  138.     width: 0;
  139.     height: 0;
  140.     border: inset 6px;
  141.     content: '';
  142.     border-bottom-width: 0;
  143.     border-top-style: solid;
  144.     border-color: var(--wims_link_color) transparent transparent;
  145.     right: 5px;
  146.     left: auto;
  147.     margin-top: -3px; }
  148.   .dropdown.menu.medium-vertical > li .is-dropdown-submenu {
  149.     top: 0; }
  150.   .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu {
  151.     top: 0;
  152.     right: 100%;
  153.     left: auto; }
  154.   .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu {
  155.     right: auto;
  156.     left: 100%; }
  157.   .dropdown.menu.medium-vertical > li > a::after {
  158.     right: 14px; }
  159.   .dropdown.menu.medium-vertical > li.opens-left > a::after {
  160.     display: block;
  161.     width: 0;
  162.     height: 0;
  163.     border: inset 6px;
  164.     content: '';
  165.     border-left-width: 0;
  166.     border-right-style: solid;
  167.     border-color: transparent var(--wims_link_color) transparent transparent;
  168.     right: auto;
  169.     left: 5px; }
  170.   .dropdown.menu.medium-vertical > li.opens-right > a::after {
  171.     display: block;
  172.     width: 0;
  173.     height: 0;
  174.     border: inset 6px;
  175.     content: '';
  176.     border-right-width: 0;
  177.     border-left-style: solid;
  178.     border-color: transparent transparent transparent var(--wims_link_color); } }
  179.  
  180. @media print, screen and (min-width: 64em) {
  181.   .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu {
  182.     top: 100%;
  183.     right: 0;
  184.     left: auto; }
  185.   .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu {
  186.     top: 100%;
  187.     right: auto;
  188.     left: 0; }
  189.   .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a {
  190.     position: relative;
  191.     padding-right: 1.5rem; }
  192.   .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after {
  193.     display: block;
  194.     width: 0;
  195.     height: 0;
  196.     border: inset 6px;
  197.     content: '';
  198.     border-bottom-width: 0;
  199.     border-top-style: solid;
  200.     border-color: var(--wims_link_color) transparent transparent;
  201.     right: 5px;
  202.     left: auto;
  203.     margin-top: -3px; }
  204.   .dropdown.menu.large-vertical > li .is-dropdown-submenu {
  205.     top: 0; }
  206.   .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu {
  207.     top: 0;
  208.     right: 100%;
  209.     left: auto; }
  210.   .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu {
  211.     right: auto;
  212.     left: 100%; }
  213.   .dropdown.menu.large-vertical > li > a::after {
  214.     right: 14px; }
  215.   .dropdown.menu.large-vertical > li.opens-left > a::after {
  216.     display: block;
  217.     width: 0;
  218.     height: 0;
  219.     border: inset 6px;
  220.     content: '';
  221.     border-left-width: 0;
  222.     border-right-style: solid;
  223.     border-color: transparent var(--wims_link_color) transparent transparent;
  224.     right: auto;
  225.     left: 5px; }
  226.   .dropdown.menu.large-vertical > li.opens-right > a::after {
  227.     display: block;
  228.     width: 0;
  229.     height: 0;
  230.     border: inset 6px;
  231.     content: '';
  232.     border-right-width: 0;
  233.     border-left-style: solid;
  234.     border-color: transparent transparent transparent var(--wims_link_color); } }
  235.  
  236. .dropdown.menu.align-right .is-dropdown-submenu.first-sub {
  237.   top: 100%;
  238.   right: 0;
  239.   left: auto; }
  240.  
  241. .is-dropdown-menu.vertical {
  242.   width: 100px; }
  243.   .is-dropdown-menu.vertical.align-right {
  244.     float: right; }
  245.  
  246. .is-dropdown-submenu-parent {
  247.   position: relative; }
  248.   .is-dropdown-submenu-parent a::after {
  249.     position: absolute;
  250.     top: 50%;
  251.     right: 5px;
  252.     left: auto;
  253.     margin-top: -6px; }
  254.   .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu {
  255.     top: 100%;
  256.     left: auto; }
  257.   .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu {
  258.     right: 100%;
  259.     left: auto; }
  260.   .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu {
  261.     right: auto;
  262.     left: 100%; }
  263.  
  264. .is-dropdown-submenu {
  265.   position: absolute;
  266.   top: 0;
  267.   left: 100%;
  268.   z-index: 1;
  269.   display: none;
  270.   min-width: 200px;
  271.   border: 1px solid #cacaca;
  272.   background: #fefefe; }
  273.   .dropdown .is-dropdown-submenu a {
  274.     padding: 0.7rem 1rem; }
  275.   .is-dropdown-submenu .is-dropdown-submenu-parent > a::after {
  276.     right: 14px; }
  277.   .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after {
  278.     display: block;
  279.     width: 0;
  280.     height: 0;
  281.     border: inset 6px;
  282.     content: '';
  283.     border-left-width: 0;
  284.     border-right-style: solid;
  285.     border-color: transparent var(--wims_link_color) transparent transparent;
  286.     right: auto;
  287.     left: 5px; }
  288.   .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after {
  289.     display: block;
  290.     width: 0;
  291.     height: 0;
  292.     border: inset 6px;
  293.     content: '';
  294.     border-right-width: 0;
  295.     border-left-style: solid;
  296.     border-color: transparent transparent transparent var(--wims_link_color); }
  297.   .is-dropdown-submenu .is-dropdown-submenu {
  298.     margin-top: -1px; }
  299.   .is-dropdown-submenu > li {
  300.     width: 100%; }
  301.   .is-dropdown-submenu.js-dropdown-active {
  302.     display: block; }
  303.