gerrit.onap Code Review - vnfsdk/refrepo.git/blob

   1 /*!
   2  * Angular Material Design
   3  * https://github.com/angular/material
   4  * @license MIT
   5  * v1.1.3
   6  */
   7 .md-open-menu-container {
   8   position: fixed;
   9   left: 0;
  10   top: 0;
  11   z-index: 100;
  12   opacity: 0;
  13   border-radius: 2px; }
  14   .md-open-menu-container md-menu-divider {
  15     margin-top: 4px;
  16     margin-bottom: 4px;
  17     height: 1px;
  18     min-height: 1px;
  19     max-height: 1px;
  20     width: 100%; }
  21   .md-open-menu-container md-menu-content > * {
  22     opacity: 0; }
  23   .md-open-menu-container:not(.md-clickable) {
  24     pointer-events: none; }
  25   .md-open-menu-container.md-active {
  26     opacity: 1;
  27     -webkit-transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  28     transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  29     -webkit-transition-duration: 200ms;
  30             transition-duration: 200ms; }
  31     .md-open-menu-container.md-active > md-menu-content > * {
  32       opacity: 1;
  33       -webkit-transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
  34       transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
  35       -webkit-transition-duration: 200ms;
  36               transition-duration: 200ms;
  37       -webkit-transition-delay: 100ms;
  38               transition-delay: 100ms; }
  39   .md-open-menu-container.md-leave {
  40     opacity: 0;
  41     -webkit-transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
  42     transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
  43     -webkit-transition-duration: 250ms;
  44             transition-duration: 250ms; }
  45
  46 md-menu-content {
  47   display: -webkit-box;
  48   display: -webkit-flex;
  49   display: flex;
  50   -webkit-box-orient: vertical;
  51   -webkit-box-direction: normal;
  52   -webkit-flex-direction: column;
  53           flex-direction: column;
  54   padding: 8px 0;
  55   max-height: 304px;
  56   overflow-y: auto; }
  57   md-menu-content.md-dense {
  58     max-height: 208px; }
  59     md-menu-content.md-dense md-menu-item {
  60       height: 32px;
  61       min-height: 0px; }
  62
  63 md-menu-item {
  64   display: -webkit-box;
  65   display: -webkit-flex;
  66   display: flex;
  67   -webkit-box-orient: horizontal;
  68   -webkit-box-direction: normal;
  69   -webkit-flex-direction: row;
  70           flex-direction: row;
  71   min-height: 48px;
  72   height: 48px;
  73   -webkit-align-content: center;
  74           align-content: center;
  75   -webkit-box-pack: start;
  76   -webkit-justify-content: flex-start;
  77           justify-content: flex-start;
  78   /*
  79    * We cannot use flex on <button> elements due to a bug in Firefox, so we also can't use it on
  80    * <a> elements. Add some top padding to fix alignment since buttons automatically align their
  81    * text vertically.
  82    */ }
  83   md-menu-item > * {
  84     width: 100%;
  85     margin: auto 0;
  86     padding-left: 16px;
  87     padding-right: 16px; }
  88   md-menu-item > a.md-button {
  89     padding-top: 5px; }
  90   md-menu-item > .md-button {
  91     text-align: left;
  92     display: inline-block;
  93     border-radius: 0;
  94     margin: auto 0;
  95     font-size: 15px;
  96     text-transform: none;
  97     font-weight: 400;
  98     height: 100%;
  99     padding-left: 16px;
 100     padding-right: 16px;
 101     width: 100%; }
 102     md-menu-item > .md-button::-moz-focus-inner {
 103       padding: 0;
 104       border: 0; }
 105     [dir=rtl] md-menu-item > .md-button {
 106       text-align: right; }
 107     md-menu-item > .md-button md-icon {
 108       margin: auto 16px auto 0; }
 109       [dir=rtl] md-menu-item > .md-button md-icon {
 110         margin: auto 0 auto 16px; }
 111     md-menu-item > .md-button p {
 112       display: inline-block;
 113       margin: auto; }
 114     md-menu-item > .md-button span {
 115       margin-top: auto;
 116       margin-bottom: auto; }
 117     md-menu-item > .md-button .md-ripple-container {
 118       border-radius: inherit; }
 119
 120 md-toolbar .md-menu {
 121   height: auto;
 122   margin: auto;
 123   padding: 0; }
 124
 125 @media (max-width: 959px) {
 126   md-menu-content {
 127     min-width: 112px; }
 128   md-menu-content[width="3"] {
 129     min-width: 168px; }
 130   md-menu-content[width="4"] {
 131     min-width: 224px; }
 132   md-menu-content[width="5"] {
 133     min-width: 280px; }
 134   md-menu-content[width="6"] {
 135     min-width: 336px; }
 136   md-menu-content[width="7"] {
 137     min-width: 392px; } }
 138
 139 @media (min-width: 960px) {
 140   md-menu-content {
 141     min-width: 96px; }
 142   md-menu-content[width="3"] {
 143     min-width: 192px; }
 144   md-menu-content[width="4"] {
 145     min-width: 256px; }
 146   md-menu-content[width="5"] {
 147     min-width: 320px; }
 148   md-menu-content[width="6"] {
 149     min-width: 384px; }
 150   md-menu-content[width="7"] {
 151     min-width: 448px; } }