Restructure page (deepset-ai#122)

* restructure menu * removenot needed code/resources * add missing image * remove pricing from docs * link to open nlp grou * correct buttons for mobile menu * remove meetup link from checker * format fix
ju-gu · Jul 21, 2021 · 7adfc9d · 7adfc9d
1 parent eebd1d3
commit 7adfc9d
Show file tree

Hide file tree

Showing 59 changed files with 90 additions and 2,011 deletions.
diff --git a/broken-link-checker.sh b/broken-link-checker.sh
@@ -32,6 +32,7 @@ do
  --exclude https://deepset.ai/germanquad \
  --exclude https://ext-models-haystack.s3.eu-central-1.amazonaws.com/ \
  --exclude https://github.com/deepset-ai/haystack/blob/master/rest_api/pipelines.yaml \
+ --exclude https://www.meetup.com/de-DE/open-nlp-meetup/ \
  --filter-level 1 --host-requests 1 
  status=$?
 

diff --git a/gatsby-config.js b/gatsby-config.js
@@ -119,13 +119,6 @@ module.exports = {
  path: `${__dirname}/src/images`,
  },
  },
- {
- resolve: `gatsby-source-filesystem`,
- options: {
- name: `video`,
- path: `${__dirname}/src/video`,
- },
- },
  {
  resolve: `gatsby-source-filesystem`,
  options: {

diff --git a/src/components/docLayout/index.jsx b/src/components/docLayout/index.jsx
@@ -6,9 +6,6 @@ import "./index.scss";
 import { GithubLogo } from "../../images/icon/GitHub-Mark-32px.png"; 
 import thumbnail from "../../images/haystack_logo_blue_banner_social.png"; 
 import SEO from "../../components/seo";
-import { Link } from 'gatsby-plugin-modal-routing'
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faSearch } from '@fortawesome/free-solid-svg-icons';
 import { useMobileScreen } from "../../hooks";
 
 export default (props) => {
@@ -58,10 +55,8 @@ export default (props) => {
  const docContainer = useRef(null);
  const [showToTopButton, setShowToTopButton] = useState(false);
  const screenWidth = useMobileScreen();
- const [searchStatus, setSearchStatus] = useState(true);
 
  useEffect(() => {
- setSearchStatus(screenWidth > 1000);
  // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [screenWidth]);
 

diff --git a/src/components/header/header.js b/src/components/header/header.js
@@ -15,7 +15,6 @@ const Header = ({ siteTitle, menuLinks }) => {
 
  const screenWidth = useMobileScreen();
  const [mobileNav, setMobileNav] = useState(false);
- const [docList, setDocList] = useState(false);
 
  useEffect(() => {
  window.addEventListener("click", () => {
@@ -34,78 +33,29 @@ const Header = ({ siteTitle, menuLinks }) => {
 
  <header className="header-wrapper">
  <div className="logo-wrapper">
- <LocalizedLink locale="en" to={"/"}>
+ <LocalizedLink locale="en" to={"/docs/intromd"}>
  <img src={Logo} alt="Haystack Logo">
  </img> 
  </LocalizedLink>
  </div>
  {screenWidth > 1000 ? (
  <div className="right">
+
  <LocalizedLink
- locale="en"
- to="/"
+ to="/docs/intromd"
  className="link"
- >
- Overview
- </LocalizedLink>
-
- <LocalizedLink
  locale="en"
- to="/#main-use-cases"
- scrollTo="link"
  >
- Use Cases
+ Haystack Docs
  </LocalizedLink>
 
  <LocalizedLink
- to="/pricing/pricing"
+ to="/docs_hub/intro_hubmd"
  className="link"
  locale="en"
  >
- Pricing
+ Haystack Hub Docs
  </LocalizedLink>
-
- <span
- role="button"
- tabIndex={0}
- className="docs"
- onMouseOver={() => {
- setDocList(true);
- }}
- onMouseLeave={() => {
- setDocList(false);
- }}
- >
- Docs
- {docList && (
- <div className="docs-list">
- <LocalizedLink
- locale="en"
- to="/docs/intromd"
- className="core"
- >
- <span
- tabIndex={0}
- role="button"
- >
- Haystack
- </span>
- </LocalizedLink>
- <LocalizedLink
- locale="en"
- to="/docs_hub/intro_hubmd"
- className="hub"
- >
- <span
- tabIndex={0}
- role="button"
- >
- Haystack Hub
- </span>
- </LocalizedLink>
- </div>
- )}
- </span>
 
  <LocalizedLink
  locale="en"
@@ -119,48 +69,27 @@ const Header = ({ siteTitle, menuLinks }) => {
 
  <Button
  to="/community/join"
- label="Join Our Community"
+ label="Join Slack"
  className="beta-button"
  >
- </Button>
-
- <Button
- to="/signup/beta"
- label="Try Haystack Hub"
- className="beta-button"
- >
- </Button>
+ </Button>.
+
+ <a
+ className="beta-button-link"
+ href={`https://www.meetup.com/de-DE/open-nlp-meetup/`}
+ target="_blank"
+ rel="noreferrer noopener"
+ >
+ Join Open NLP
+ </a>
+
  </div>
  ) : ( 
  <FontAwesomeIcon className="fontawsome-icon" icon={faBars} onKeyDown={handleClick}
  onClick={handleClick}/>
  )}
  </header>
  <div className={`mobile-nav ${mobileNav && "open"}`}>
- <LocalizedLink
- locale="en"
- to="/"
- className="link"
- >
- Overview
- </LocalizedLink>
-
- <LocalizedLink
- locale="en"
- to="/#main-use-cases"
- scrollTo="link"
- >
- Use Cases
- </LocalizedLink>
-
- <LocalizedLink
- to="/pricing/pricing"
- className="link"
- locale="en"
- >
- Pricing
- </LocalizedLink>
-
  <LocalizedLink
  to="/docs/intromd"
  className="link"
@@ -187,15 +116,18 @@ const Header = ({ siteTitle, menuLinks }) => {
 
  <Button
  to="/community/join"
- label="Join Our Community"
+ label="Join Slack"
  >
  </Button>
 
- <Button
- to="/signup/beta"
- label="Try Haystack Hub"
- >
- </Button>
+ <a
+ className="beta-button-link"
+ href={`https://www.meetup.com/de-DE/open-nlp-meetup/`}
+ target="_blank"
+ rel="noreferrer noopener"
+ >
+ Join Open NLP
+ </a>
  </div>
  </div>
  </>

diff --git a/src/components/header/header.scss b/src/components/header/header.scss
@@ -118,6 +118,11 @@
  font-weight: bold;
  margin: 0 1rem;
  }
+
+ .a {
+ color: #60677e;;
+ font-weight: bold;
+ }
 
  .beta-button {
  margin-left: 20px;
@@ -133,7 +138,27 @@
  }
  .beta-button {
  margin-left: 20px;
- width: 200px;
+ width: 170px;
+ }
+ .beta-button-link {
+ margin-left: 20px;
+ font-size: 16px;
+ font-weight: bold;
+ color: #ffffff;
+ border-radius: 4px;
+ background-color: #009BAA;
+ border: 0;
+ height: 40px;
+ width: 150px;
+ cursor: pointer;
+ text-align: center;
+ text-decoration: none; 
+ padding-top: 10px;
+ text-transform: none; 
+ }
+ .beta-button-link {
+ margin-left: 20px;
+ width: 170px;
  }
  }
 
@@ -189,6 +214,10 @@
  &:hover {
  background-color: var(--color-highlight);
  color: #000;
+ .button {
+ background-color: var(--color-highlight);
+ color: #000;
+ }
  }
 
  &:last-child {
@@ -203,18 +232,26 @@
  }
  .beta-button {
  margin-left: 20px;
- font-size: 16px;
+ font-size: 14px;
  font-weight: bold;
  color: #0e0101;
  border-radius: 4px;
  background-color: lightgray;
  border: 0;
  height: 40px;
- width: 150px;
+ width: 170px;
  cursor: pointer;
  }
  .button {
+ font-size: 14px;
  padding: 5px;
+ background-color: white;
+ color: var(--color-primary);
+ font-weight: normal;
+ &:hover {
+ background-color: var(--color-highlight);
+ color: #000;
+ }
  }
 }
 

diff --git a/src/components/landing-page/callToAction.js b/src/components/landing-page/callToAction.js
diff --git a/src/components/landing-page/productFeatures.js b/src/components/landing-page/productFeatures.js