Updated colors and light styles of homepage

packages/components/src/stories/SquiggleChart.stories.mdx

@@ -43,7 +43,7 @@ could be continuous, discrete or mixed.
   <Story
     name="Continuous Pointset"
     args={{
-      code: "toPointSet(normal(5,2))",
+      code: "PointSet.fromDist(normal(5,2))",
       width,
     }}
   >
@@ -57,7 +57,7 @@ could be continuous, discrete or mixed.
   <Story
     name="Continuous SampleSet"
     args={{
-      code: "toSampleSet(normal(5,2), 1000)",
+      code: "SampleSet.fromDist(normal(5,2))",
       width,
     }}
   >

packages/website/docs/Api/DistSampleSet.md

@@ -38,7 +38,7 @@ Gets the internal samples of a sampleSet distribution. This is separate from the
 **Examples**
 
 ```
-toList(toSampleSet(normal(5,2)))
+toList(SampleSet.fromDist(normal(5,2)))
 ```
 
 ### map

packages/website/docs/Discussions/Bugs.mdx

@@ -31,6 +31,6 @@ The means of sample set distributions can vary dramatically, especially as the n
 
 <SquiggleEditor
   defaultCode={`symbolicDist = 5 to 50333333
-sampleSetDist = toSampleSet(symbolicDist)
+sampleSetDist = SampleSet.fromDist(symbolicDist)
 [mean(symbolicDist), mean(sampleSetDist), symbolicDist, sampleSetDist]`}
 />

packages/website/docs/Guides/Functions.mdx

@@ -208,21 +208,15 @@ The `sample(distribution)` samples a given distribution.
 
 Recall the [three formats of distributions](https://develop--squiggle-documentation.netlify.app/docs/Discussions/Three-Types-Of-Distributions). We can force any distribution into `SampleSet` format
 
-<SquiggleEditor defaultCode="toSampleSet(normal(5, 10))" />
+<SquiggleEditor defaultCode="PointSet.fromDist(normal(5, 10))" />
 
 Or `PointSet` format
 
-<SquiggleEditor defaultCode="toPointSet(normal(5, 10))" />
+<SquiggleEditor defaultCode="PointSet.fromDist(normal(5, 10))" />
-
-### `toSampleSet` has two signatures
-
-Above, we saw the unary `toSampleSet`, which uses an internal hardcoded number of samples. If you'd like to provide the number of samples, it has a binary signature as well (floored)
-
-<SquiggleEditor defaultCode="[toSampleSet(0.1 to 1, 100.1), toSampleSet(0.1 to 1, 5000), toSampleSet(0.1 to 1, 20000)]" />
 
 #### Validity
 
-- Second argument to `toSampleSet` must be a number.
+- Second argument to `SampleSet.fromDist` must be a number.
 
 ## Normalization
 
@@ -246,7 +240,7 @@ We provide a predicate `isNormalized`, for when we have simple control flow
 
 You may like to debug by right clicking your browser and using the _inspect_ functionality on the webpage, and viewing the _console_ tab. Then, wrap your squiggle output with `inspect` to log an internal representation.
 
-<SquiggleEditor defaultCode="inspect(toSampleSet(0.1 to 1, 100))" />
+<SquiggleEditor defaultCode="inspect(SampleSet.fromDist(0.1 to 1))" />
 
 Save for a logging side effect, `inspect` does nothing to input and returns it.
 

packages/website/docs/Guides/Language.mdx

@@ -18,7 +18,7 @@ import { SquiggleEditor } from "../../src/components/SquiggleEditor";
 ### Arrays
 
 <SquiggleEditor
-  defaultCode={`[beta(1,10), 4, isNormalized(toSampleSet(1 to 2))]`}
+  defaultCode={`[beta(1,10), 4, isNormalized(SampleSet.fromDist(1 to 2))]`}
 />
 
 ### Records

packages/website/docusaurus.config.js

@@ -10,7 +10,7 @@ const path = require("path");
 /** @type {import('@docusaurus/types').Config} */
 const config = {
   title: "Squiggle",
-  tagline: "An estimation language for forecasters",
+  tagline: "A simple programming language for intuitive probabilistic estimation",
   url: "https://squiggle-language.com",
   baseUrl: "/",
   onBrokenLinks: "throw",
@@ -72,6 +72,11 @@ const config = {
           },
           { to: "/blog", label: "Blog", position: "left" },
           { to: "/playground", label: "Playground", position: "left" },
+          {
+            href: "https://github.com/quantified-uncertainty/squiggle/discussions",
+            label: "Issues & Discussion",
+            position: "right",
+          },
           {
             href: "https://github.com/quantified-uncertainty/squiggle",
             label: "GitHub",

packages/website/src/components/HomepageFeatures.module.css

@@ -5,6 +5,11 @@
   width: 100%;
 }
 
+.features h3 {
+  font-family: "Lora", serif;
+  font-size: 1.5em;
+}
+
 .featureSvg {
   height: 200px;
   width: 200px;

packages/website/src/css/custom.css

@@ -4,27 +4,29 @@
  * work well for content-centric websites.
  */
 
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&family=Lato:wght@100;400;700;900&family=Lora:wght@400;500;600&display=swap');
+
 /* You can override the default Infima variables here. */
 :root {
-  --ifm-color-primary: #2488df;
+  --ifm-color-primary: #e74c0f;
-  --ifm-color-primary-dark: #176fcd;
+  --ifm-color-primary-dark: #bb4b05;
-  --ifm-color-primary-darker: #1f58cb;
+  --ifm-color-primary-darker: #9d0c02;
-  --ifm-color-primary-darkest: #1e2672;
+  --ifm-color-primary-darkest: #5d2200;
-  --ifm-color-primary-light: #49acd3;
+  --ifm-color-primary-light: #e6a036;
-  --ifm-color-primary-lighter: #4fb1c7;
+  --ifm-color-primary-lighter: #e79d1d;
-  --ifm-color-primary-lightest: #3dbfd3;
+  --ifm-color-primary-lightest: #f5e191;
   --ifm-code-font-size: 95%;
 }
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
 html[data-theme="dark"] {
-  --ifm-color-primary: #25c2a0;
+  --ifm-color-primary: #df774d;
-  --ifm-color-primary-dark: #21af90;
+  --ifm-color-primary-dark: #db8651;
-  --ifm-color-primary-darker: #1fa588;
+  --ifm-color-primary-darker: #d7584f;
-  --ifm-color-primary-darkest: #1a8870;
+  --ifm-color-primary-darkest: #b3693e;
-  --ifm-color-primary-light: #29d5b0;
+  --ifm-color-primary-light: #edb25a;
-  --ifm-color-primary-lighter: #32d8b4;
+  --ifm-color-primary-lighter: #ebd489;
-  --ifm-color-primary-lightest: #4fddbf;
+  --ifm-color-primary-lightest: #faf2d4;
 }
 
 .docusaurus-highlight-code-line {
@@ -37,3 +39,54 @@ html[data-theme="dark"] {
 html[data-theme="dark"] .docusaurus-highlight-code-line {
   background-color: rgba(0, 0, 0, 0.3);
 }
+
+.hero h1{
+  font-size: 4em;
+  font-weight: 900;
+  margin-bottom: 0.5rem;
+  color: rgb(230, 72, 79);
+  font-family: "Lato", sans-serif;
+}
+
+.navbar__title {
+  font-family: "Lato", sans-serif;
+  font-weight: 900;
+  color: rgb(205, 88, 53);
+}
+
+.hero__subtitle {
+  color: #888;
+  font-size:1.25em;
+}
+
+.hero__subtitle2 {
+  color: #ba3e3e;
+  font-size: 1.5em;
+  font-family: "Lora";
+  font-weight: 500;
+  margin-top: 1em;
+  margin-left: auto;
+  margin-right: auto;
+  max-width: 500px;
+}
+
+h1 {
+  font-family: "Lora", serif;
+  font-size: 2.5em;
+}
+
+h2 {
+  font-weight: 600;
+}
+
+.menu__link, .navbar__item {
+  font-family: "Lora", serif;
+}
+
+.navbar__item {
+  font-weight: 700;
+}
+
+:root {
+  /* --ifm-font-family-base: 'Lora'; */
+}

packages/website/src/pages/index.js

@@ -13,10 +13,9 @@ function HomepageHeader() {
       <div className="container">
         <h1 className="hero__title">{siteConfig.title}</h1>
         <p className="hero__subtitle">
-          <i>Early access</i>
+          Early Access
         </p>
-        <p className="hero__subtitle">{siteConfig.tagline}</p>
+        <p className="hero__subtitle2">{siteConfig.tagline}</p>
-        <div className={styles.buttons}></div>
       </div>
     </header>
   );

packages/website/src/pages/index.module.css

@@ -4,10 +4,11 @@
  */
 
 .heroBanner {
-  padding: 4rem 0;
+  padding: 2rem 0;
   text-align: center;
   position: relative;
   overflow: hidden;
+  background: rgb(255, 246, 237)
 }
 
 @media screen and (max-width: 966px) {
@@ -20,4 +21,4 @@
   display: flex;
   align-items: center;
   justify-content: center;
-}
+}