fomantic-ui 2.9.0-beta.32 → 2.9.0-beta.321

package/dist/components/menu.css

@@ -24,7 +24,7 @@
   display: -ms-flexbox;
   display: flex;
   margin: 1rem 0;
-  font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
+  font-family: 'Lato', system-ui, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
   background: #FFFFFF;
   font-weight: normal;
   border: 1px solid rgba(34, 36, 38, 0.15);
@@ -33,7 +33,7 @@
   border-radius: 0.28571429rem;
   min-height: 2.85714286em;
 }
-.ui.menu:after {
+.ui.menu::after {
   content: '';
   display: block;
   height: 0;
@@ -100,7 +100,7 @@
 }
 
 /* Border */
-.ui.menu .item:before {
+.ui.menu .item::before {
   position: absolute;
   content: '';
   top: 0;
@@ -383,7 +383,7 @@
 
 
 /* Menu divider shouldn't apply */
-.ui.menu .list .item:before {
+.ui.menu .list .item::before {
   background: none !important;
 }
 
@@ -393,7 +393,7 @@
 
 
 /* Show vertical dividers below last */
-.ui.vertical.sidebar.menu > .item:first-child:before {
+.ui.vertical.sidebar.menu > .item:first-child::before {
   display: block !important;
 }
 .ui.vertical.sidebar.menu > .item::before {
@@ -596,7 +596,7 @@ Floated Menu / Item
 
 /*--- Border ---*/
 
-.ui.vertical.menu .item:before {
+.ui.vertical.menu .item::before {
   position: absolute;
   content: '';
   top: 0;
@@ -605,7 +605,7 @@ Floated Menu / Item
   height: 1px;
   background: rgba(34, 36, 38, 0.1);
 }
-.ui.vertical.menu .item:first-child:before {
+.ui.vertical.menu .item:first-child::before {
   display: none !important;
 }
 
@@ -624,7 +624,7 @@ Floated Menu / Item
 .ui.vertical.menu .item .menu .link.item:hover {
   color: rgba(0, 0, 0, 0.85);
 }
-.ui.vertical.menu .menu .item:before {
+.ui.vertical.menu .menu .item::before {
   display: none;
 }
 
@@ -677,7 +677,7 @@ Floated Menu / Item
   padding: 0.92857143em 1.42857143em;
   color: rgba(0, 0, 0, 0.87);
 }
-.ui.tabular.menu .item:before {
+.ui.tabular.menu .item::before {
   display: none;
 }
 
@@ -699,10 +699,12 @@ Floated Menu / Item
           box-shadow: none;
   border-radius: 0.28571429rem 0.28571429rem 0 0 !important;
 }
+.ui.tabular.menu .active.item:hover {
+  cursor: default;
+}
 
 /* Coupling with segment for attachment */
-.ui.tabular.menu + .attached:not(.top).segment,
-.ui.tabular.menu + .attached:not(.top).segment + .attached:not(.top).segment {
+.ui.tabular.menu ~ .attached:not(.top).segment {
   border-top: none;
   margin-left: 0;
   margin-top: 0;
@@ -796,6 +798,16 @@ Floated Menu / Item
   border-top: 2px solid transparent;
   border-bottom: none;
 }
+.ui.inverted.tabular.menu .active.item,
+.ui.inverted.tabular.menu .active.item:hover {
+  background: none #1B1C1D;
+  border-color: #555555;
+}
+.ui.inverted.tabular.menu .item:not(.active):hover {
+  color: #ffffff;
+  background: transparent;
+  cursor: pointer;
+}
 
 /*--------------
      Pagination
@@ -814,7 +826,7 @@ Floated Menu / Item
 .ui.compact.menu .item:last-child {
   border-radius: 0 0.28571429rem 0.28571429rem 0;
 }
-.ui.pagination.menu .item:last-child:before {
+.ui.pagination.menu .item:last-child::before {
   display: none;
 }
 .ui.pagination.menu .item {
@@ -865,7 +877,7 @@ Floated Menu / Item
 }
 
 /* No Divider */
-.ui.secondary.menu .item:before {
+.ui.secondary.menu .item::before {
   display: none !important;
 }
 
@@ -1008,7 +1020,7 @@ Floated Menu / Item
   -webkit-box-shadow: none !important;
           box-shadow: none !important;
 }
-.ui.secondary.pointing.menu .item:after {
+.ui.secondary.pointing.menu .item::after {
   display: none;
 }
 
@@ -1121,8 +1133,8 @@ Floated Menu / Item
 }
 
 /* Border */
-.ui.text.menu .item:before,
-.ui.text.menu .menu .item:before {
+.ui.text.menu .item::before,
+.ui.text.menu .menu .item::before {
   display: none !important;
 }
 
@@ -1205,7 +1217,7 @@ Floated Menu / Item
 }
 
 /* Disable Bariations */
-.ui.text.pointing.menu .active.item:after {
+.ui.text.pointing.menu .active.item::after {
   -webkit-box-shadow: none;
           box-shadow: none;
 }
@@ -1229,8 +1241,8 @@ Floated Menu / Item
 }
 
 /*--------------
-    Icon Only
----------------*/
+      Icon Only
+  ---------------*/
 
 
 /* Vertical Menu */
@@ -1253,7 +1265,7 @@ Floated Menu / Item
 }
 
 /* Icon Glyph */
-.ui.icon.menu i.icon:before {
+.ui.icon.menu i.icon::before {
   opacity: 1;
 }
 
@@ -1325,10 +1337,13 @@ Floated Menu / Item
         -ms-flex-direction: column;
             flex-direction: column;
   }
+  .ui.stackable.menu.pointing .active.item::after {
+    display: none;
+  }
   .ui.stackable.menu .item {
     width: 100% !important;
   }
-  .ui.stackable.menu .item:before {
+  .ui.stackable.menu .item::before {
     position: absolute;
     content: '';
     top: auto;
@@ -1459,10 +1474,10 @@ Floated Menu / Item
 
 /*--- Border ---*/
 
-.ui.inverted.menu .item:before {
+.ui.inverted.menu .item::before {
   background: rgba(255, 255, 255, 0.08);
 }
-.ui.vertical.inverted.menu .item:before {
+.ui.vertical.inverted.menu .item::before {
   background: rgba(255, 255, 255, 0.08);
 }
 
@@ -1518,7 +1533,7 @@ Floated Menu / Item
   background: transparent;
   color: #FFFFFF;
 }
-.ui.inverted.pointing.menu .active.item:after {
+.ui.inverted.pointing.menu .active.item::after {
   background: #3D3E3F;
   margin: 0 !important;
   -webkit-box-shadow: none !important;
@@ -1532,7 +1547,7 @@ Floated Menu / Item
   background: #3D3E3F;
   color: #FFFFFF !important;
 }
-.ui.inverted.pointing.menu .active.item:hover:after {
+.ui.inverted.pointing.menu .active.item:hover::after {
   background: #3D3E3F;
 }
 
@@ -1544,13 +1559,22 @@ Floated Menu / Item
   float: left;
   margin: 0 0.5rem 0 0;
 }
-.ui.floated.menu .item:last-child:before {
+.ui.floated.menu .item:last-child::before {
   display: none;
 }
 .ui.right.floated.menu {
   float: right;
   margin: 0 0 0 0.5rem;
 }
+.ui.center.aligned.menu,
+.ui.centered.menu {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-transform: translateX(-50%);
+          transform: translateX(-50%);
+  margin-left: 50%;
+}
 
 /*--------------
       Inverted
@@ -1560,7 +1584,7 @@ Floated Menu / Item
 .ui.ui.inverted.primary.menu {
   background-color: #2185D0;
 }
-.ui.inverted.primary.menu .item:before {
+.ui.inverted.primary.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.primary.menu .active.item {
@@ -1573,7 +1597,7 @@ Floated Menu / Item
 .ui.ui.inverted.red.menu {
   background-color: #DB2828;
 }
-.ui.inverted.red.menu .item:before {
+.ui.inverted.red.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.red.menu .active.item {
@@ -1586,7 +1610,7 @@ Floated Menu / Item
 .ui.ui.inverted.orange.menu {
   background-color: #F2711C;
 }
-.ui.inverted.orange.menu .item:before {
+.ui.inverted.orange.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.orange.menu .active.item {
@@ -1599,7 +1623,7 @@ Floated Menu / Item
 .ui.ui.inverted.yellow.menu {
   background-color: #FBBD08;
 }
-.ui.inverted.yellow.menu .item:before {
+.ui.inverted.yellow.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.yellow.menu .active.item {
@@ -1612,7 +1636,7 @@ Floated Menu / Item
 .ui.ui.inverted.olive.menu {
   background-color: #B5CC18;
 }
-.ui.inverted.olive.menu .item:before {
+.ui.inverted.olive.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.olive.menu .active.item {
@@ -1625,7 +1649,7 @@ Floated Menu / Item
 .ui.ui.inverted.green.menu {
   background-color: #21BA45;
 }
-.ui.inverted.green.menu .item:before {
+.ui.inverted.green.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.green.menu .active.item {
@@ -1638,7 +1662,7 @@ Floated Menu / Item
 .ui.ui.inverted.teal.menu {
   background-color: #00B5AD;
 }
-.ui.inverted.teal.menu .item:before {
+.ui.inverted.teal.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.teal.menu .active.item {
@@ -1651,7 +1675,7 @@ Floated Menu / Item
 .ui.ui.inverted.blue.menu {
   background-color: #2185D0;
 }
-.ui.inverted.blue.menu .item:before {
+.ui.inverted.blue.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.blue.menu .active.item {
@@ -1664,7 +1688,7 @@ Floated Menu / Item
 .ui.ui.inverted.violet.menu {
   background-color: #6435C9;
 }
-.ui.inverted.violet.menu .item:before {
+.ui.inverted.violet.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.violet.menu .active.item {
@@ -1677,7 +1701,7 @@ Floated Menu / Item
 .ui.ui.inverted.purple.menu {
   background-color: #A333C8;
 }
-.ui.inverted.purple.menu .item:before {
+.ui.inverted.purple.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.purple.menu .active.item {
@@ -1690,7 +1714,7 @@ Floated Menu / Item
 .ui.ui.inverted.pink.menu {
   background-color: #E03997;
 }
-.ui.inverted.pink.menu .item:before {
+.ui.inverted.pink.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.pink.menu .active.item {
@@ -1703,7 +1727,7 @@ Floated Menu / Item
 .ui.ui.inverted.brown.menu {
   background-color: #A5673F;
 }
-.ui.inverted.brown.menu .item:before {
+.ui.inverted.brown.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.brown.menu .active.item {
@@ -1716,7 +1740,7 @@ Floated Menu / Item
 .ui.ui.inverted.grey.menu {
   background-color: #767676;
 }
-.ui.inverted.grey.menu .item:before {
+.ui.inverted.grey.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.grey.menu .active.item {
@@ -1729,7 +1753,7 @@ Floated Menu / Item
 .ui.ui.inverted.black.menu {
   background-color: #1B1C1D;
 }
-.ui.inverted.black.menu .item:before {
+.ui.inverted.black.menu .item::before {
   background-color: rgba(34, 36, 38, 0.1);
 }
 .ui.ui.inverted.black.menu .active.item {
@@ -1738,7 +1762,7 @@ Floated Menu / Item
 .ui.inverted.pointing.black.menu .active.item {
   background-color: #27292a;
 }
-.ui.ui.ui.inverted.pointing.menu .active.item:after {
+.ui.ui.ui.inverted.pointing.menu .active.item::after {
   background-color: inherit;
 }
 
@@ -1768,9 +1792,9 @@ Floated Menu / Item
      Borderless
   ---------------*/
 
-.ui.borderless.menu .item:before,
-.ui.borderless.menu .item .menu .item:before,
-.ui.menu .borderless.item:before {
+.ui.borderless.menu .item::before,
+.ui.borderless.menu .item .menu .item::before,
+.ui.menu .borderless.item::before {
   background: none !important;
 }
 
@@ -1794,7 +1818,7 @@ Floated Menu / Item
 .ui.compact.menu:not(.secondary) .item:last-child {
   border-radius: 0 0.28571429rem 0.28571429rem 0;
 }
-.ui.compact.menu .item:last-child:before {
+.ui.compact.menu .item:last-child::before {
   display: none;
 }
 .ui.compact.vertical.menu {
@@ -1832,7 +1856,7 @@ Floated Menu / Item
 .ui.attached.item.menu:not(.tabular) {
   margin: 0 -1px !important;
 }
-.ui.item.menu .item:last-child:before {
+.ui.item.menu .item:last-child::before {
   display: none;
 }
 .ui.menu.two.item .item {
@@ -1937,7 +1961,7 @@ Floated Menu / Item
          Pointing
   --------------------*/
 
-.ui.pointing.menu .item:after {
+.ui.pointing.menu .item::after {
   visibility: hidden;
   position: absolute;
   content: '';
@@ -1956,7 +1980,7 @@ Floated Menu / Item
   -webkit-transition: background 0.1s ease;
   transition: background 0.1s ease;
 }
-.ui.vertical.pointing.menu .item:after {
+.ui.vertical.pointing.menu .item::after {
   position: absolute;
   top: 50%;
   right: 0;
@@ -1969,87 +1993,92 @@ Floated Menu / Item
   border-top: 1px solid #D4D4D5;
   border-right: 1px solid #D4D4D5;
 }
-.ui.pointing.menu .ui.dropdown .menu .item:after,
-.ui.vertical.pointing.menu .ui.dropdown .menu .item:after {
+.ui.pointing.menu .ui.dropdown .menu .item::after,
+.ui.vertical.pointing.menu .ui.dropdown .menu .item::after {
   display: none;
 }
 
 /* Active */
-.ui.pointing.menu .active.item:after {
+.ui.pointing.menu .active.item::after {
   visibility: visible;
 }
-.ui.pointing.menu .active.dropdown.item:after {
+.ui.pointing.menu .active.dropdown.item::after {
   visibility: hidden;
 }
 
 /* Don't double up pointers */
-.ui.pointing.menu .dropdown.active.item:after,
-.ui.pointing.menu .active.item .menu .active.item:after {
+.ui.pointing.menu .dropdown.active.item::after,
+.ui.pointing.menu .active.item .menu .active.item::after {
   display: none;
 }
 
 /* Colors */
-.ui.pointing.menu .active.item:hover:after {
+.ui.pointing.menu .active.item:hover::after {
   background-color: #F2F2F2;
 }
-.ui.pointing.menu .active.item:after {
+.ui.pointing.menu .active.item::after {
   background-color: #F2F2F2;
 }
-.ui.pointing.menu .active.item:hover:after {
+.ui.pointing.menu .active.item:hover::after {
   background-color: #F2F2F2;
 }
-.ui.vertical.pointing.menu .active.item:hover:after {
+.ui.vertical.pointing.menu .active.item:hover::after {
   background-color: #F2F2F2;
 }
-.ui.vertical.pointing.menu .active.item:after {
+.ui.vertical.pointing.menu .active.item::after {
   background-color: #F2F2F2;
 }
-.ui.vertical.pointing.menu .menu .active.item:after {
+.ui.vertical.pointing.menu .menu .active.item::after {
   background-color: #FFFFFF;
 }
-.ui.inverted.pointing.menu .primary.active.item:after {
+@media only screen and (max-width: 767.98px) {
+  .ui.stackable.grid .ui.fluid.vertical.pointing.menu .active.item::after {
+    display: none;
+  }
+}
+.ui.inverted.pointing.menu .primary.active.item::after {
   background-color: #2185D0;
 }
-.ui.inverted.pointing.menu .secondary.active.item:after {
+.ui.inverted.pointing.menu .secondary.active.item::after {
   background-color: #1B1C1D;
 }
-.ui.inverted.pointing.menu .red.active.item:after {
+.ui.inverted.pointing.menu .red.active.item::after {
   background-color: #DB2828;
 }
-.ui.inverted.pointing.menu .orange.active.item:after {
+.ui.inverted.pointing.menu .orange.active.item::after {
   background-color: #F2711C;
 }
-.ui.inverted.pointing.menu .yellow.active.item:after {
+.ui.inverted.pointing.menu .yellow.active.item::after {
   background-color: #FBBD08;
 }
-.ui.inverted.pointing.menu .olive.active.item:after {
+.ui.inverted.pointing.menu .olive.active.item::after {
   background-color: #B5CC18;
 }
-.ui.inverted.pointing.menu .green.active.item:after {
+.ui.inverted.pointing.menu .green.active.item::after {
   background-color: #21BA45;
 }
-.ui.inverted.pointing.menu .teal.active.item:after {
+.ui.inverted.pointing.menu .teal.active.item::after {
   background-color: #00B5AD;
 }
-.ui.inverted.pointing.menu .blue.active.item:after {
+.ui.inverted.pointing.menu .blue.active.item::after {
   background-color: #2185D0;
 }
-.ui.inverted.pointing.menu .violet.active.item:after {
+.ui.inverted.pointing.menu .violet.active.item::after {
   background-color: #6435C9;
 }
-.ui.inverted.pointing.menu .purple.active.item:after {
+.ui.inverted.pointing.menu .purple.active.item::after {
   background-color: #A333C8;
 }
-.ui.inverted.pointing.menu .pink.active.item:after {
+.ui.inverted.pointing.menu .pink.active.item::after {
   background-color: #E03997;
 }
-.ui.inverted.pointing.menu .brown.active.item:after {
+.ui.inverted.pointing.menu .brown.active.item::after {
   background-color: #A5673F;
 }
-.ui.inverted.pointing.menu .grey.active.item:after {
+.ui.inverted.pointing.menu .grey.active.item::after {
   background-color: #767676;
 }
-.ui.inverted.pointing.menu .black.active.item:after {
+.ui.inverted.pointing.menu .black.active.item::after {
   background-color: #1B1C1D;
 }
 
@@ -2108,12 +2137,15 @@ Floated Menu / Item
 }
 
 /* Tabular Attached */
-.ui.attached.menu:not(.tabular) {
+.ui.attached.menu:not(.tabular):not(.text) {
   border: 1px solid #D4D4D5;
 }
 .ui.attached.inverted.menu {
   border: none;
 }
+.ui[class*="top attached"].inverted.tabular.menu {
+  border-bottom: 1px solid #555555;
+}
 .ui.attached.tabular.menu {
   margin-left: 0;
   margin-right: 0;