Improve responsiveness
diff --git a/website-v2/docusaurus.config.js b/website-v2/docusaurus.config.js
index 10a90c7..d7e89ea 100644
--- a/website-v2/docusaurus.config.js
+++ b/website-v2/docusaurus.config.js
@@ -25,10 +25,10 @@
"/css/bootstrap.min.css",
"/css/buttons.css",
- "/css/responsive.css",
"/css/team.css",
"/css/custom-website.css",
- "/css/page-banner.css"
+ "/css/page-banner.css",
+ "/css/responsive.css",
],
"favicon": "img/favicon.png",
"customFields": {
diff --git a/website-v2/src/components/Teaser.tsx b/website-v2/src/components/Teaser.tsx
index 6f11029..92201f1 100644
--- a/website-v2/src/components/Teaser.tsx
+++ b/website-v2/src/components/Teaser.tsx
@@ -6,7 +6,7 @@
<>
<section className="elements-area" style={{borderBottom: '1px solid #cecece'}}>
<div className={"row"}>
- <div className={"col-9 container-lg d-flex align-items-center justify-content-center"}>
+ <div className={"col-lg-9 col-12 container-lg d-flex align-items-center justify-content-center"}>
<div className={"left-claim-section"}>
<div className={"top-claim-area"}>
<div className={"top-claim-area-subtitle"}>
@@ -66,7 +66,7 @@
</div>
</div>
</div>
- <div className={"col-3 teaser-image"}>
+ <div className={"col-lg-3 d-none d-lg-block teaser-image"}>
</div>
</div>
</section>
diff --git a/website-v2/src/pages/download.tsx b/website-v2/src/pages/download.tsx
index 323ab9b..797f299 100644
--- a/website-v2/src/pages/download.tsx
+++ b/website-v2/src/pages/download.tsx
@@ -1,14 +1,8 @@
import type { FC } from 'react';
import React from 'react';
import Layout from '@theme/Layout';
-import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
-import { translate } from '@docusaurus/Translate';
import PageHeader from '../components/PageHeader';
import PageSection from '../components/PageSection';
-import DownloadBox from '../components/download/DownloadBox';
-import DownloadFolder from '../components/download/DownloadFolder';
-import DownloadBrowser from '../components/download/DownloadBrowser';
-import DownloadMoreInfo from '../components/download/DownloadMoreInfo';
import DownloadSection from '../components/download/DownloadSection';
@@ -55,7 +49,7 @@
</span>
</div>
<div className="col-md-11 col-9">
- Check the <a href="https://streampipes.apache.org/docs/docs/user-guide-introduction.html"> user
+ Check the <a href="/docs/user-guide-introduction"> user
guide</a> and learn how to make your first steps with StreamPipes!
</div>
</div>
diff --git a/website-v2/static/css/custom-website.css b/website-v2/static/css/custom-website.css
index 9f12c74..befe831 100644
--- a/website-v2/static/css/custom-website.css
+++ b/website-v2/static/css/custom-website.css
@@ -479,7 +479,6 @@
}
.left-claim-section {
- padding-left: 3rem;
margin-top: -20px;
}
diff --git a/website-v2/static/css/responsive.css b/website-v2/static/css/responsive.css
index 8a375d3..a928170 100644
--- a/website-v2/static/css/responsive.css
+++ b/website-v2/static/css/responsive.css
@@ -16,6 +16,26 @@
*
*/
+
+@media (max-width: 1199px) {
+
+ .sp-button {
+ margin-bottom: 10px;
+ }
+
+ .architecture-image {
+ width: 100%;
+ }
+
+ .feature-highlights {
+ margin-bottom: 10px;
+ }
+
+ .top-claim-area-main-title {
+ font-size: 3.25rem;
+ }
+}
+
@media (min-width: 992px) and (max-width: 1199px) {
.menu-area #nav .nav-link {
padding: 0 10px;
@@ -55,7 +75,6 @@
-webkit-box-flex: 0;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
- max-width: 50%;
}
}
@@ -144,4 +163,4 @@
.header-banner {
height:80px;
}
-}
\ No newline at end of file
+}
