diff --git a/gitlab-pages/website/pages/en/index.js b/gitlab-pages/website/pages/en/index.js index c962109df..8c9cac7de 100644 --- a/gitlab-pages/website/pages/en/index.js +++ b/gitlab-pages/website/pages/en/index.js @@ -13,6 +13,91 @@ const MarkdownBlock = CompLibrary.MarkdownBlock; /* Used to read markdown */ const Container = CompLibrary.Container; const GridBlock = CompLibrary.GridBlock; +const PascalLIGOTab = () => ( +
+
+ + 
+          
+            // variant defining pseudo multi-entrypoint actions
+            

+            type action is
+            
| Increment of int
+            
| Decrement of int
+            

+            

+            function add (const a : int ; const b : int) : int is
+            
 block {"{ skip }"} with a + b

+            

+            function subtract (const a : int ; const b : int) : int is
+            
 block {"{ skip }"} with a - b

+            

+            // real entrypoint that re-routes the flow based on the action
+            provided
+            

+            function main (const p : action ; const s : int) : (list(operation)
+            * int) is
+            
 block {"{ skip }"} with ((nil : list(operation)),
+            
 case p of
+            
 | Increment(n) -> add(s, n)
+            
 | Decrement(n) -> subtract(s, n)
+            
 end)
+            

+          
+
+ +
+
+); + +const CamelLIGOTab = () => ( +
+
+ 
+        
+          type storage = int 

+          

+          (* variant defining pseudo multi-entrypoint actions *) 

+          

+          type action =
| Increment of int
+          
| Decrement of int
+          

+          

+          let add (a: int) (b: int) : int = a + b

+          

+          let subtract (a: int) (b: int) : int = a - b

+          

+          (* real entrypoint that re-routes the flow based on the action
+          provided *)
+          

+          

+          let%entry main (p : action) storage =
 let storage =
 match
+          p with
+          
 | Increment n -> add storage n
 | Decrement n -> subtract
+          storage n
 in (([] : operation list), storage)
+          

+        
+
+
+
+); + +const LinkButton = props => ( + + + +); + class HomeSplash extends React.Component { render() { const { siteConfig, language = "" } = this.props; @@ -21,167 +106,51 @@ class HomeSplash extends React.Component { const langPart = `${language ? `${language}/` : ""}`; const docUrl = doc => `${baseUrl}${docsPart}${langPart}${doc}`; - const SplashContainer = props => ( -
-
-
-
-
-
- PascaLIGO -
-
- CameLIGO -
-
ReasonLIGO (coming soon)
- {/*
Camligo
*/} + const SampleCode = props => ( +
+
+
+
+
+ PascaLIGO
-
-
-
- - 
-                        
-                          // variant defining pseudo multi-entrypoint actions
-                          

-                          type action is
-                          
| Increment of int
-                          
| Decrement of int
-                          

-                          

-                          function add (const a : int ; const b : int) : int is
-                          
 block {"{ skip }"} with a + b

-                          

-                          function subtract (const a : int ; const b : int) :
-                          int is
-                          
 block {"{ skip }"} with a - b

-                          

-                          // real entrypoint that re-routes the flow based on
-                          the action provided
-                          

-                          function main (const p : action ; const s : int) :
-                          (list(operation) * int) is
-                          
 block {"{ skip }"} with ((nil :
-                          list(operation)),
-                          
 case p of
-                          
 | Increment(n) -> add(s, n)
-                          
 | Decrement(n) -> subtract(s, n)
-                          
 end)
-                          

-                        
-
- -
-
-
-
- 
-                      
-                        type storage = int 

-                        

-                        (* variant defining pseudo multi-entrypoint actions *){" "}
-                        

-                        

-                        type action =
| Increment of int
-                        
| Decrement of int
-                        

-                        

-                        let add (a: int) (b: int) : int = a + b

-                        

-                        let subtract (a: int) (b: int) : int = a - b

-                        

-                        (* real entrypoint that re-routes the flow based on the
-                        action provided *)
-                        

-                        

-                        let%entry main (p : action) storage =
 let storage
-                        =
 match p with
-                        
 | Increment n -> add storage n
 | Decrement
-                        n -> subtract storage n
 in (([] : operation list),
-                        storage)
-                        

-                      
-
-
-
+
+ CameLIGO
+
ReasonLIGO (coming soon)
+
+
+ {PascalLIGOTab()} + {CamelLIGOTab()}
- - {props.children}
); - const Logo = props => ( -
- Project Logo -
- ); - - const ProjectTitle = () => ( -

- {siteConfig.tagline} -

- ); - - const PromoSection = props => ( -
-
-
{props.children}
-
-
- ); - - const Button = props => ( - - ); - return ( - -
- - - - - - +
+
+

{siteConfig.tagline}

+

{siteConfig.taglineSub}

+ + Get Started +
- + +
); } } @@ -259,33 +228,42 @@ class Index extends React.Component { ); + const FeatureCard = props => ( +
+ +
+

{props.title}

+

{props.content}

+
+
+ ); + const Features = () => (
-

Features

- +

Features

+ +
{[ - { - content: - "Write in PascaLIGO (pascal-like syntax) or CameLIGO (caml-like syntax). If you know OCaml, you can also add your own syntax.", - image: `${baseUrl}img/edit.svg`, - imageAlign: "top", - title: "Syntax Agnostic" - }, { content: "Write types, then code, and benefit from the safety coming from type systems.", - image: `${baseUrl}img/lightning.svg`, - imageAlign: "top", + image: `${baseUrl}img/strong-type-system.svg`, title: "Strong Type System" }, + { + content: + "Write in PascaLIGO (pascal-like syntax) or CameLIGO (caml-like syntax). If you know OCaml, you can also add your own syntax.", + image: `${baseUrl}img/syntax-agnostic.svg`, + title: "Syntax Agnostic" + }, + { content: "With Granary, you can use LIGO as a lib from NodeJS.", - image: `${baseUrl}img/puzzle.svg`, - imageAlign: "top", + image: `${baseUrl}img/easy-integration.svg`, title: "Easy Integration" } - ]} - + ].map(FeatureCard)} +
); @@ -327,25 +305,23 @@ class Index extends React.Component { return null; } - const showcase = siteConfig.partners + const PartnerShowcase = siteConfig.partners .filter(user => user.pinned) .map(user => ( - + {user.caption} )); - const pageUrl = page => baseUrl + (language ? `${language}/` : "") + page; - return ( -
-

Partners

-
{showcase}
- {/* */} +
+ {PartnerShowcase} +
+

Our Partners

+

+ We are not alone in this world -- here're some guys who support us +

+
); }; @@ -368,17 +344,10 @@ class Index extends React.Component { )); - const pageUrl = page => baseUrl + (language ? `${language}/` : "") + page; - return ( -
-

Team

-
{showcase}
- {/* */} +
+

Team

+
{showcase}
); }; diff --git a/gitlab-pages/website/sidebars.json b/gitlab-pages/website/sidebars.json index 3f80e2e51..7936cdc34 100644 --- a/gitlab-pages/website/sidebars.json +++ b/gitlab-pages/website/sidebars.json @@ -1,21 +1,39 @@ { "docs": { "Setup": ["setup/installation", "setup/editor-support"], - "Language Basics": ["language-basics/cheat-sheet", "language-basics/types", "language-basics/variables", "language-basics/functions", "language-basics/entrypoints", "language-basics/operators"], + "Language Basics": [ + "language-basics/cheat-sheet", + "language-basics/types", + "language-basics/variables", + "language-basics/functions", + "language-basics/entrypoints", + "language-basics/operators" + ], "API": ["api-cli-commands"] }, "contributors-docs": { - "Introduction": ["contributors/origin", "contributors/philosophy", "contributors/getting-started", "contributors/documentation-and-releases"], + "Introduction": [ + "contributors/origin", + "contributors/philosophy", + "contributors/getting-started", + "contributors/documentation-and-releases" + ], "Big Picture": [ "contributors/big-picture/overview", - "contributors/big-picture/front-end", - "contributors/big-picture/middle-end", + "contributors/big-picture/front-end", + "contributors/big-picture/middle-end", "contributors/big-picture/back-end", "contributors/big-picture/vendors" ], - "Road Map": ["contributors/road-map/short-term", "contributors/road-map/long-term"] + "Road Map": [ + "contributors/road-map/short-term", + "contributors/road-map/long-term" + ] }, "tutorials": { - "Get Started": ["tutorials/get-started/tezos-taco-shop-smart-contract", "tutorials/get-started/tezos-taco-shop-payout"] + "Get Started": [ + "tutorials/get-started/tezos-taco-shop-smart-contract", + "tutorials/get-started/tezos-taco-shop-payout" + ] } } diff --git a/gitlab-pages/website/siteConfig.js b/gitlab-pages/website/siteConfig.js index 0d2780144..ab081f669 100644 --- a/gitlab-pages/website/siteConfig.js +++ b/gitlab-pages/website/siteConfig.js @@ -14,7 +14,7 @@ const partners = [ caption: "Nomadic Labs", // You will need to prepend the image path with your baseUrl // if it is not '/', like: '/test-site/img/image.jpg'. - image: "/img/nomadic-logo.jpg", + image: "/img/nomadic-logo.svg", infoLink: "https://www.nomadic-labs.com/", pinned: true }, @@ -22,7 +22,7 @@ const partners = [ caption: "Tocqueville Group", // You will need to prepend the image path with your baseUrl // if it is not '/', like: '/test-site/img/image.jpg'. - image: "/img/tq-logo.svg", + image: "/img/tq-logo-2.svg", infoLink: "https://tqgroup.io/", pinned: true }, @@ -30,7 +30,7 @@ const partners = [ caption: "Stove Labs", // You will need to prepend the image path with your baseUrl // if it is not '/', like: '/test-site/img/image.jpg'. - image: "/img/stove-logo.png", + image: "/img/stove-logo.svg", infoLink: "https://stove-labs.com", pinned: true } @@ -82,7 +82,8 @@ const team = [ const siteConfig = { title: "LIGO", // Title for your website. tagline: - "LIGO is a statically typed high-level smart-contract language that compiles down to Michelson. It seeks to be easy to use, extensible and safe.", + "LIGO is a statically typed high-level smart-contract language that compiles down to Michelson.", + taglineSub: "It seeks to be easy to use, extensible and safe.", url: "https://your-docusaurus-test-site.com", // Your website URL baseUrl: "/", // Base URL for your project */ // For github.io type URLs, you would set the url and baseUrl like: diff --git a/gitlab-pages/website/static/css/custom.css b/gitlab-pages/website/static/css/custom.css index 35509042f..2d9708a74 100644 --- a/gitlab-pages/website/static/css/custom.css +++ b/gitlab-pages/website/static/css/custom.css @@ -29,6 +29,8 @@ h4, .landing .headline { font-family: "DM Sans", sans-serif; font-weight: bold; + /** Override docusaurus rule that makes a huge top margin **/ + margin-top: 1rem; } body, @@ -39,12 +41,20 @@ body, font-family: "Open Sans", sans-serif; } -code, +/** TODO: code font size is currently 85%; designs have it as 1rem (16px); +this breaks some of the tiny-text in the internal pages, so wait until those +are fixed to set this to the correct size +**/ +.landing code, .mono { font-family: "Source Code Pro", monospace; font-size: 1rem; } +code { + font-family: "Source Code Pro", monospace; +} + h1 { font-size: 2.625rem; } @@ -90,17 +100,11 @@ body, .landing .subhead { font-size: 1rem; } -.footnote { +.footnote, +footnote { font-size: 0.75rem; } -.projectTitle small { - max-width: 700px; - text-align: center; - margin: 0 auto; - margin-top: 0.7em; -} - .fixedHeaderContainer header .headerTitleWithLogo { display: none; } @@ -116,12 +120,7 @@ body, background: #1a1a1a; } -.homeContainer { - box-shadow: inset 0 -10px 10px -6px rgba(177, 176, 176, 0.2); - background: #f6f4f4; -} - -.homeContainer .hljs { +.hljs { text-align: left; background: transparent; } @@ -147,9 +146,9 @@ body, border-bottom: 4px solid #1a1a1a; } -.homeContainer .tabs .nav-tabs > div:last-of-type { +.disabled { cursor: default; - color: #24292e64; + color: #24292e64 !important; border-bottom: none; } @@ -163,9 +162,32 @@ body, top: 4px; } -.promoSection .buttonWrapper:first-of-type > a.button { - background: #b2210c; - color: white; +/** Top Section **/ +.home-container { + display: flex; + align-items: center; + justify-content: space-between; + padding: var(--padding-level-3); +} + +.home-text { + max-width: 40%; +} + +.sample-code-container { + display: flex; + justify-content: center; + box-sizing: border-box; + max-width: 60%; + background: url("/img/geo.svg") top right/140px 140px no-repeat, + url("/img/geo.svg") bottom left/200px 200px no-repeat; +} + +.sample-code { + width: 80%; + padding: 25px; + box-shadow: 0px 0px 70px rgba(13, 15, 51, 0.06); + background-color: white; } blockquote { @@ -177,44 +199,21 @@ blockquote { blockquote code { opacity: 0.5; } -/* -blockquote a { - color: rgba(255,255,255, 0.8); - border-bottom: 1px solid rgba(255,255,255, 0.8); -} - -blockquote a:hover { - color: rgba(255,255,255, 1); - border-bottom: 1px solid rgba(255,255,255, 1); -} */ -/* -blockquote { - background-color: rgba(252, 214, 0, 0.687); - border-left-color: rgba(240, 210, 37, 1); - color: rgba(0, 0, 0, 0.632); -} */ a { - color: rgba(178, 33, 12, 0.8); + color: var(--color-primary-text); } a:hover { - color: rgba(178, 33, 12, 1); + color: var(--color-primary-brand); } -.homeContainer .homeWrapper .projectLogo { - display: block; - position: relative; - padding: 0; +.landing a { + color: var(--color-white); } -.projectTitle { - margin-top: 30px; - margin-bottom: 0; -} - -.projectTitle small { - margin: 0 auto; +.landing a:hover { + font-weight: bold; } .promoSection .promoRow { @@ -238,7 +237,8 @@ a:hover { margin-top: -25px; } -.features { +.features, +.team { background: white; margin-top: -40px; position: relative; @@ -267,18 +267,6 @@ html { color: #b2210c; } -.productShowcaseSection.team .logos img { - border-radius: 50%; - height: 150px; - margin-bottom: 0px; - padding-left: 40px; - padding-right: 40px; -} - -.productShowcaseSection.team .logos p { - padding-top: 0px; -} - .toc .toggleNav { margin-top: 12px; } @@ -287,6 +275,10 @@ html { padding-top: 60px; } +.mainContainer > * { + padding: var(--padding-level-4) 0; +} + .tocActive .onPageNav > .toc-headings { padding-top: 24px; } @@ -355,6 +347,7 @@ body font-weight: normal; line-height: 1.375rem; text-transform: none; + text-align: center; } .button, @@ -383,7 +376,8 @@ body .large-secondary-button, .large-secondary-button:hover { border-radius: 37px; - padding: 20px; + padding: 5px 20px; + min-height: 56px; min-width: 132px; color: var(--color-white); } @@ -462,7 +456,7 @@ body flex-direction: column; align-items: center; justify-content: center; - max-width: fit-content; + max-width: 20%; color: var(--color-primary-text); padding: 0 var(--padding-level-1); } @@ -471,33 +465,131 @@ body color: var(--color-primary-brand); } -.profileImage { - max-height: 195px; - max-width: 195px; - border: var(--color-gray); -} -.profileImage:hover { +.profileContainer:hover .profileImage { box-shadow: 12px 12px 0px var(--color-primary-brand); } -.team-container { +.profileImage { + max-height: 195px; + max-width: 195px; + width: 100%; + border: var(--color-gray); +} + +.flex-inline-container { display: flex; flex-direction: row; justify-content: space-around; padding: var(--padding-level-1); flex-wrap: wrap; + align-items: stretch; +} + +.team .flex-inline-container { + align-items: flex-start; +} + +/** Feature Cards **/ +.card { + display: flex; + flex-direction: column; + padding: 2rem; + align-items: center; + justify-content: flex-start; + max-width: 30%; + background-color: var(--color-light-gray); +} + +.card:hover { + background-color: var(--color-light-blue); +} + +.card-text { + text-align: center; +} + +/** Partners **/ +.partners-container { + background-color: var(--color-light-gray); + display: flex; + justify-content: space-around; + align-content: center; + padding: var(--padding-level-3); + margin: var(--padding-level-4) 0; +} + +.partners-container a { + display: flex; + align-content: center; + justify-content: center; + margin: 0 10px; +} + +.partners-text { + padding: 0 var(--padding-level-1); + border-left: 5px solid var(--color-primary-brand); +} + +@media (min-width: 560px) and (max-width: 768px) { + /** Special rules to reorient feature cards at only one screen size**/ + .card { + flex-direction: row; + width: 100%; + max-width: 100%; + justify-content: left; + margin: var(--padding-level-1) 0; + } + .card-text { + text-align: left; + } +} + +@media (max-width: 768px) { + .profileContainer { + max-width: 30%; + } +} + +@media (max-width: 560px) { + .card { + max-width: 100%; + margin: var(--padding-level-1) 0; + } + .profileContainer { + max-width: 100%; + width: 100%; + } + .hide-small { + display: none; + } } @media only screen and (min-device-width: 360px) and (max-device-width: 736px) { } -@media only screen and (min-width: 1200px) { -} - @media only screen and (max-width: 1023px) { + .home-container { + flex-direction: column-reverse; + margin-top: var(--padding-level-1); + } + .home-text { + align-content: center; + text-align: center; + max-width: 90%; + padding-top: var(--padding-level-2); + } + .sample-code-container { + max-width: 100%; + } } -@media only screen and (min-width: 1400px) { +@media only screen and (min-width: 1280px) { +} + +@media only screen and (min-width: 1440px) { + .landing h4.tagline-text { + font-size: 2.25rem; + } } @media only screen and (min-width: 1500px) { diff --git a/gitlab-pages/website/static/img/easy-integration.svg b/gitlab-pages/website/static/img/easy-integration.svg new file mode 100644 index 000000000..de1284626 --- /dev/null +++ b/gitlab-pages/website/static/img/easy-integration.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/gitlab-pages/website/static/img/geo.svg b/gitlab-pages/website/static/img/geo.svg new file mode 100644 index 000000000..4def0999c --- /dev/null +++ b/gitlab-pages/website/static/img/geo.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/gitlab-pages/website/static/img/nomadic-logo.svg b/gitlab-pages/website/static/img/nomadic-logo.svg new file mode 100644 index 000000000..1f0b1233a --- /dev/null +++ b/gitlab-pages/website/static/img/nomadic-logo.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/gitlab-pages/website/static/img/stove-logo.svg b/gitlab-pages/website/static/img/stove-logo.svg new file mode 100644 index 000000000..d270287f7 --- /dev/null +++ b/gitlab-pages/website/static/img/stove-logo.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/gitlab-pages/website/static/img/strong-type-system.svg b/gitlab-pages/website/static/img/strong-type-system.svg new file mode 100644 index 000000000..997b516a9 --- /dev/null +++ b/gitlab-pages/website/static/img/strong-type-system.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/gitlab-pages/website/static/img/syntax-agnostic.svg b/gitlab-pages/website/static/img/syntax-agnostic.svg new file mode 100644 index 000000000..5cc55d5ae --- /dev/null +++ b/gitlab-pages/website/static/img/syntax-agnostic.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/gitlab-pages/website/static/img/tq-logo-2.svg b/gitlab-pages/website/static/img/tq-logo-2.svg new file mode 100644 index 000000000..c33b7bb38 --- /dev/null +++ b/gitlab-pages/website/static/img/tq-logo-2.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/gitlab-pages/website/static/img/user.png b/gitlab-pages/website/static/img/user.png deleted file mode 100644 index 1079d42d7..000000000 Binary files a/gitlab-pages/website/static/img/user.png and /dev/null differ