You are here

Home » API reference » AT Tools 8

responsive-menus--dropmenu.css in AT Tools 8

Same filename and directory in other branches
  1. 8.3 at_theme_generator/starterkits/starterkit/styles/css/components/responsive-menus--dropmenu.css
  2. 8.2 at_theme_generator/starterkits/starterkit/styles/css/components/responsive-menus--dropmenu.css
@charset "UTF-8";
/**
 * Drop menus
 * Standard CSS drop menus that will expand any nesting level.
 ============================================================================ */
.ms-dropmenu .rm-toggle {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  height: 1px;
  width: 1px;
  padding: 0;
  word-wrap: normal;
  font: 0/0 a;
}
.ms-dropmenu .rm-block__content .menu {
  transition: 0.15s 0.5s;
}
.ms-dropmenu .rm-block__content .menu:hover .menu {
  transition-delay: 0s;
}
.ms-dropmenu .rm-block__content .menu__item {
  text-align: center;
  position: relative;
}
.ms-dropmenu .rm-block__content a {
  position: relative;
  display: block;
  padding: 7px 18px;
  padding: 0.4375rem 1.125rem;
}
.ms-dropmenu .rm-block__content a:after {
  font-family: FontAwesome, sans-serif;
  padding: 0 1px;
  text-align: right;
  position: absolute;
  right: 16px;
  right: 1rem;
}
.ms-dropmenu .rm-block__content .menu-level-1 {
  position: relative;
}
.ms-dropmenu .rm-block__content .menu-level-1 .menu__item {
  float: left;
  width: auto;
}
.ms-dropmenu .rm-block__content .menu-level-1 .menu__item:hover > .is-child, .ms-dropmenu .rm-block__content .menu-level-1 .menu__item:focus > .is-child {
  visibility: visible;
  opacity: 1;
}
.ms-dropmenu .rm-block__content .menu-level-1 a:after {
  content: '';
  display: none;
}
.fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--collapsed > span > a,
.fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--expanded > span > a {
  padding-right: 40px;
  padding-right: 2.5rem;
}
.fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--collapsed > span > a:after,
.fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--expanded > span > a:after {
  display: inline-block;
}
.fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--expanded > span > a:after {
  content: "";
}
.fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--collapsed > span > a:after {
  content: '';
}
.ms-dropmenu .rm-block__content .is-child {
  position: absolute;
  visibility: hidden;
  opacity: 0;
  margin: 0;
  padding: 0;
  max-height: 1000px;
  width: 100%;
}
.ms-dropmenu .rm-block__content .is-child:hover, .ms-dropmenu .rm-block__content .is-child:focus {
  visibility: visible;
  opacity: 1;
}
.ms-dropmenu .rm-block__content .is-child .menu__item {
  min-width: 12em;
  text-align: left;
  width: 100%;
}
.ms-dropmenu .rm-block__content .menu-level-2 {
  left: 0;
  top: auto;
}
.fa-loaded .ms-dropmenu .rm-block__content .menu-level-2 .menu__item--expanded > span > a:after {
  content: "";
}
[dir="rtl"] .fa-loaded .ms-dropmenu .rm-block__content .menu-level-2 .menu__item--expanded > span > a:after {
  content: "";
}
.ms-dropmenu .rm-block__content .menu-level-2 .is-child {
  left: 100%;
  top: 0;
}

/*# sourceMappingURL=maps/responsive-menus--dropmenu.css.map */

File

at_theme_generator/starterkits/starterkit/styles/css/components/responsive-menus--dropmenu.css
View source 
  1. @charset "UTF-8";

  2. /**

  3.  * Drop menus

  4.  * Standard CSS drop menus that will expand any nesting level.

  5.  ============================================================================ */

  6. .ms-dropmenu .rm-toggle {

  7.   position: absolute !important;

  8.   clip: rect(1px, 1px, 1px, 1px);

  9.   overflow: hidden;

  10.   height: 1px;

  11.   width: 1px;

  12.   padding: 0;

  13.   word-wrap: normal;

  14.   font: 0/0 a;

  15. }

  16. .ms-dropmenu .rm-block__content .menu {

  17.   transition: 0.15s 0.5s;

  18. }

  19. .ms-dropmenu .rm-block__content .menu:hover .menu {

  20.   transition-delay: 0s;

  21. }

  22. .ms-dropmenu .rm-block__content .menu__item {

  23.   text-align: center;

  24.   position: relative;

  25. }

  26. .ms-dropmenu .rm-block__content a {

  27.   position: relative;

  28.   display: block;

  29.   padding: 7px 18px;

  30.   padding: 0.4375rem 1.125rem;

  31. }

  32. .ms-dropmenu .rm-block__content a:after {

  33.   font-family: FontAwesome, sans-serif;

  34.   padding: 0 1px;

  35.   text-align: right;

  36.   position: absolute;

  37.   right: 16px;

  38.   right: 1rem;

  39. }

  40. .ms-dropmenu .rm-block__content .menu-level-1 {

  41.   position: relative;

  42. }

  43. .ms-dropmenu .rm-block__content .menu-level-1 .menu__item {

  44.   float: left;

  45.   width: auto;

  46. }

  47. .ms-dropmenu .rm-block__content .menu-level-1 .menu__item:hover > .is-child, .ms-dropmenu .rm-block__content .menu-level-1 .menu__item:focus > .is-child {

  48.   visibility: visible;

  49.   opacity: 1;

  50. }

  51. .ms-dropmenu .rm-block__content .menu-level-1 a:after {

  52.   content: '';

  53.   display: none;

  54. }

  55. .fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--collapsed > span > a,

  56. .fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--expanded > span > a {

  57.   padding-right: 40px;

  58.   padding-right: 2.5rem;

  59. }

  60. .fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--collapsed > span > a:after,

  61. .fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--expanded > span > a:after {

  62.   display: inline-block;

  63. }

  64. .fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--expanded > span > a:after {

  65.   content: "";

  66. }

  67. .fa-loaded .ms-dropmenu .rm-block__content .menu-level-1 .menu__item--collapsed > span > a:after {

  68.   content: '';

  69. }

  70. .ms-dropmenu .rm-block__content .is-child {

  71.   position: absolute;

  72.   visibility: hidden;

  73.   opacity: 0;

  74.   margin: 0;

  75.   padding: 0;

  76.   max-height: 1000px;

  77.   width: 100%;

  78. }

  79. .ms-dropmenu .rm-block__content .is-child:hover, .ms-dropmenu .rm-block__content .is-child:focus {

  80.   visibility: visible;

  81.   opacity: 1;

  82. }

  83. .ms-dropmenu .rm-block__content .is-child .menu__item {

  84.   min-width: 12em;

  85.   text-align: left;

  86.   width: 100%;

  87. }

  88. .ms-dropmenu .rm-block__content .menu-level-2 {

  89.   left: 0;

  90.   top: auto;

  91. }

  92. .fa-loaded .ms-dropmenu .rm-block__content .menu-level-2 .menu__item--expanded > span > a:after {

  93.   content: "";

  94. }

  95. [dir="rtl"] .fa-loaded .ms-dropmenu .rm-block__content .menu-level-2 .menu__item--expanded > span > a:after {

  96.   content: "";

  97. }

  98. .ms-dropmenu .rm-block__content .menu-level-2 .is-child {

  99.   left: 100%;

  100.   top: 0;

  101. }

  102. 

  103. /*# sourceMappingURL=maps/responsive-menus--dropmenu.css.map */