@meduza/ui-kit-2 0.7.6 → 0.7.8

package/dist/ui-kit.css

@@ -700,6 +700,15 @@
   width: 100%;
   height: 100%;
 }
+.Image-module_isStatic__TmQ1V img {
+  position: relative;
+  max-height: 160px;
+}
+@media only screen and (min-width: 64em) {
+.Image-module_isStatic__TmQ1V img {
+    max-height: 200px;
+}
+  }
 .Image-module_isLoaded__keFnD {
   background-color: transparent;
 }
@@ -1234,6 +1243,14 @@
     line-height: 20px;
 }
   }
+.Tag-module_isInBookRelated__ikTaj {
+  opacity: 0.5;
+}
+@media only screen and (min-width: 64em) {
+.Tag-module_isInBookRelated__ikTaj {
+    line-height: 20px;
+}
+  }
 .Tag-module_slide__gzptP,
 .Tag-module_game__NmKec,
 .Tag-module_card__TX87-,
@@ -1913,7 +1930,7 @@
 /* Zindex */
 .Dropdown-module_root__Wv7S- {
   position: relative;
-  z-index: 100;
+  z-index: auto;
 
   display: inline-block;
 
@@ -1925,10 +1942,16 @@
 
   opacity: 1;
 }
+.Dropdown-module_root__Wv7S-.Dropdown-module_inactive__E5CP6 .Dropdown-module_menu__11IQL {
+  visibility: hidden;
+
+  opacity: 0;
+}
 .Dropdown-module_root__Wv7S- ul {
   overflow: hidden;
 
-  width: 162px;
+  width: 300px;
+  max-height: 400px;
   margin: 0;
   padding: 3px 0;
 
@@ -1939,7 +1962,14 @@
   font-family: 'Proxima Nova', 'Arial', 'Helvetica Neue', sans-serif;
   font-size: 14px;
   line-height: 26px;
+
+  overflow-y: auto;
+}
+@media only screen and (min-width: 64em) {
+.Dropdown-module_root__Wv7S- ul {
+    width: 320px;
 }
+  }
 .Dropdown-module_root__Wv7S- a {
   display: block;
 
@@ -1964,8 +1994,12 @@
     left: 0;
 }
   }
+.Dropdown-module_isInAudioPanel__UniSV .Dropdown-module_menu__11IQL ul {
+  width: 162px;
+}
 .Dropdown-module_menu__11IQL {
   position: absolute;
+  z-index: 1;
   top: 100%;
   left: 0;
 
@@ -1974,6 +2008,8 @@
   padding-top: 6px;
 
   opacity: 0;
+  left: 50%;
+  transform: translateX(-50%);
 }
 .Dropdown-module_menu__11IQL::after {
   position: absolute;
@@ -2220,6 +2256,9 @@
     display: none;
 }
   }
+.Meta-module_isInBookRelated__Ohidg {
+  opacity: 0.5;
+}
 /* VISIBILITY */
 @media only screen and (min-width: 32em) {
 .Meta-module_mobile__PbG8N {
@@ -2946,6 +2985,16 @@
     font-size: 1.35rem;
 }
   }
+.RichTitle-module_isInBookRelated__LcCPV {
+  margin: 6px 0 20px;
+}
+@media only screen and (min-width: 64em) {
+.RichTitle-module_isInBookRelated__LcCPV {
+    font-size: 27px;
+    line-height: 32px;
+    margin: 6px 0 18px;
+}
+  }
 @media only screen and (min-width: 32em) {
 .RichTitle-module_mobile__W5L9E {
     display: none;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.7.6",
+  "version": "0.7.8",
   "license": "MIT",
   "description": "UIKit for Meduza",
   "repository": "https://github.com/meduza-corp/ui-kit-2.git",

package/src/Dropdown/Dropdown.module.css

@@ -2,7 +2,7 @@
 
 .root {
   position: relative;
-  z-index: $zIndex-1;
+  z-index: auto;
 
   display: inline-block;
 
@@ -16,10 +16,17 @@
   opacity: 1;
 }
 
+.root.inactive .menu {
+  visibility: hidden;
+
+  opacity: 0;
+}
+
 .root ul {
   overflow: hidden;
 
-  width: 162px;
+  width: 300px;
+  max-height: 400px;
   margin: 0;
   padding: 3px 0;
 
@@ -30,6 +37,12 @@
   font-family: $secondaryFont;
   font-size: 14px;
   line-height: 26px;
+
+  overflow-y: auto;
+
+  @media $landscapeTablet {
+    width: 320px;
+  }
 }
 
 .root a {
@@ -58,8 +71,13 @@
   }
 }
 
+.isInAudioPanel .menu ul {
+  width: 162px;
+}
+
 .menu {
   position: absolute;
+  z-index: 1;
   top: 100%;
   left: 0;
 
@@ -68,6 +86,8 @@
   padding-top: 6px;
 
   opacity: 0;
+  left: 50%;
+  transform: translateX(-50%);
 }
 
 .menu::after {

package/src/Dropdown/index.tsx

@@ -20,7 +20,8 @@ export const Dropdown: React.FC<DropdownProps> = ({
 }) => {
   let classNames: ClassNames = [
     [styles.root, true],
-    [styles.active, !!active && !!styles.active]
+    [styles.active, !!active && !!styles.active],
+    [styles.inactive, !active && !!styles.inactive]
   ]
 
   if (styleContext) {

package/src/Image/Image.module.css

@@ -24,6 +24,15 @@
   height: 100%;
 }
 
+.isStatic img {
+  position: relative;
+  max-height: 160px;
+
+  @media $landscapeTablet {
+    max-height: 200px;
+  }
+}
+
 .isLoaded {
   background-color: transparent;
 }

package/src/Meta/Meta.module.css

@@ -104,6 +104,10 @@
   }
 }
 
+.isInBookRelated {
+  opacity: 0.5;
+}
+
 /* VISIBILITY */
 
 .mobile {

package/src/Meta/MetaContainer.tsx

@@ -132,6 +132,13 @@ export const MetaContainer: React.FC<MetaContainerProps> = ({
               </MetaItem>
             )
           }
+          case 'string': {
+            return (
+              <MetaItem hasSource={hasSource} bullets key={component.id}>
+                {component.text}
+              </MetaItem>
+            )
+          }
 
           default: {
             return null

package/src/RichTitle/RichTitle.module.css

@@ -105,6 +105,16 @@
   }
 }
 
+.isInBookRelated {
+  margin: 6px 0 20px;
+
+  @media $landscapeTablet {
+    font-size: 27px;
+    line-height: 32px;
+    margin: 6px 0 18px;
+  }
+}
+
 .mobile {
   @media $mobile {
     display: none;

package/src/Tag/Tag.module.css

@@ -101,6 +101,14 @@
   }
 }
 
+.isInBookRelated {
+  opacity: 0.5;
+  
+  @media $landscapeTablet {
+    line-height: 20px;
+  }
+}
+
 .slide,
 .game,
 .card,