diff --git a/site/docs/app/src/main/kotlin/elide/site/controllers/SitePageController.kt b/site/docs/app/src/main/kotlin/elide/site/controllers/SitePageController.kt index 910af8cd90..0ae9cb1cca 100644 --- a/site/docs/app/src/main/kotlin/elide/site/controllers/SitePageController.kt +++ b/site/docs/app/src/main/kotlin/elide/site/controllers/SitePageController.kt @@ -43,7 +43,6 @@ import tools.elide.data.CompressionMode import java.io.ByteArrayOutputStream import java.io.OutputStream import java.nio.charset.Charset -import java.nio.charset.StandardCharsets import java.security.MessageDigest import java.time.Duration import java.util.Locale @@ -823,15 +822,24 @@ abstract class SitePageController protected constructor(val page: SitePage) : Pa portions.add(mapOf( "@type" to "ListItem", "position" to 1, + "item" to mapOf( + "name" to page.parent!!.title, + ), )) portions.add(mapOf( "@type" to "ListItem", "position" to 2, + "item" to mapOf( + "name" to page.title, + ), )) } else { portions.add(mapOf( "@type" to "ListItem", "position" to 1, + "item" to mapOf( + "name" to page.title, + ), )) } @@ -919,6 +927,10 @@ abstract class SitePageController protected constructor(val page: SitePage) : Pa // page title title { +renderTitle() } + meta { + name = "viewport" + content = "width=device-width, initial-scale=1" + } // UI and analytics scripts script { diff --git a/site/docs/content/src/commonMain/kotlin/elide/site/ElideSite.kt b/site/docs/content/src/commonMain/kotlin/elide/site/ElideSite.kt index 99491a65c1..b876c026a5 100644 --- a/site/docs/content/src/commonMain/kotlin/elide/site/ElideSite.kt +++ b/site/docs/content/src/commonMain/kotlin/elide/site/ElideSite.kt @@ -44,7 +44,7 @@ object ElideSite { override val prelabel = "αlpha" /** Main heading to use for the navigation bar. */ - override val heading = "$name Framework" + override val heading = name } /** Default site info. */ diff --git a/site/docs/content/src/jvmMain/kotlin/elide/site/pages/GettingStarted.kt b/site/docs/content/src/jvmMain/kotlin/elide/site/pages/GettingStarted.kt index 4c892cddb0..2cc7bff40f 100644 --- a/site/docs/content/src/jvmMain/kotlin/elide/site/pages/GettingStarted.kt +++ b/site/docs/content/src/jvmMain/kotlin/elide/site/pages/GettingStarted.kt @@ -3,7 +3,7 @@ package elide.site.pages import elide.site.I18nPage import elide.site.abstract.SitePage import java.net.URI -import elide.site.pages.defaults.Home as Defaults +import elide.site.pages.defaults.GettingStarted as Defaults import java.util.* /** Describes the Elide Getting Started page. */ diff --git a/site/docs/content/src/jvmMain/kotlin/elide/site/pages/Library.kt b/site/docs/content/src/jvmMain/kotlin/elide/site/pages/Library.kt index ed3e39e367..88ace3475f 100644 --- a/site/docs/content/src/jvmMain/kotlin/elide/site/pages/Library.kt +++ b/site/docs/content/src/jvmMain/kotlin/elide/site/pages/Library.kt @@ -4,7 +4,7 @@ import elide.site.I18nPage import elide.site.abstract.SitePage import java.net.URI import java.util.* -import elide.site.pages.defaults.Runtime as Defaults +import elide.site.pages.defaults.Library as Defaults /** Describes the Elide library intro top-level page. */ actual object Library : SitePage( diff --git a/site/docs/node/src/main/kotlin/main.kt b/site/docs/node/src/main/kotlin/main.kt index bf09e7a128..35548be998 100644 --- a/site/docs/node/src/main/kotlin/main.kt +++ b/site/docs/node/src/main/kotlin/main.kt @@ -21,12 +21,9 @@ import org.w3c.fetch.Request import react.ReactElement import web.url.URL -const val enableStreaming = true -const val chunkCss = true // Setup Emotion cache. private fun setupCache(context: dynamic): EmotionCache { - val statejson = JSON.stringify(context, emptyArray(), 0) val cspNonce = context.getNonce() return createCache(jso { key = "es" @@ -89,13 +86,13 @@ var modEmotionServer: EmotionServer? = null this, request, emotionCache, - ), stream = enableStreaming).execute { + ), stream = true).execute { try { if (it.hasContent) { response += it.content } - if (enableStreaming && chunkCss && it.fin) { + if (it.fin) { // in the final chunk, splice in CSS from Emotion. val emotionChunks = emotionServer.extractCriticalToChunks(response) val emotionCss = emotionServer.constructStyleTagsFromChunks(emotionChunks) diff --git a/site/docs/ui/src/main/assets/base.css b/site/docs/ui/src/main/assets/base.css index 893ecede3f..e4f0d98dd2 100644 --- a/site/docs/ui/src/main/assets/base.css +++ b/site/docs/ui/src/main/assets/base.css @@ -186,7 +186,7 @@ pre, .mono { } .elide-site-page__header, .elide-site-page__header h2 { - font-size: 2.5rem !important; + font-size: 2.5rem; } /** @@ -240,7 +240,6 @@ main#root { .elide-site-page.narrative { padding: 3rem; - height: 100%; } .elide-site-page.narrative header { @@ -300,3 +299,35 @@ main#root { left: 20px; bottom: 20px; } + + +/** + * ======= Styles: Mobile ======= + */ +@media screen and (max-device-width: 960px) { + .elide-site-container { + max-width: 100%; + overflow: hidden; + grid-template-columns: 0 auto !important; + } + + .elide-site-page.narrative { + padding: 1.5rem; + } + .elide-site-page__header h2 { + font-size: 1.75rem; + font-weight: 400; + } + .elide-sidebar { + display: none; + } +} + +/** + * ======= Styles: Desktop ======= + */ +@media screen and (min-device-width: 960px) { + .MuiSpeedDial-root { + display: none; + } +} diff --git a/site/docs/ui/src/main/assets/base.min.css b/site/docs/ui/src/main/assets/base.min.css index 1ff8853b16..a1b6481c78 100644 --- a/site/docs/ui/src/main/assets/base.min.css +++ b/site/docs/ui/src/main/assets/base.min.css @@ -1 +1 @@ -@font-face{font-display:swap;font-family:JetBrains Mono;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/jetbrainsmono/v13/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTOlOTk6OThhvA.woff) format("woff");src:url(https://fonts.gstatic.com/s/jetbrainsmono/v13/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTOlOVk6OThhvA.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:color-emoji;src:local("Apple Color Emoji"),local("Twemoji Mozilla"),local("Segoe UI Emoji"),local("Segoe UI Symbol"),local("Noto Color Emoji"),local("EmojiOne Color"),local("Android Emoji")}html{--elide-color-primary:#5a00ff;--elide-color-primary-desaturated:#f5f5f5;--elide-color-secondary:#9b09ab;--elide-color-secondary-desaturated:#f0f0f0;--elide-color-primary-alt:#199fda;--elide-color-secondary-alt:#73c167;--elide-color-primary-alt-desaturated:#000;--elide-color-secondary-alt-desaturated:#000;--elide-gradient-angle:225deg;--elide-black:#111;--elide-black-soft:#222;--elide-white:#f5f5f5;--elide-soft-white:#dedede;--elide-grays:linear-gradient(var(--elide-gradient-angle),var(--elide-color-primary-desaturated) 0%,var(--elide-color-secondary-desaturated) 100%);--elide-gradient:linear-gradient(var(--elide-gradient-angle),var(--elide-color-primary) 0%,var(--elide-color-secondary) 100%);--elide-gradient-reverse:linear-gradient(var(--elide-gradient-angle),var(--elide-color-secondary) 0%,var(--elide-color-primary) 100%);--elide-gradient-alt:linear-gradient(var(--elide-gradient-angle),var(--elide-color-primary-alt) 0%,var(--elide-color-secondary-alt) 100%);--elide-gradient-alt-reverse:linear-gradient(var(--elide-gradient-angle),var(--elide-color-secondary-alt) 0%,var(--elide-color-primary-alt) 100%)}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif,color-emoji}.gradient{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient)!important}@media (prefers-color-scheme:dark){.gradient-on-dark{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient)!important}.gradient-reverse-on-dark{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient-reverse)!important}}@media (prefers-color-scheme:light){.gradient-on-light{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient)!important}.gradient-reverse-on-light{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient-reverse)!important}}.mono,pre{font-family:JetBrains Mono,ui-monospace,Menlo,Monaco,Cascadia Mono,Segoe UI Mono,Roboto Mono,Oxygen Mono,"Ubuntu Monospace",Source Code Pro,Fira Mono,Droid Sans Mono,Courier New,monospace!important}.masthead-text{font-family:Rubik,-apple-system,BlinkMacSystemFont,sans-serif,color-emoji!important}.center{align-items:center;display:flex;justify-content:center}.elide-noselect{user-select:none}.elide-titletext{-webkit-font-smoothing:subpixel-antialiased!important;-moz-osx-font-smoothing:grayscale!important;text-rendering:optimizeLegibility!important}.elide-logotext{font-size:2rem}.elide-header__logo-box .elide-titletext{color:#fff;font-weight:300}.elide-brand-text{-webkit-text-fill-color:#0000;text-fill-color:#0000;background:var(--elide-gradient);-webkit-background-clip:text;background-clip:text;box-sizing:border-box;font-weight:600;padding:0}.elide-header__box{display:flex;flex-direction:row;flex-grow:1;justify-content:flex-start}.elide-header__logo-box{cursor:pointer;display:flex}.elide-header__logo-box img{margin-right:22px}.elide-header__logo-box h6{color:#ededed}.elide-header__prerelease{align-items:center;display:flex;height:32px;justify-content:center}.elide-site-page__header,.elide-site-page__header h2{font-size:2.5rem!important}.elide-nav-subnav__text,.elide-nav__text{cursor:pointer;display:flex;user-select:none}.elide-nav-subnav__text:before{content:"—";cursor:pointer;padding-right:8px;text-decoration:none;user-select:none}main#root{background-attachment:fixed;bottom:0;left:0;inset:0;position:fixed;right:0;top:0}.elide-site-container{height:100%;inset:0;position:relative;width:100%}.elide-site-page{display:flex;flex-direction:column}.elide-site-page.fullbleed{inset:0;position:absolute}.elide-site-page.narrative{height:100%;padding:3rem}.elide-site-page.narrative header{border-bottom:1px solid #ddd;margin-bottom:2rem;user-select:none}.elide-mdx__wrapped-p{padding-bottom:1em;padding-top:1em}.elide-mdx__blockquote{align-items:center;box-sizing:border-box;display:flex;flex-direction:row;justify-content:flex-start}.elide-mdx__blockquote.elide-mdx__note p.elide-mdx__wrapped-p:before{content:"Note:";font-weight:700;margin-right:3px}.elide-mdx__note{border-radius:5px;margin:10px 0;padding-left:10px}.elide-mdx__icon-note{margin-right:10px}.elide-footer{align-items:center;bottom:20px;box-sizing:border-box;display:flex;flex-direction:row;justify-content:flex-start;left:20px;position:absolute} +@font-face{font-display:swap;font-family:JetBrains Mono;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/jetbrainsmono/v13/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTOlOTk6OThhvA.woff) format("woff");src:url(https://fonts.gstatic.com/s/jetbrainsmono/v13/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTOlOVk6OThhvA.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:color-emoji;src:local("Apple Color Emoji"),local("Twemoji Mozilla"),local("Segoe UI Emoji"),local("Segoe UI Symbol"),local("Noto Color Emoji"),local("EmojiOne Color"),local("Android Emoji")}html{--elide-color-primary:#5a00ff;--elide-color-primary-desaturated:#f5f5f5;--elide-color-secondary:#9b09ab;--elide-color-secondary-desaturated:#f0f0f0;--elide-color-primary-alt:#199fda;--elide-color-secondary-alt:#73c167;--elide-color-primary-alt-desaturated:#000;--elide-color-secondary-alt-desaturated:#000;--elide-gradient-angle:225deg;--elide-black:#111;--elide-black-soft:#222;--elide-white:#f5f5f5;--elide-soft-white:#dedede;--elide-grays:linear-gradient(var(--elide-gradient-angle),var(--elide-color-primary-desaturated) 0%,var(--elide-color-secondary-desaturated) 100%);--elide-gradient:linear-gradient(var(--elide-gradient-angle),var(--elide-color-primary) 0%,var(--elide-color-secondary) 100%);--elide-gradient-reverse:linear-gradient(var(--elide-gradient-angle),var(--elide-color-secondary) 0%,var(--elide-color-primary) 100%);--elide-gradient-alt:linear-gradient(var(--elide-gradient-angle),var(--elide-color-primary-alt) 0%,var(--elide-color-secondary-alt) 100%);--elide-gradient-alt-reverse:linear-gradient(var(--elide-gradient-angle),var(--elide-color-secondary-alt) 0%,var(--elide-color-primary-alt) 100%)}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif,color-emoji}.gradient{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient)!important}@media (prefers-color-scheme:dark){.gradient-on-dark{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient)!important}.gradient-reverse-on-dark{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient-reverse)!important}}@media (prefers-color-scheme:light){.gradient-on-light{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient)!important}.gradient-reverse-on-light{background-attachment:fixed;background:#0000;background-image:var(--elide-gradient-reverse)!important}}.mono,pre{font-family:JetBrains Mono,ui-monospace,Menlo,Monaco,Cascadia Mono,Segoe UI Mono,Roboto Mono,Oxygen Mono,"Ubuntu Monospace",Source Code Pro,Fira Mono,Droid Sans Mono,Courier New,monospace!important}.masthead-text{font-family:Rubik,-apple-system,BlinkMacSystemFont,sans-serif,color-emoji!important}.center{align-items:center;display:flex;justify-content:center}.elide-noselect{user-select:none}.elide-titletext{-webkit-font-smoothing:subpixel-antialiased!important;-moz-osx-font-smoothing:grayscale!important;text-rendering:optimizeLegibility!important}.elide-logotext{font-size:2rem}.elide-header__logo-box .elide-titletext{color:#fff;font-weight:300}.elide-brand-text{-webkit-text-fill-color:#0000;text-fill-color:#0000;background:var(--elide-gradient);-webkit-background-clip:text;background-clip:text;box-sizing:border-box;font-weight:600;padding:0}.elide-header__box{display:flex;flex-direction:row;flex-grow:1;justify-content:flex-start}.elide-header__logo-box{cursor:pointer;display:flex}.elide-header__logo-box img{margin-right:22px}.elide-header__logo-box h6{color:#ededed}.elide-header__prerelease{align-items:center;display:flex;height:32px;justify-content:center}.elide-site-page__header,.elide-site-page__header h2{font-size:2.5rem}.elide-nav-subnav__text,.elide-nav__text{cursor:pointer;display:flex;user-select:none}.elide-nav-subnav__text:before{content:"—";cursor:pointer;padding-right:8px;text-decoration:none;user-select:none}main#root{background-attachment:fixed;bottom:0;left:0;inset:0;position:fixed;right:0;top:0}.elide-site-container{height:100%;inset:0;position:relative;width:100%}.elide-site-page{display:flex;flex-direction:column}.elide-site-page.fullbleed{inset:0;position:absolute}.elide-site-page.narrative{padding:3rem}.elide-site-page.narrative header{border-bottom:1px solid #ddd;margin-bottom:2rem;user-select:none}.elide-mdx__wrapped-p{padding-bottom:1em;padding-top:1em}.elide-mdx__blockquote{align-items:center;box-sizing:border-box;display:flex;flex-direction:row;justify-content:flex-start}.elide-mdx__blockquote.elide-mdx__note p.elide-mdx__wrapped-p:before{content:"Note:";font-weight:700;margin-right:3px}.elide-mdx__note{border-radius:5px;margin:10px 0;padding-left:10px}.elide-mdx__icon-note{margin-right:10px}.elide-footer{align-items:center;bottom:20px;box-sizing:border-box;display:flex;flex-direction:row;justify-content:flex-start;left:20px;position:absolute}@media screen and (max-device-width:960px){.elide-site-container{grid-template-columns:0 auto!important;max-width:100%;overflow:hidden}.elide-site-page.narrative{padding:1.5rem}.elide-site-page__header h2{font-size:1.75rem;font-weight:400}.elide-sidebar{display:none}}@media screen and (min-device-width:960px){.MuiSpeedDial-root{display:none}} diff --git a/site/docs/ui/src/main/assets/home.css b/site/docs/ui/src/main/assets/home.css index 39b8a54c74..34c14a4874 100644 --- a/site/docs/ui/src/main/assets/home.css +++ b/site/docs/ui/src/main/assets/home.css @@ -32,7 +32,6 @@ } .elide-page__home-nav { - margin-left: 10rem; display: flex; flex-direction: row; justify-content: flex-end; @@ -127,8 +126,8 @@ span.elide-brand-text.masthead-text { font-size: 2rem; } -.elide-logotext { - font-size: 2rem !important; +.elide-page__home .elide-logotext { + font-size: 2rem; } .elide-page__home.elide-theme__light { @@ -218,3 +217,54 @@ span.masthead-text__highlight { content: '·'; margin: 0 10px; } + +/** + * ======= Styles: Mobile ======= + */ +@media screen and (max-device-width: 960px) { + .elide-page__home .elide-site-page { + overflow-y: scroll; + } + + /* content columns must stack vertically */ + .elide-page__home-content { + flex-direction: column !important; + min-height: auto; + height: auto; + align-items: center; + } + + /* reduce padding around masthead text */ + .elide-page__home-masthead-text.masthead-text__title { + font-size: 3rem; + } + .elide-page__home .masthead-text__subtitle, .elide-page__home .masthead-text__subtitle span { + font-size: 1.3rem; + } + + /* masthead text can take full-width */ + .elide-page__home .masthead-text__title, .elide-page__home .masthead-text-subtitle, .elide-page__home-masthead-cta { + max-width: 95%; + } + + /* columns should display as blocks */ + .elide-page__home .elide-page__home-column { + display: block; + } + + /* "right"-side column should also take full width */ + .elide-page__home-column.elide-page__home-column-right { + display: none; + } + + /* make footer text bigger */ + .elide-page__home .elide-footer { + background: transparent; + user-select: none; + } + + /* hide nav links */ + .elide-page__home-nav button, .elide-page__home-nav a { + display: none; + } +} diff --git a/site/docs/ui/src/main/assets/home.min.css b/site/docs/ui/src/main/assets/home.min.css index 39073544f2..fd1faf77b2 100644 --- a/site/docs/ui/src/main/assets/home.min.css +++ b/site/docs/ui/src/main/assets/home.min.css @@ -1 +1 @@ -@font-face{font-display:block;font-family:Rubik;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/l/font?kit=iJWZBXyIfDnIV5PNhY1KTN7Z-Yh-B4i1U080V4fdkLdVHIPhLghxm6H4NTtG7lo4KH2dpQsfQ-dEPKg&skey=cee854e66788286d&v=v23) format("woff");src:url(https://fonts.gstatic.com/l/font?kit=iJWZBXyIfDnIV5PNhY1KTN7Z-Yh-B4i1VU80V4fdkLdVHIPhLghxm6H4NTtG7lo4KH2dpQsfQ-dEPKg&skey=cee854e66788286d&v=v23) format("woff2")}.elide-logobox{align-items:center;display:flex;justify-content:center}.elide-page__home-header{align-items:center;box-sizing:border-box;display:flex;flex-direction:row;justify-content:flex-start;padding:20px}.elide-page__home-header div.elide-logobox svg,.elide-page__home-header img{margin-right:18px}.elide-page__home-nav{margin-left:10rem;width:100%}.elide-page__home-nav,.elide-page__home-nav-right{align-items:center;display:flex;flex-direction:row;justify-content:flex-end}.elide-page__home-content{align-items:flex-end;display:flex;flex-direction:row;height:100%;justify-content:center}.elide-page__home-column{box-sizing:border-box;flex:1;height:90%;overflow:hidden;position:relative}.elide-page__home-column.elide-page__home-column-right{background:#333;border-bottom:none;border-right:none;border-top-left-radius:40px;max-width:47%;padding:40px}.elide-page__home-masthead-cta,.masthead-text__subtitle,.masthead-text__title{box-sizing:border-box;font-weight:600;max-width:86%;padding-left:5%}.elide-page__home-masthead-text .masthead-text.masthead-text__title{font-weight:600}.elide-page__home-masthead-cta button{background:var(--elide-gradient);box-shadow:0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;color:#fff;font-size:1.1rem;font-weight:600;opacity:.95;transition-property:opacity,box-shadow}.elide-page__home-masthead-cta button:hover{box-shadow:0 1px 2px #00000012,0 2px 4px #00000012,0 4px 8px #00000012,0 8px 16px #00000012,0 16px 32px #00000012,0 32px 64px #00000012;color:#fff;opacity:1}.masthead-text__subtitle,.masthead-text__title{padding:5%}span.elide-brand-text.masthead-text{padding:0}.elide-page__home-masthead-text.masthead-text__title{font-size:5rem}.elide-page__home .masthead-text__subtitle span{font-size:2rem}.elide-logotext{font-size:2rem!important}.elide-page__home.elide-theme__light{background:var(--elide-grays)}.elide-theme__light .elide-logotext,.elide-theme__light .masthead-text span{color:#333}span.masthead-text__highlight{-webkit-text-fill-color:#0000!important;text-fill-color:#0000!important;-webkit-background-clip:text!important;background-clip:text!important}.elide-theme__light .masthead-text__subtitle span.masthead-text__highlight,.elide-theme__light .masthead-text__title span.masthead-text__highlight{background:var(--elide-gradient-reverse)}.elide-theme__dark .elide-logotext{color:#fefefe}.elide-theme__dark .masthead-text span{color:#333}.elide-theme__dark .masthead-text span.masthead-text__highlight{-webkit-text-fill-color:#0000;text-fill-color:#0000;background:var(--elide-grays);-webkit-background-clip:text;background-clip:text}.elide-page__home-codesample-container{align-items:center;color:#dedede;display:flex;flex-direction:column;height:100%;justify-content:flex-start;margin-top:10px}.elide-page__home-codesample-container-bottom{bottom:0;left:0;max-height:36%;position:absolute;right:-90px;text-align:right}.elide-page__home-codesample{-webkit-font-smoothing:subpixel-antialiased!important;-moz-osx-font-smoothing:grayscale!important;background:#0000;font-family:JetBrains Mono,monospace;font-weight:300;text-rendering:optimizeLegibility!important;z-index:1000}.elide-page__home-codesample-tab{border-bottom-color:#fefefe;color:#fefefe;cursor:pointer;text-transform:none}.elide-page__home-legal a{margin-right:10px}.elide-page__home-legal:before{content:"·";margin:0 10px} +@font-face{font-display:block;font-family:Rubik;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/l/font?kit=iJWZBXyIfDnIV5PNhY1KTN7Z-Yh-B4i1U080V4fdkLdVHIPhLghxm6H4NTtG7lo4KH2dpQsfQ-dEPKg&skey=cee854e66788286d&v=v23) format("woff");src:url(https://fonts.gstatic.com/l/font?kit=iJWZBXyIfDnIV5PNhY1KTN7Z-Yh-B4i1VU80V4fdkLdVHIPhLghxm6H4NTtG7lo4KH2dpQsfQ-dEPKg&skey=cee854e66788286d&v=v23) format("woff2")}.elide-logobox{align-items:center;display:flex;justify-content:center}.elide-page__home-header{align-items:center;box-sizing:border-box;display:flex;flex-direction:row;justify-content:flex-start;padding:20px}.elide-page__home-header div.elide-logobox svg,.elide-page__home-header img{margin-right:18px}.elide-page__home-nav{width:100%}.elide-page__home-nav,.elide-page__home-nav-right{align-items:center;display:flex;flex-direction:row;justify-content:flex-end}.elide-page__home-content{align-items:flex-end;display:flex;flex-direction:row;height:100%;justify-content:center}.elide-page__home-column{box-sizing:border-box;flex:1;height:90%;overflow:hidden;position:relative}.elide-page__home-column.elide-page__home-column-right{background:#333;border-bottom:none;border-right:none;border-top-left-radius:40px;max-width:47%;padding:40px}.elide-page__home-masthead-cta,.masthead-text__subtitle,.masthead-text__title{box-sizing:border-box;font-weight:600;max-width:86%;padding-left:5%}.elide-page__home-masthead-text .masthead-text.masthead-text__title{font-weight:600}.elide-page__home-masthead-cta button{background:var(--elide-gradient);box-shadow:0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;color:#fff;font-size:1.1rem;font-weight:600;opacity:.95;transition-property:opacity,box-shadow}.elide-page__home-masthead-cta button:hover{box-shadow:0 1px 2px #00000012,0 2px 4px #00000012,0 4px 8px #00000012,0 8px 16px #00000012,0 16px 32px #00000012,0 32px 64px #00000012;color:#fff;opacity:1}.masthead-text__subtitle,.masthead-text__title{padding:5%}span.elide-brand-text.masthead-text{padding:0}.elide-page__home-masthead-text.masthead-text__title{font-size:5rem}.elide-page__home .elide-logotext,.elide-page__home .masthead-text__subtitle span{font-size:2rem}.elide-page__home.elide-theme__light{background:var(--elide-grays)}.elide-theme__light .elide-logotext,.elide-theme__light .masthead-text span{color:#333}span.masthead-text__highlight{-webkit-text-fill-color:#0000!important;text-fill-color:#0000!important;-webkit-background-clip:text!important;background-clip:text!important}.elide-theme__light .masthead-text__subtitle span.masthead-text__highlight,.elide-theme__light .masthead-text__title span.masthead-text__highlight{background:var(--elide-gradient-reverse)}.elide-theme__dark .elide-logotext{color:#fefefe}.elide-theme__dark .masthead-text span{color:#333}.elide-theme__dark .masthead-text span.masthead-text__highlight{-webkit-text-fill-color:#0000;text-fill-color:#0000;background:var(--elide-grays);-webkit-background-clip:text;background-clip:text}.elide-page__home-codesample-container{align-items:center;color:#dedede;display:flex;flex-direction:column;height:100%;justify-content:flex-start;margin-top:10px}.elide-page__home-codesample-container-bottom{bottom:0;left:0;max-height:36%;position:absolute;right:-90px;text-align:right}.elide-page__home-codesample{-webkit-font-smoothing:subpixel-antialiased!important;-moz-osx-font-smoothing:grayscale!important;background:#0000;font-family:JetBrains Mono,monospace;font-weight:300;text-rendering:optimizeLegibility!important;z-index:1000}.elide-page__home-codesample-tab{border-bottom-color:#fefefe;color:#fefefe;cursor:pointer;text-transform:none}.elide-page__home-legal a{margin-right:10px}.elide-page__home-legal:before{content:"·";margin:0 10px}@media screen and (max-device-width:960px){.elide-page__home .elide-site-page{overflow-y:scroll}.elide-page__home-content{align-items:center;flex-direction:column!important;height:auto;min-height:auto}.elide-page__home-masthead-text.masthead-text__title{font-size:3rem}.elide-page__home .masthead-text__subtitle,.elide-page__home .masthead-text__subtitle span{font-size:1.3rem}.elide-page__home .masthead-text-subtitle,.elide-page__home .masthead-text__title,.elide-page__home-masthead-cta{max-width:95%}.elide-page__home .elide-page__home-column{display:block}.elide-page__home-column.elide-page__home-column-right{display:none}.elide-page__home .elide-footer{background:#0000;user-select:none}.elide-page__home-nav a,.elide-page__home-nav button{display:none}} diff --git a/site/docs/ui/src/main/kotlin/elide/site/ui/ElideSite.kt b/site/docs/ui/src/main/kotlin/elide/site/ui/ElideSite.kt index 957920fa0d..b5a7b267f7 100644 --- a/site/docs/ui/src/main/kotlin/elide/site/ui/ElideSite.kt +++ b/site/docs/ui/src/main/kotlin/elide/site/ui/ElideSite.kt @@ -12,6 +12,7 @@ import js.core.jso import mui.system.Box import mui.system.sx import react.router.useLocation +import web.window.window // Whether to emit debug logs to the console. private var debugLogging = false @@ -114,7 +115,11 @@ private fun determineFullbleed(location: history.Location): Boolean { * @return Whether full-bleed mode is active. */ private fun determineMobile(): Boolean { - return false + return try { + window.innerWidth < 1024 + } catch (thr: Throwable) { + false + } } /** @@ -151,7 +156,7 @@ val ElideSite = react.FC { gridTemplateAreas = GridTemplateAreas( arrayOf(Area.Header, Area.Header), - if (isMobile) arrayOf(Area.Content, Area.Content) else arrayOf(Area.Sidebar, Area.Content), + arrayOf(Area.Sidebar, Area.Content), ) } @@ -171,7 +176,8 @@ val ElideSite = react.FC { Header() } if (!fullbleed) { - if (isMobile) Menu() else Sidebar() + Menu() + Sidebar() } Content { page = it.page diff --git a/site/docs/ui/src/main/kotlin/elide/site/ui/components/Content.kt b/site/docs/ui/src/main/kotlin/elide/site/ui/components/Content.kt index 7a97012afe..13a63d76a5 100644 --- a/site/docs/ui/src/main/kotlin/elide/site/ui/components/Content.kt +++ b/site/docs/ui/src/main/kotlin/elide/site/ui/components/Content.kt @@ -1,5 +1,6 @@ package elide.site.ui.components +import csstype.ClassName import csstype.Overflow import csstype.pct import csstype.px @@ -48,11 +49,15 @@ val Content = react.FC { } Box { + className = ClassName("elide-site-content-container") + sx { gridArea = Area.Content - overflowX = Overflow.scroll maxHeight = 100.pct + maxWidth = 100.pct + overflowY = Overflow.scroll } + Routes { ElideSite.pages.filter { !it.hidden }.forEach { page -> Route { diff --git a/site/docs/ui/src/main/kotlin/elide/site/ui/components/Menu.kt b/site/docs/ui/src/main/kotlin/elide/site/ui/components/Menu.kt index 2624f9b660..3df3f70072 100644 --- a/site/docs/ui/src/main/kotlin/elide/site/ui/components/Menu.kt +++ b/site/docs/ui/src/main/kotlin/elide/site/ui/components/Menu.kt @@ -44,7 +44,9 @@ val Menu = react.FC { List { sx { width = Sizes.Sidebar.Width } - ElideSite.pages.forEach { page -> + ElideSite.pages.filter { + it.name != "home" && !it.hidden + }.forEach { page -> NavLink { key = page.name to = page.path diff --git a/site/docs/ui/src/main/kotlin/elide/site/ui/components/Sidebar.kt b/site/docs/ui/src/main/kotlin/elide/site/ui/components/Sidebar.kt index 3cbda36465..d384620f57 100644 --- a/site/docs/ui/src/main/kotlin/elide/site/ui/components/Sidebar.kt +++ b/site/docs/ui/src/main/kotlin/elide/site/ui/components/Sidebar.kt @@ -124,6 +124,8 @@ val Sidebar = react.FC { Box { component = nav + className = ClassName("elide-sidebar") + sx { gridArea = Area.Sidebar width = Sizes.Sidebar.Width diff --git a/site/docs/ui/src/main/kotlin/elide/site/ui/pages/startup/GettingStarted.kt b/site/docs/ui/src/main/kotlin/elide/site/ui/pages/startup/GettingStarted.kt index 61af2ac716..519f98f790 100644 --- a/site/docs/ui/src/main/kotlin/elide/site/ui/pages/startup/GettingStarted.kt +++ b/site/docs/ui/src/main/kotlin/elide/site/ui/pages/startup/GettingStarted.kt @@ -124,7 +124,7 @@ val GettingStarted = react.FC { Link { component = a - href = "/tooling" + href = "/tools" +"tooling guides" } diff --git a/site/docs/ui/src/main/mdx/getting-started/install-library.md b/site/docs/ui/src/main/mdx/getting-started/install-library.md index 7b2772cc0d..94927fe64c 100644 --- a/site/docs/ui/src/main/mdx/getting-started/install-library.md +++ b/site/docs/ui/src/main/mdx/getting-started/install-library.md @@ -1,5 +1,5 @@ -#### Using Elide as a Library +#### Elide as a Library Using Elide as a framework or library is supported for **any language on the JVM**. Elide's components can be installed like any other Maven dependencies. See the full list of available Maven coordinates on the [Packages](/library/packages) @@ -12,19 +12,19 @@ page. In **Groovy**: ```groovy - dependencies { - // for the `core` package: - implementation "dev.elide:elide-core:" - } +dependencies { + // for the `core` package: + implementation "dev.elide:elide-core:" +} ``` Or, for the **Kotlin DSL**: ```kotlin - dependencies { - // for the `core` package: - implementation("dev.elide:elide-core:") - } +dependencies { + // for the `core` package: + implementation("dev.elide:elide-core:") +} ``` ##### Maven @@ -33,10 +33,10 @@ Elide doesn't yet have a Maven plugin. However, all [Elide packages](/library/pa and are usable in a Maven project: ```xml - - - dev.elide - elide-core - - + + + dev.elide + elide-core + + ``` diff --git a/site/docs/ui/src/main/mdx/getting-started/install-runtime.md b/site/docs/ui/src/main/mdx/getting-started/install-runtime.md index ff48f0d7a0..7d54d7dbe5 100644 --- a/site/docs/ui/src/main/mdx/getting-started/install-runtime.md +++ b/site/docs/ui/src/main/mdx/getting-started/install-runtime.md @@ -1,7 +1,7 @@
-#### Using Elide as a Runtime +#### Elide as a Runtime Installing Elide on your machine is easy. Pick one of the installation methods below. @@ -18,35 +18,6 @@ script is customizable, and defaults to installing the binary in `~/bin` and upd curl -sSL --tlsv1.2 "dl.elide.dev/cli/install.sh" | bash -s - ``` -###### One-liner installer usage - -There are several flags which customize the one-line installer. Pass `--help` to see them in your terminal. You should -get something back along the lines of: - -``` -~ curl -sSL --tlsv1.2 "dl.elide.dev/cli/install.sh" | bash -s - --help - -Elide: CLI installer v0.7 -https://github.com/elide-dev - -Usage: - ./install.sh - ./install.sh | bash [options] - curl https://dl.elide.dev/cli/v1/snapshot/install.sh | bash - curl https://dl.elide.dev/cli/v1/snapshot/install.sh | bash [options] - -Options: - --install-dir= Install to a custom directory - --install-rev= Install a specific version of Elide - --[no]-path Whether to add the install directory to the PATH - --no-banner Opt out of the announcement banner after install - --no-color Disable color output - --debug Enable debug output - --trace Enable bash tracing - --version Show version information - --help Show this help message -``` - > Support for Apt, Brew, and other package managers is coming soon.
diff --git a/site/docs/ui/src/main/resources/index.html b/site/docs/ui/src/main/resources/index.html index 522da4adb6..da2959e5c9 100644 --- a/site/docs/ui/src/main/resources/index.html +++ b/site/docs/ui/src/main/resources/index.html @@ -3,6 +3,7 @@ Elide | Polyglot app runtime and framework +