-
Notifications
You must be signed in to change notification settings - Fork 29
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
39c7de5
commit e8e1de6
Showing
2 changed files
with
200 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,94 @@ | ||
.dashboard-content-wraper { | ||
padding: 50px 25px; | ||
padding-bottom: 30px; | ||
|
||
} | ||
|
||
.dashboard-top-menu-wraper { | ||
background: #fff; | ||
padding: 15px 10px; | ||
box-shadow: 0px 3px 16px #00000012; | ||
height: 80px; | ||
/* position: relative; */ | ||
padding-left: 85px; | ||
} | ||
|
||
#content { | ||
min-height: 100vh; | ||
transition: all 0.3s; | ||
width: calc(100% - 320px); | ||
right: 0; | ||
position: absolute; | ||
} | ||
|
||
.content-full { | ||
width: calc(100% - 80px) !important; | ||
} | ||
|
||
.dashboard-title { | ||
border-bottom: 1px solid #f3f2f6; | ||
padding: 0px 40px; | ||
padding-bottom: 30px; | ||
} | ||
|
||
.dashboard-content-features-wraper { | ||
display: flex; | ||
justify-content: space-between; | ||
margin-top: 45px; | ||
padding: 0px 40px; | ||
} | ||
|
||
@media (max-width: 1199.98px) { | ||
.dashboard-content-features { | ||
width: 32%; | ||
padding: 25px 25px 25px; | ||
} | ||
} | ||
|
||
@media (max-width: 1700px) { | ||
.dashboard-content-features { | ||
width: 32%; | ||
padding: 35px 40px 26px; | ||
} | ||
} | ||
.dashboard-content-features { | ||
width: 32%; | ||
border-radius: 10px; | ||
box-shadow: 0px 3px 26px #00000017; | ||
background: #fff; | ||
text-align: center; | ||
padding: 35px 70px 26px; | ||
} | ||
|
||
.dashboard-task-wraper { | ||
display: flex; | ||
justify-content: space-between; | ||
padding: 0px 40px; | ||
margin-top: 40px; | ||
} | ||
|
||
@media (max-width: 1199.98px) { | ||
.dashboard-task-items { | ||
width: 33%; | ||
padding-left: 15px; | ||
} | ||
} | ||
|
||
.dashboard-task-items { | ||
width: 30%; | ||
padding-left: 15px; | ||
} | ||
|
||
.dashboard-task-items h6 { | ||
font-size: 18px; | ||
font-weight: 600; | ||
color: #000000; | ||
margin-bottom: 35px; | ||
} | ||
|
||
.dashboard-task-items a { | ||
display: block; | ||
width: max-content; | ||
margin-top: 10px; | ||
margin-bottom: 10px; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,106 @@ | ||
import React from 'react'; | ||
import { Link } from "react-router-dom"; | ||
import 'react-toastify/dist/ReactToastify.css'; | ||
|
||
import "./Home.scss" | ||
|
||
function Home() { | ||
return ( | ||
<div className="dashboard-content content-full" id="content"> | ||
<div className="dashboard-content-wraper"> | ||
<div className="container-fluid"> | ||
<div className="row"> | ||
<div className="col-12"> | ||
<div className="dashboard-title"> | ||
<h2 className="font-h2 fontw-300">Welcome to <span className="fontw-500">zasper</span></h2> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div className="container-fluid"> | ||
<div className="row"> | ||
<div className="col-12"> | ||
<div className="dashboard-content-features-wraper"> | ||
<div className="dashboard-content-features"> | ||
<div className="dashboard-content-features-icon"> | ||
<img src="./images/help.svg" alt="#" /> | ||
</div> | ||
<div className="dashboard-content-features-info"> | ||
<h5>Explore the Quickstart Tutorial</h5> | ||
<p>Spin up a cluster, run queries on preloaded data, and display results in 5 minutes.</p> | ||
<a href="https://docs.zasper.io/documentation.html" target="_blank" rel="noopener noreferrer" className="btn-bg">Explore More</a> | ||
</div> | ||
</div> | ||
<div className="dashboard-content-features"> | ||
<div className="dashboard-content-features-icon"> | ||
<img src="./images/upload.svg" alt="#" /> | ||
</div> | ||
<div className="dashboard-content-features-info"> | ||
<h5>Import and Export Data</h5> | ||
<p>Quickly import data, preview its schema, create a table, and query it in a notebook.</p> | ||
<a href="https://docs.zasper.io/documentation.html" target="_blank" rel="noopener noreferrer" className="btn-bg">Explore More</a> | ||
</div> | ||
</div> | ||
<div className="dashboard-content-features"> | ||
<div className="dashboard-content-features-icon"> | ||
<img src="./images/file2.svg" alt="#" /> | ||
</div> | ||
<div className="dashboard-content-features-info"> | ||
<h5>Create a New Project</h5> | ||
<p>Create a notebook to start querying, visualizing, and modeling your data.</p> | ||
<a href="/workspace" className="btn-bg">Explore More</a> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div className="container-fluid"> | ||
<div className="row"> | ||
<div className="col-12"> | ||
<div className="dashboard-task-wraper"> | ||
<div className="dashboard-task-items"> | ||
<h6>COMMON TASKS</h6> | ||
<Link to="/workspace/"> | ||
<span>New Notebook</span> | ||
</Link> | ||
<Link to="https://docs.zasper.io" target="_blank" rel="noopener noreferrer"> | ||
<span>Read Documentation</span> | ||
</Link> | ||
</div> | ||
|
||
<div className="dashboard-task-items"> | ||
<h6>RECENTS</h6> | ||
<Link to="#"> | ||
<span>Quickstart Notebook (1)</span> | ||
</Link> | ||
<Link to="#"> | ||
<span>Quickstart Notebook</span> | ||
</Link> | ||
<div> | ||
<button className='btn-bg'>Notify!</button> | ||
|
||
</div> | ||
</div> | ||
|
||
<div className="dashboard-task-items"> | ||
<h6>RECENTS</h6> | ||
<Link to="https://docs.zasper.io" target="_blank" rel="noopener noreferrer"> | ||
<span>Zasper Status</span> | ||
</Link> | ||
<Link to="https://docs.zasper.io" target="_blank" rel="noopener noreferrer"> | ||
<span>View latest release notes</span> | ||
</Link> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div>); | ||
} | ||
|
||
|
||
export default Home; |