header and footer changes except hamburger menu
This commit is contained in:
keiki
parent
9455d871a1
commit
128519e281
5
.gitignore
vendored
5
.gitignore
vendored
@ -5,10 +5,5 @@ dune-project
|
||||
cache/*
|
||||
Version.ml
|
||||
/_opam/
|
||||
<<<<<<< HEAD
|
||||
/*.pp.ligo
|
||||
<<<<<<< HEAD
|
||||
**/.DS_Store
|
||||
=======
|
||||
**/.DS_Store
|
||||
>>>>>>> [LIGO-93] redesign profile pics
|
||||
|
||||
@ -24,57 +24,53 @@ class Footer extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<footer className="nav-footer" id="footer">
|
||||
<section className="sitemap">
|
||||
<a className="nav-home"></a>
|
||||
<div>
|
||||
<h5>Docs</h5>
|
||||
<a href={this.docUrl('setup-installation.html', this.props.language)}>
|
||||
Installation
|
||||
</a>
|
||||
<a href={this.docUrl('api-cli-commands.html', this.props.language)}>
|
||||
CLI Commands
|
||||
</a>
|
||||
<a href={this.docUrl('contributors/origin.html', this.props.language)}>
|
||||
Contribute
|
||||
</a>
|
||||
<a href="/odoc">
|
||||
Api Documentation
|
||||
</a>
|
||||
<section className="footer-wrapper">
|
||||
<div className="sitemap">
|
||||
<a className="nav-home"></a>
|
||||
<div>
|
||||
<h5>Docs</h5>
|
||||
<a href={this.docUrl('setup-installation.html', this.props.language)}>
|
||||
Installation
|
||||
</a>
|
||||
<a href={this.docUrl('api-cli-commands.html', this.props.language)}>
|
||||
CLI Commands
|
||||
</a>
|
||||
<a href={this.docUrl('contributors/origin.html', this.props.language)}>
|
||||
Contribute
|
||||
</a>
|
||||
<a href="/odoc">
|
||||
Api Documentation
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<h5>Community</h5>
|
||||
<a
|
||||
href="https://tezos.stackexchange.com/questions/tagged/ligo"
|
||||
target="_blank"
|
||||
rel="noreferrer noopener">
|
||||
Tezos Stack Exchange
|
||||
</a>
|
||||
<a
|
||||
href="https://discord.gg/9rhYaEt"
|
||||
target="_blank"
|
||||
rel="noreferrer noopener">
|
||||
Discord
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<h5>More</h5>
|
||||
<a href={`${this.props.config.baseUrl}blog`}>Blog</a>
|
||||
<a href={this.docUrl('tutorials/get-started/tezos-taco-shop-smart-contract.html', this.props.language)}>Tutorials</a>
|
||||
<a href={`${this.props.config.repoUrl}`}>Gitlab</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h5>Community</h5>
|
||||
<a
|
||||
href="https://tezos.stackexchange.com/questions/tagged/ligo"
|
||||
target="_blank"
|
||||
rel="noreferrer noopener">
|
||||
Tezos Stack Exchange
|
||||
</a>
|
||||
<a
|
||||
href="https://discord.gg/9rhYaEt"
|
||||
target="_blank"
|
||||
rel="noreferrer noopener">
|
||||
Discord
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<h5>More</h5>
|
||||
<a href={`${this.props.config.baseUrl}blog`}>Blog</a>
|
||||
<a href={this.docUrl('tutorials/get-started/tezos-taco-shop-smart-contract.html', this.props.language)}>Tutorials</a>
|
||||
<a href={`${this.props.config.repoUrl}`}>Gitlab</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section className="copyright">
|
||||
Website built with <a
|
||||
href="https://docusaurus.io/"
|
||||
target="_blank"
|
||||
rel="noreferrer noopener">
|
||||
Docusaurus
|
||||
</a> by Facebook.
|
||||
<div>Icons made by <a href="https://www.freepik.com/" title="Freepik">Freepik</a> & <a href="https://www.flaticon.com/authors/lucy-g" title="Lucy G">Lucy G</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div>
|
||||
{this.props.config.copyright}
|
||||
<div className="copyright">
|
||||
{this.props.config.copyright}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
</footer>
|
||||
);
|
||||
}
|
||||
|
||||
@ -106,109 +106,25 @@ class HomeSplash extends React.Component {
|
||||
const langPart = `${language ? `${language}/` : ""}`;
|
||||
const docUrl = doc => `${baseUrl}${docsPart}${langPart}${doc}`;
|
||||
|
||||
const SplashContainer = props => (
|
||||
<div className="homeContainer">
|
||||
<div className="homeSplashFade">
|
||||
<div className="wrapper homeWrapper">
|
||||
<div className="tabs">
|
||||
<div className="nav-tabs">
|
||||
<div
|
||||
id="tab-group-3-tab-4"
|
||||
className="nav-link active"
|
||||
data-group="group_3"
|
||||
data-tab="tab-group-3-content-4"
|
||||
>
|
||||
PascaLIGO
|
||||
</div>
|
||||
<div
|
||||
className="nav-link"
|
||||
data-group="group_3"
|
||||
data-tab="tab-group-3-content-5"
|
||||
>
|
||||
CameLIGO
|
||||
</div>
|
||||
<div className="nav-link">ReasonLIGO (coming soon) </div>
|
||||
{/* <div id="tab-group-3-tab-5" className="nav-link" data-group="group_3"
|
||||
data-tab="tab-group-3-content-5">Camligo</div> */}
|
||||
const SampleCode = props => (
|
||||
<div className="sample-code-container">
|
||||
<div className="sample-code">
|
||||
<div className="tabs">
|
||||
<div className="nav-tabs">
|
||||
<div
|
||||
id="tab-group-3-tab-4"
|
||||
className="nav-link active"
|
||||
data-group="group_3"
|
||||
data-tab="tab-group-3-content-4"
|
||||
>
|
||||
PascaLIGO
|
||||
</div>
|
||||
<div className="tab-content">
|
||||
<div
|
||||
id="tab-group-3-content-4"
|
||||
className="tab-pane active"
|
||||
data-group="group_3"
|
||||
tabIndex="-1"
|
||||
>
|
||||
<div>
|
||||
<span>
|
||||
<pre>
|
||||
<code className="hljs css language-Pascal">
|
||||
// variant defining pseudo multi-entrypoint actions
|
||||
<br />
|
||||
type action is
|
||||
<br />| Increment of int
|
||||
<br />| Decrement of int
|
||||
<br />
|
||||
<br />
|
||||
function add (const a : int ; const b : int) : int is
|
||||
<br /> block {"{ skip }"} with a + b<br />
|
||||
<br />
|
||||
function subtract (const a : int ; const b : int) :
|
||||
int is
|
||||
<br /> block {"{ skip }"} with a - b<br />
|
||||
<br />
|
||||
// real entrypoint that re-routes the flow based on
|
||||
the action provided
|
||||
<br />
|
||||
function main (const p : action ; const s : int) :
|
||||
(list(operation) * int) is
|
||||
<br /> block {"{ skip }"} with ((nil :
|
||||
list(operation)),
|
||||
<br /> case p of
|
||||
<br /> | Increment(n) -> add(s, n)
|
||||
<br /> | Decrement(n) -> subtract(s, n)
|
||||
<br /> end)
|
||||
<br />
|
||||
</code>
|
||||
</pre>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="tab-group-3-content-5"
|
||||
className="tab-pane"
|
||||
data-group="group_3"
|
||||
tabIndex="-1"
|
||||
>
|
||||
<div>
|
||||
<pre>
|
||||
<code className="hljs css language-Pascal">
|
||||
type storage = int <br />
|
||||
<br />
|
||||
(* variant defining pseudo multi-entrypoint actions *){" "}
|
||||
<br />
|
||||
<br />
|
||||
type action =<br />| Increment of int
|
||||
<br />| Decrement of int
|
||||
<br />
|
||||
<br />
|
||||
let add (a: int) (b: int) : int = a + b<br />
|
||||
<br />
|
||||
let subtract (a: int) (b: int) : int = a - b<br />
|
||||
<br />
|
||||
(* real entrypoint that re-routes the flow based on the
|
||||
action provided *)
|
||||
<br />
|
||||
<br />
|
||||
let%entry main (p : action) storage =<br /> let storage
|
||||
=<br /> match p with
|
||||
<br /> | Increment n -> add storage n<br /> | Decrement
|
||||
n -> subtract storage n<br /> in (([] : operation list),
|
||||
storage)
|
||||
<br />
|
||||
</code>
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="nav-link"
|
||||
data-group="group_3"
|
||||
data-tab="tab-group-3-content-5"
|
||||
>
|
||||
CameLIGO
|
||||
</div>
|
||||
<div className="disabled">ReasonLIGO (coming soon) </div>
|
||||
</div>
|
||||
@ -216,32 +132,22 @@ class HomeSplash extends React.Component {
|
||||
{PascalLIGOTab()}
|
||||
{CamelLIGOTab()}
|
||||
</div>
|
||||
|
||||
{props.children}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<SplashContainer>
|
||||
<div className="inner">
|
||||
<ProjectTitle siteConfig={siteConfig} />
|
||||
<PromoSection>
|
||||
<Button href={docUrl("setup/installation.html")}>
|
||||
Get Started
|
||||
</Button>
|
||||
<Button
|
||||
href={docUrl(
|
||||
"tutorials/get-started/tezos-taco-shop-smart-contract"
|
||||
)}
|
||||
>
|
||||
Tutorials
|
||||
</Button>
|
||||
<Button href={docUrl("contributors/origin.html")}>
|
||||
Contribute
|
||||
</Button>
|
||||
</PromoSection>
|
||||
<div className="home-container">
|
||||
<div className="home-text">
|
||||
<h4 className="tagline-text">{siteConfig.tagline}</h4>
|
||||
<p className="body">{siteConfig.taglineSub}</p>
|
||||
<LinkButton
|
||||
href={docUrl("setup/installation.html")}
|
||||
className="large-primary-button"
|
||||
>
|
||||
Get Started
|
||||
</LinkButton>
|
||||
</div>
|
||||
<SampleCode />
|
||||
</div>
|
||||
@ -340,23 +246,20 @@ class Index extends React.Component {
|
||||
{[
|
||||
{
|
||||
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"
|
||||
"Write types, then code, and benefit from the safety coming from type systems.",
|
||||
image: `${baseUrl}img/strong-type-system.svg`,
|
||||
title: "Strong Type System"
|
||||
},
|
||||
{
|
||||
content:
|
||||
"Write types, then code, and benefit from the safety coming from type systems.",
|
||||
image: `${baseUrl}img/lightning.svg`,
|
||||
imageAlign: "top",
|
||||
title: "Strong Type System"
|
||||
"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)}
|
||||
@ -410,8 +313,6 @@ class Index extends React.Component {
|
||||
</a>
|
||||
));
|
||||
|
||||
const pageUrl = page => baseUrl + (language ? `${language}/` : "") + page;
|
||||
|
||||
return (
|
||||
<div className="partners-container hide-small">
|
||||
{PartnerShowcase}
|
||||
@ -443,17 +344,10 @@ class Index extends React.Component {
|
||||
</a>
|
||||
));
|
||||
|
||||
const pageUrl = page => baseUrl + (language ? `${language}/` : "") + page;
|
||||
|
||||
return (
|
||||
<div className="productShowcaseSection paddingBottom team">
|
||||
<h1 className="sectionTitle">Team</h1>
|
||||
<div className="team-container">{showcase}</div>
|
||||
{/* <div className="more-users">
|
||||
<a className="button" href={pageUrl('users.html')}>
|
||||
More {siteConfig.title} Users
|
||||
</a>
|
||||
</div> */}
|
||||
<div className="team">
|
||||
<h2>Team</h2>
|
||||
<div className="flex-inline-container">{showcase}</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -115,7 +115,6 @@ const siteConfig = {
|
||||
team,
|
||||
|
||||
/* path to images for header/footer */
|
||||
headerIcon: "img/logo.svg",
|
||||
footerIcon: "img/logo.svg",
|
||||
favicon: "img/logo.svg",
|
||||
|
||||
@ -140,7 +139,7 @@ const siteConfig = {
|
||||
*/
|
||||
|
||||
// This copyright info is used in /core/Footer.js and blog RSS/Atom feeds.
|
||||
copyright: `Copyright © ${new Date().getFullYear()} Marigold`,
|
||||
copyright: `© ${new Date().getFullYear()} LIGO. All rights reserved.`,
|
||||
|
||||
highlight: {
|
||||
// Highlight.js theme to use for syntax highlighting in code blocks.
|
||||
|
||||
@ -105,6 +105,36 @@ footnote {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.projectTitle small {
|
||||
max-width: 700px;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
margin-top: 0.7em;
|
||||
}
|
||||
|
||||
.fixedHeaderContainer {
|
||||
background-color: #ffffff;
|
||||
color: var(--color-primary-text);
|
||||
}
|
||||
|
||||
.fixedHeaderContainer a {
|
||||
color: var(--color-primary-text);
|
||||
}
|
||||
|
||||
.fixedHeaderContainer .headerWrapper header a:nth-child(2) {
|
||||
background-color: #EFEFEF;
|
||||
margin-left: 50px;
|
||||
padding: 4px 7px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.fixedHeaderContainer .headerWrapper header h3 {
|
||||
margin: 0;
|
||||
color: var(--color-primary-text);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
|
||||
.fixedHeaderContainer header .headerTitleWithLogo {
|
||||
display: none;
|
||||
}
|
||||
@ -113,8 +143,40 @@ footnote {
|
||||
background: var(--color-primary-text);
|
||||
}
|
||||
|
||||
.nav-footer .copyright {
|
||||
text-align: left;
|
||||
margin-left: 92px;
|
||||
margin-top: 3em;
|
||||
|
||||
border-top: 1px solid white;
|
||||
padding-top: 3em;
|
||||
margin-right: 92px;
|
||||
}
|
||||
|
||||
.nav-footer .footer-wrapper {
|
||||
margin: 0 auto 3em;
|
||||
max-width: 1080px;
|
||||
}
|
||||
|
||||
.nav-footer .sitemap {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.navigationSlider .slidingNav {
|
||||
background: #1a1a1a;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.navigationSlider .slidingNav ul {
|
||||
background: white;
|
||||
color: var(--color-primary-text) !important;
|
||||
}
|
||||
|
||||
.navigationSlider .slidingNav ul li > a:focus,
|
||||
.navigationSlider .slidingNav ul li > a:hover,
|
||||
.navigationSlider .slidingNav ul li.siteNavItemActive > a,
|
||||
.navigationSlider .slidingNav ul li.siteNavGroupActive > a {
|
||||
background-color: white;
|
||||
color: var(--color-primary-brand) !important;
|
||||
}
|
||||
|
||||
/** Top Section **/
|
||||
@ -459,6 +521,10 @@ body
|
||||
padding: 0 var(--padding-level-1);
|
||||
}
|
||||
|
||||
.profileContainer a {
|
||||
color: var(--color-primary-text);
|
||||
}
|
||||
|
||||
.profileContainer:hover {
|
||||
color: var(--color-primary-brand);
|
||||
}
|
||||
@ -524,10 +590,6 @@ body
|
||||
background-color: var(--color-light-gray);
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
background-color: var(--color-light-blue);
|
||||
}
|
||||
|
||||
.card-text {
|
||||
text-align: center;
|
||||
}
|
||||
@ -554,6 +616,16 @@ body
|
||||
border-left: 5px solid var(--color-primary-brand);
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1024px) {
|
||||
.navigationSlider .slidingNav ul li a {
|
||||
color: #0D0F33;
|
||||
}
|
||||
|
||||
.navigationSlider .slidingNav ul li a:hover {
|
||||
color: #3AA0FF;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 560px) and (max-width: 768px) {
|
||||
/** Special rules to reorient feature cards at only one screen size**/
|
||||
.card {
|
||||
@ -572,6 +644,10 @@ body
|
||||
.profileContainer {
|
||||
max-width: 30%;
|
||||
}
|
||||
|
||||
.headerWrapper header a:nth-child(2) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 560px) {
|
||||
@ -588,7 +664,21 @@ body
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 735px) {
|
||||
.nav-footer .sitemap {
|
||||
max-width: 90%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.nav-footer .copyright {
|
||||
max-width: 90%;
|
||||
text-align: left;
|
||||
margin: 3em auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-device-width: 360px) and (max-device-width: 736px) {
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1023px) {
|
||||
@ -607,7 +697,10 @@ body
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1280px) {
|
||||
@media only screen and (max-width: 1023px) {
|
||||
.reactNavSearchWrapper input#search_input_react {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1440px) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user