@jetbrains/kotlin-web-site-ui 0.0.0-foundation-changes.1 → 0.0.0-foundation-changes.3

package/out/components/cta-block/cta-block.module.pcss.js

@@ -0,0 +1,8 @@
+var styles = {
+  "wrapper": "ktl-cta-block-module_wrapper_60Mug",
+  "topTitle": "ktl-cta-block-module_top-title_7p65f",
+  "mainTitle": "ktl-cta-block-module_main-title_r-947",
+  "content": "ktl-cta-block-module_content_9up3O",
+  "buttons": "ktl-cta-block-module_buttons_TbaMj"
+};
+export { styles as default };

package/out/components/cta-block/index.css

@@ -1,254 +1,36 @@
-:root {
-  --ktl-light-grey: #f4f4f4;
-  --ktl-dark-100: rgba(39, 40, 44, 1);
-  --ktl-dark-bg-hard: rgba(27, 27, 27, 1);
-  --ktl-icon-color-dark: rgba(39, 40, 44, 0.75);
-  --ktl-color-white-light: rgba(255, 255, 255, 0.75);
-  --ktl-transition-xfast: 100ms;
-  --ktl-transition-fast: 300ms;
-  --ktl-color-primary-light-theme: #7f52ff;
-  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
-  --ktl-light-text-hard: rgba(39, 40, 44, 1);
-  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
-  --ktl-divider-color: rgba(25, 25, 28, .2);
-  --ktl-overlay-z-index: 900;
-  --ktl-top-menu-z-index: 905;
-  --ktl-header-z-index: 906;
-  --ktl-mobile-dropdown-list-z-index: 907;
-  --ktl-header-height-mobile: 52px;
-  --ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
-  --rs-font-family-ui: var(--ktl-font-family-inter);
-}
-
-:root {
-  --ktl-box-block-s: 4px;
-  --ktl-box-block-m: 8px;
-  --ktl-box-block-l: 16px;
-
-  --ktl-box-section-s: 24px;
-  --ktl-box-section-m: 32px;
-  --ktl-box-section-l: 48px;
-
-  --ktl-box-page-s: 64px;
-  --ktl-box-page-m: 72px;
-  --ktl-box-page-l: 96px;
-}
-
-.ktl-hero {
-        font-family: var(--ktl-font-family-inter);
-        color: var(--ktl-light-text-hard);
-        font-weight: normal;
-        font-size: 42px;
-        line-height: 48px;
-        letter-spacing: -1px;
-        margin: 0;
-    }
-
-.ktl-hero_theme_dark {
-            color: #fff;
-        }
-
-@media (min-width: 1200px) {
-
-.ktl-hero {
-            font-size: 64px;
-            line-height: 72px;
-            letter-spacing: -3px
-    }
-        }
-
-.ktl-h1 {
-        font-family: var(--ktl-font-family-inter);
-        color: var(--ktl-light-text-hard);
-        font-weight: normal;
-        font-size: 36px;
-        line-height: 44px;
-        letter-spacing: -1px;
-        margin: 0;
-    }
-
-.ktl-h1_theme_dark {
-            color: #fff;
-        }
-
-@media (min-width: 1200px) {
-
-.ktl-h1 {
-            font-size: 43px;
-            line-height: 48px
-    }
-
-        }
-
-.ktl-h2 {
-        font-family: var(--ktl-font-family-inter);
-        color: var(--ktl-light-text-hard);
-        font-weight: 500;
-        font-size: 24px;
-        line-height: 32px;
-        letter-spacing: -0.5px;
-        margin: 0;
-
-    }
-
-.ktl-h2_theme_dark {
-            color: #fff;
-        }
-
-@media (min-width: 1200px) {
-
-.ktl-h2 {
-            font-size: 31px;
-            line-height: 40px
-
-    }
-
-        }
-
-.ktl-subtitle {
-        font-family: var(--ktl-font-family-inter);
-        color: var(--ktl-light-text-hard);
-        font-weight: normal;
-        font-size: 20px;
-        line-height: 32px;
-        margin: 0;
-    }
-
-.ktl-subtitle_theme_dark {
-            color: #fff;
-        }
-
-@media (min-width: 1200px) {
-
-.ktl-subtitle {
-            font-size: 31px;
-            line-height: 40px
-    }
-        }
-
-.ktl-h3 {
-        font-family: var(--ktl-font-family-inter);
-        color: var(--ktl-light-text-hard);
-        font-weight: 600;
-        font-size: 20px;
-        line-height: 32px;
-        margin: 0;
-    }
-
-.ktl-h3_theme_dark {
-            color: #fff;
-        }
-
-.ktl-h4 {
-        font-family: var(--ktl-font-family-inter);
-        color: var(--ktl-light-text-hard);
-        font-weight: 600;
-        font-size: 16px;
-        line-height: 24px;
-        margin: 0;
-    }
-
-.ktl-h4_theme_dark {
-            color: #fff;
-        }
-
-.ktl-text-1 {
-        font-family: var(--ktl-font-family-inter);
-        color: var(--ktl-light-text-hard);
-        font-weight: normal;
-        font-size: 20px;
-        line-height: 32px;
-        margin: 0;
-    }
-
-.ktl-text-1_theme_dark {
-            color: #fff;
-        }
-
-.ktl-text-2 {
-        font-family: var(--ktl-font-family-inter);
-        color: var(--ktl-light-text-hard);
-        font-weight: normal;
-        font-size: 16px;
-        line-height: 24px;
-        margin: 0;
-    }
-
-.ktl-text-2_theme_dark {
-            color: #fff;
-        }
-
-.ktl-text-3 {
-        font-family: var(--ktl-font-family-inter);
-        color: var(--ktl-light-text-hard);
-        font-weight: normal;
-        font-size: 13px;
-        line-height: 20px;
-        margin: 0;
-    }
-
-.ktl-text-3_theme_dark {
-            color: #fff;
-        }
-.ktl-cta-block-module_wrapper_pE-pv {
-    background: radial-gradient(
-            89.53% 145.96% at 0.34% 100.79%,
-            #EF4857 0%,
-            #DE4970 17.58%,
-            #B44DB0 50.31%,
-            #7F52FF 97.03%
-    );
-
-    padding: var(--ktl-box-page-m) 0;
-}
-
-.ktl-cta-block-module_top-title_8ly2n, .ktl-cta-block-module_main-title_iq1p4, .ktl-cta-block-module_content_QQ4PV, .ktl-cta-block-module_buttons_KPToV {
-    margin-bottom: var(--ktl-box-section-s);
-}
-
-.ktl-cta-block-module_layout_ExLIm .ktl-cta-block-module_top-title_8ly2n:last-child, .ktl-cta-block-module_layout_ExLIm .ktl-cta-block-module_main-title_iq1p4:last-child, .ktl-cta-block-module_layout_ExLIm .ktl-cta-block-module_content_QQ4PV:last-child, .ktl-cta-block-module_layout_ExLIm .ktl-cta-block-module_buttons_KPToV:last-child {
-        margin-bottom: 0;
-    }
-
-.ktl-cta-block-module_top-title_8ly2n {
-    font-size: 16px;
-    line-height: 24px;
-}
-
-
-.ktl-cta-block-module_wrapper_4ZjRD {
+.ktl-cta-block-module_wrapper_60Mug {
     background: radial-gradient(89.53% 145.96% at 0.34% 100.79%, #EF4857 0%, #DE4970 17.58%, #B44DB0 50.31%, #7F52FF 97.03%);
     color: #fff;
     padding: 32px 0;
 }
-    @media (min-width: 768px) {.ktl-cta-block-module_wrapper_4ZjRD {
+    @media (min-width: 768px) {.ktl-cta-block-module_wrapper_60Mug {
         padding: 48px 0
 }
     }
 
-.ktl-cta-block-module_top-title_quxOl {
+.ktl-cta-block-module_top-title_7p65f {
     max-width: 330px;
     margin-bottom: 64px;
 }
 
 @media (min-width: 768px) {
 
-.ktl-cta-block-module_top-title_quxOl {
+.ktl-cta-block-module_top-title_7p65f {
         margin-bottom: 96px
 }
     }
 
-.ktl-cta-block-module_main-title_-P-R- {
+.ktl-cta-block-module_main-title_r-947 {
 }
 
-.ktl-cta-block-module_content_UUzIO {
+.ktl-cta-block-module_content_9up3O {
     margin-top: 32px;
 }
 
-.ktl-cta-block-module_buttons_j6Wcs {
+.ktl-cta-block-module_buttons_TbaMj {
     margin-top: 32px;
 }
 
-.ktl-cta-block-module_buttons_j6Wcs button {
+.ktl-cta-block-module_buttons_TbaMj button {
         margin-right: 16px;
     }

package/out/components/cta-block/index.js

@@ -1,7 +1,30 @@
 import './index.css';
-import 'react';
-import 'classnames';
-import 'bem-cn-fast';
-import '@rescui/ui-contexts';
-import { CtaBlock } from './v1/cta-block.js';
-export { CtaBlock as default } from './v1/cta-block.js';
+import React from 'react';
+import styles from './cta-block.module.pcss.js';
+
+const CtaBlock = ({
+  topTitle,
+  mainTitle,
+  children,
+  buttons
+}) => {
+  return React.createElement("div", {
+    className: styles.wrapper
+  }, React.createElement("div", {
+    className: "ktl-container"
+  }, topTitle && React.createElement("div", {
+    className: styles.topTitle
+  }, React.createElement("div", {
+    className: "ktl-text-2 ktl-text-2_theme_dark"
+  }, topTitle)), React.createElement("div", {
+    className: styles.mainTitle
+  }, React.createElement("h2", {
+    className: "ktl-hero ktl-hero_theme_dark"
+  }, mainTitle)), children && React.createElement("div", {
+    className: styles.content
+  }, children), React.createElement("div", null), buttons && React.createElement("div", {
+    className: styles.buttons
+  }, buttons)));
+};
+
+export { CtaBlock };

package/out/components/cta-block-v2/cta-block.module.pcss.js

@@ -0,0 +1,9 @@
+var styles = {
+  "wrapper": "ktl-cta-block-module_wrapper_U-RIE",
+  "topTitle": "ktl-cta-block-module_top-title_ve70f",
+  "mainTitle": "ktl-cta-block-module_main-title_JbxBG",
+  "content": "ktl-cta-block-module_content_lCnnn",
+  "buttons": "ktl-cta-block-module_buttons_ObAIt",
+  "layout": "ktl-cta-block-module_layout_J-jWe"
+};
+export { styles as default };

package/out/components/cta-block-v2/index.css

@@ -0,0 +1,25 @@
+.ktl-cta-block-module_wrapper_U-RIE {
+    background: radial-gradient(
+            89.53% 145.96% at 0.34% 100.79%,
+            #EF4857 0%,
+            #DE4970 17.58%,
+            #B44DB0 50.31%,
+            #7F52FF 97.03%
+    );
+
+    padding: var(--ktl-box-page-m) 0;
+}
+
+.ktl-cta-block-module_top-title_ve70f, .ktl-cta-block-module_main-title_JbxBG, .ktl-cta-block-module_content_lCnnn, .ktl-cta-block-module_buttons_ObAIt {
+    margin-bottom: var(--ktl-box-section-s);
+}
+
+.ktl-cta-block-module_layout_J-jWe .ktl-cta-block-module_top-title_ve70f:last-child, .ktl-cta-block-module_layout_J-jWe .ktl-cta-block-module_main-title_JbxBG:last-child, .ktl-cta-block-module_layout_J-jWe .ktl-cta-block-module_content_lCnnn:last-child, .ktl-cta-block-module_layout_J-jWe .ktl-cta-block-module_buttons_ObAIt:last-child {
+        margin-bottom: 0;
+    }
+
+.ktl-cta-block-module_top-title_ve70f {
+    font-size: 16px;
+    line-height: 24px;
+}
+

package/out/components/cta-block-v2/index.js

@@ -0,0 +1,35 @@
+import './index.css';
+import React from 'react';
+import cn from 'classnames';
+import { useTextStyles } from '@jetbrains/kotlin-web-site-ui/out/components/typography';
+import styles from './cta-block.module.pcss.js';
+
+function CtaBlock({
+  className,
+  theme,
+  classTopTitle,
+  topTitle,
+  classMainTitle,
+  mainTitle,
+  classContent,
+  children,
+  classButtons,
+  buttons
+}) {
+  const textCn = useTextStyles(theme || 'dark');
+  return React.createElement("div", {
+    className: cn(className, styles.wrapper)
+  }, React.createElement("div", {
+    className: cn(styles.layout, 'ktl-layout ktl-layout--center')
+  }, topTitle && React.createElement("div", {
+    className: cn(classTopTitle, styles.topTitle, textCn('ktl-text-3'))
+  }, topTitle), React.createElement("h2", {
+    className: cn(classMainTitle, styles.mainTitle, textCn('ktl-hero'))
+  }, mainTitle), children && React.createElement("div", {
+    className: cn(classContent, styles.content)
+  }, children), buttons && React.createElement("div", {
+    className: cn(classButtons, styles.buttons)
+  }, buttons)));
+}
+
+export { CtaBlock };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@jetbrains/kotlin-web-site-ui",
   "description": "UI components for Kotlin web sites development",
-  "version": "0.0.0-foundation-changes.1",
+  "version": "0.0.0-foundation-changes.3",
   "license": "Apache-2.0",
   "author": "JetBrains",
   "files": [

package/out/components/cta-block/v1/cta-block.js

@@ -1,29 +0,0 @@
-import React from 'react';
-import styles from './cta-block.module.pcss.js';
-
-const CtaBlock = ({
-  topTitle,
-  mainTitle,
-  children,
-  buttons
-}) => {
-  return React.createElement("div", {
-    className: styles.wrapper
-  }, React.createElement("div", {
-    className: "ktl-container"
-  }, topTitle && React.createElement("div", {
-    className: styles.topTitle
-  }, React.createElement("div", {
-    className: "ktl-text-2 ktl-text-2_theme_dark"
-  }, topTitle)), React.createElement("div", {
-    className: styles.mainTitle
-  }, React.createElement("h2", {
-    className: "ktl-hero ktl-hero_theme_dark"
-  }, mainTitle)), children && React.createElement("div", {
-    className: styles.content
-  }, children), React.createElement("div", null), buttons && React.createElement("div", {
-    className: styles.buttons
-  }, buttons)));
-};
-
-export { CtaBlock };

package/out/components/cta-block/v1/cta-block.module.pcss.js

@@ -1,8 +0,0 @@
-var styles = {
-  "wrapper": "ktl-cta-block-module_wrapper_4ZjRD",
-  "topTitle": "ktl-cta-block-module_top-title_quxOl",
-  "mainTitle": "ktl-cta-block-module_main-title_-P-R-",
-  "content": "ktl-cta-block-module_content_UUzIO",
-  "buttons": "ktl-cta-block-module_buttons_j6Wcs"
-};
-export { styles as default };