Fixing mobile site image responsiveness (#5469)

apache · May 31, 2020 · de97edc · de97edc
1 parent 44a1e2e
commit de97edc
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 20 deletions.
diff --git a/website/package.json b/website/package.json
@@ -10,29 +10,29 @@
     "deploy": "docusaurus deploy"
   },
   "dependencies": {
-    "@docusaurus/core": "^2.0.0-alpha.48",
-    "@docusaurus/plugin-ideal-image": "^2.0.0-alpha.48",
-    "@docusaurus/preset-classic": "^2.0.0-alpha.48",
-    "@docusaurus/utils": "^2.0.0-alpha.48",
-    "axios": "^0.18.1",
-    "cash-dom": "^4.1.5",
+    "@docusaurus/core": "2.0.0-alpha.55",
+    "@docusaurus/plugin-ideal-image": "2.0.0-alpha.55",
+    "@docusaurus/preset-classic": "2.0.0-alpha.55",
+    "@docusaurus/utils": "2.0.0-alpha.55",
+    "axios": "^0.19.2",
+    "cash-dom": "^7.0.1",
     "classnames": "^2.2.6",
     "color": "^3.1.2",
-    "d3-timer": "^1.0.9",
+    "d3-timer": "^1.0.10",
     "dateformat": "^3.0.3",
     "humanize-string": "^2.1.0",
-    "now": "^17.1.1",
+    "now": "^19.0.1",
     "pluralize": "^8.0.0",
-    "prismjs": "^1.17.1",
-    "qs": "^6.9.1",
-    "react": "^16.8.4",
-    "react-dom": "^16.8.4",
-    "react-github-btn": "^1.1.1",
-    "react-inlinesvg": "^1.1.7",
-    "react-select": "^3.0.8",
+    "prismjs": "^1.20.0",
+    "qs": "^6.9.4",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1",
+    "react-github-btn": "^1.2.0",
+    "react-inlinesvg": "^1.2.0",
+    "react-select": "^3.1.0",
     "reading-time": "^1.2.0",
     "strftime": "^0.10.0",
-    "svg.js": "^2.6.2",
+    "svg.js": "^2.7.1",
     "yarn": "^1.22.4"
   },
   "resolutions": {

diff --git a/website/src/pages/index.css b/website/src/pages/index.css
@@ -100,10 +100,13 @@
 .svg {
   display: block;
   margin: var(--ifm-heading-margin-bottom) auto;
-  max-height: 720px;
-  max-width: 1600px;
+  max-height: 100%;
+  max-width: 100%;
   display: flex; 
   justify-content: center;
+  width: auto ;
+  height: auto ;
+  display: block; 
  }
 
  /* fallback */

diff --git a/website/src/pages/index.js b/website/src/pages/index.js
@@ -18,6 +18,7 @@ import Tabs from '@theme/Tabs';
 
 import classnames from 'classnames';
 import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+// import PinotOverview from '@site/static/img/pinot-overview.svg';
 
 import styles from './index.module.css';
 import './index.css';
@@ -283,9 +284,9 @@ function Home() {
           <h1 className="hero__title">{siteConfig.title}</h1>
           <p className="hero__subtitle">{siteConfig.tagline}, designed to answer OLAP queries with low latency
           {/* <Diagram className={styles.indexHeroDiagram} width="100%" /> */}
-
-          {/* <img className="image-overview figure" src="img/pinot-overview-light.png" alt="Components overview" /> */}
+          {/* <PinotOverview title="PinotOverview" className="svg image-overview figure" /> */}
           <SVG src="/img/pinot-overview.svg" className="svg image-overview figure" />
+
           </p>
           <div className="hero--buttons">
             <Link to="https://docs.pinot.apache.org/getting-started" className="button button--primary button--highlight">Getting Started</Link>