Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dark mode button UI improved. #95

Merged
merged 8 commits into from
Oct 9, 2022
Merged

Dark mode button UI improved. #95

Show file tree
Hide file tree
Changes from 6 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
13ac60d
dark mode button modified
bhumika-1-3 Oct 9, 2022
437d1d0
Merge branch 'master' of https://github.com/bhumika-1-3/Drifty
bhumika-1-3 Oct 9, 2022
bccbdaa
Create page.yml
bhumika-1-3 Oct 9, 2022
62a8638
Delete page.yml
SaptarshiSarkar12 Oct 9, 2022
01c1961
Merge branch 'master' into master
SaptarshiSarkar12 Oct 9, 2022
367760b
Merge branch 'master' into master
SaptarshiSarkar12 Oct 9, 2022
50dc489
button enhanced
bhumika-1-3 Oct 9, 2022
9530e85
Merge branch 'master' of https://github.com/bhumika-1-3/Drifty
bhumika-1-3 Oct 9, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
322 changes: 200 additions & 122 deletions Website/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,135 +1,213 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Drifty</title>
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link
href="https://fonts.googleapis.com/css2?family=Rubik:wght@400;600;700&display=swap"
rel="stylesheet"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css"
integrity="sha512-xh6O/CkQoPOWDdYTDqeRdPCVd1SpvCA9XXcUnZS2FmJNp1coAFzvtCN9BmamE+4aHK8yyUHUSCcJHgXloTyT2A=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="responsive-nav.css" />
<!-- Favicons -->
<link
rel="apple-touch-icon"
sizes="180x180"
href="./favicons/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="./favicons/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="./favicons/favicon-16x16.png"
/>
<link rel="manifest" href="./favicons/site.webmanifest" />
<!-- Bootstrap
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous"> -->
<link rel="stylesheet" href="style.css" />
</head>

<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Drifty</title>
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link href="https://fonts.googleapis.com/css2?family=Rubik:wght@400;600;700&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css"
integrity="sha512-xh6O/CkQoPOWDdYTDqeRdPCVd1SpvCA9XXcUnZS2FmJNp1coAFzvtCN9BmamE+4aHK8yyUHUSCcJHgXloTyT2A=="
crossorigin="anonymous" referrerpolicy="no-referrer">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="responsive-nav.css">
<!-- Favicons -->
<link rel="apple-touch-icon" sizes="180x180" href="./favicons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./favicons/favicon-16x16.png">
<link rel="manifest" href="./favicons/site.webmanifest">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="texture"></div>
<div class="nav-container">
<div class="nav-bar">
<a href="https://saptarshisarkar12.github.io/Drifty/"
><img class="logo" src="Resources/Driftyicon.webp" alt="Drifty-icon"
/></a>
<nav>
<ul class="nav-links">
<li>
<a href="#hero"><button class="button">Home</button></a>
</li>
<li>
<a href="#aboutus"><button class="button">About</button></a>
</li>
<li>
<a href="#download"><button class="button">Download</button></a>
</li>
<li>
<a href="#contrib"><button class="button">Contribute</button></a>
</li>
<li>
<a href="#contact"><button class="button">Contact</button></a>
</li>
<!-- <li><input type="checkbox" class="btn-toggle" /></li> -->
</ul>
</nav>
<button id="menu" class="button"><i class="fas fa-bars"></i></button>
</div>
</div>

<body>
<div class="texture"></div>
<div class="nav-container">
<div class="nav-bar">
<a href="https://saptarshisarkar12.github.io/Drifty/"><img class="logo" src="Resources/Driftyicon.webp"
alt="Drifty-icon" /></a>
<nav>
<ul class="nav-links">
<li><a href="#hero"><button class="button">Home</button></a></li>
<li><a href="#aboutus"><button class="button">About</button></a></li>
<li><a href="#download"><button class="button">Download</button></a></li>
<li><a href="#contrib"><button class="button">Contribute</button></a></li>
<li><a href="#contact"><button class="button">Contact</button></a></li>
<li><input type="checkbox" class="btn-toggle"></li>
</ul>
</nav>
<button id="menu" class="button"><i class="fas fa-bars"></i></button>
</div>
</div>
<section id="hero">
<header>
<div class="header-container">
<h1>DRIFTY</h1>
<p>
Drifty is an open-source interactive File Downloader system built
with java. It takes the link to the file, the directory where it
needs to be saved and the filename of the downloaded file as input
and downloads it in the given directory with the given filename.
</p>
<a href="#contrib" class="btn">More Info</a>
<a href="#demo" class="btn">Demo</a>
</div>

<section id="hero">
<header>
<div class="header-container">
<h1>DRIFTY</h1>
<p>
Drifty is an open-source interactive File Downloader system built with java.
It takes the link to the file, the directory where it needs to be saved and the filename
of the downloaded file as input and downloads it in the given directory with the given filename.
</p>
<a href="#contrib" class="btn">More Info</a>
<a href="#demo" class="btn">Demo</a>
</div>
<!-- <img src="Resources/drifty.webp" alt="drifty_console_img" /> -->
<div class="img-layer" id="imgLayer">
<img src="./Resources/Layers/2.webp" alt="..." srcset="">
<img src="./Resources/Layers/3.webp" alt="..." srcset="">
<img src="./Resources/Layers/4.webp" alt="..." srcset="">
<img src="./Resources/Layers/5.webp" alt="..." srcset="">
<img src="./Resources/Layers/6.webp" alt="..." srcset="">
<img src="./Resources/Layers/7.webp" alt="..." srcset="">
</div>
</header>
</section>
<!-- <img src="Resources/drifty.webp" alt="drifty_console_img" /> -->
<div class="img-layer" id="imgLayer">
<img src="./Resources/Layers/2.webp" alt="..." srcset="" />
<img src="./Resources/Layers/3.webp" alt="..." srcset="" />
<img src="./Resources/Layers/4.webp" alt="..." srcset="" />
<img src="./Resources/Layers/5.webp" alt="..." srcset="" />
<img src="./Resources/Layers/6.webp" alt="..." srcset="" />
<img src="./Resources/Layers/7.webp" alt="..." srcset="" />
</div>
</header>
</section>

<section id="contrib" class="contrib">
<div class="contrib-container">
<div class="content">
<h2 class="text-gradient-ry">More Information About Drifty</h2>
<p>It is currently available in CLI (Command Line Interface) mode and the GUI (Graphical User Interface)
version is under active development. We believe in team work. Any contribution that brings value to
the project is highly appreciated. You may contribute to this project here.</p>
<section id="contrib" class="contrib">
<div class="contrib-container">
<div class="content">
<h2 class="text-gradient-ry">More Information About Drifty</h2>
<p>
It is currently available in CLI (Command Line Interface) mode and
the GUI (Graphical User Interface) version is under active
development. We believe in team work. Any contribution that brings
value to the project is highly appreciated. You may contribute to
this project here.
</p>
</div>
<div class="content">
<h2 class="text-gradient-blue">Be a part of Drifty Family!</h2>
<div class="contributors" id="contributors"></div>
<a href="https://github.com/SaptarshiSarkar12/Drifty" class="btn4"
><i class="fab fa-github"></i> Contribute to Drifty</a
>
</div>
</div>
</section>

</div>
<div class="content">
<h2 class="text-gradient-blue">Be a part of Drifty Family!</h2>
<div class="contributors" id="contributors">
</div>
<a href="https://github.com/SaptarshiSarkar12/Drifty" class="btn4"><i class="fab fa-github"></i>
Contribute to Drifty</a>
</div>
</div>
</section>
<section id="contrib" class="info"></section>

<section id="contrib" class="info"></section>
<section id="download" class="download">
<h2>✨Download Here✨</h2>
<div id="download_section" class="download_section">
<a
href="https://github.com/SaptarshiSarkar12/Drifty/releases/latest/download/Drifty_CLI.exe"
class="btn4"
>Download Now <i class="fab fa-windows"></i
></a>
<a
href="https://github.com/SaptarshiSarkar12/Drifty/releases/latest/download/Drifty.jar"
class="btn4"
>Download Now <i class="fab fa-apple"></i> <i class="fab fa-linux"></i
></a>
</div>

<section id="download" class="download">
<h2>✨Download Here✨</h2>
<div id="download_section" class="download_section">
<a href="https://github.com/SaptarshiSarkar12/Drifty/releases/latest/download/Drifty_CLI.exe"
class="btn4">Download Now <i class="fab fa-windows"></i></a>
<a href="https://github.com/SaptarshiSarkar12/Drifty/releases/latest/download/Drifty.jar"
class="btn4">Download Now <i class="fab fa-apple"></i> <i class="fab fa-linux"></i></a>
</div>
<div id="demo" class="demo">
<div class="text">
<h2>Demonstration of Drifty</h2>
<p>Here is a quick demo of using Drifty.</p>
</div>
<video
src="Resources/Usage.webm"
playsinline
autoplay
muted
loop
></video>
</div>
</section>

<div id="demo" class="demo">
<div class="text">
<h2>Demonstration of Drifty</h2>
<p>Here is a quick demo of using Drifty.</p>
</div>
<video src="Resources/Usage.webm" playsinline autoplay muted loop></video>
</div>
</section>
<!-- contact us section -->
<section id="contact">
<h2>Contact Us</h2>
<div class="contact-container">
<a
href="https://github.com/SaptarshiSarkar12/Drifty/discussions"
type="button"
>
<i class="fa-solid fa-headset"></i> Support
</a>
<a href="https://www.twitter.com/SSarkar2007" type="button"
><i class="fab fa-twitter"></i> Twitter</a
>
<a href="mailto:[email protected]" type="button"
><i class="fa-sharp fa-solid fa-envelope"></i> Email</a
>
</div>
</section>

<!-- contact us section -->
<section id="contact">
<h2>Contact Us</h2>
<div class="contact-container">
<a href="https://github.com/SaptarshiSarkar12/Drifty/discussions" type="button"> <i
class="fa-solid fa-headset"></i> Support </a>
<a href="https://www.twitter.com/SSarkar2007" type="button"><i class="fab fa-twitter"></i> Twitter</a>
<a href="mailto:[email protected]" type="button"><i class="fa-sharp fa-solid fa-envelope"></i>
Email</a>
</div>
</section>

<footer class="footer">
<div class="social">
<a href="https://www.twitter.com/SSarkar2007"><i class="fab fa-twitter"></i></a>
<a href="https://github.com/SaptarshiSarkar12"><i class="fab fa-github"></i></a>
<a href="mailto:[email protected]"><i class="fa-sharp fa-solid fa-envelope"></i></a>
<a href="https://saptarshisarkar.hashnode.dev/"><i class="fa-brands fa-hashnode"></i></a>
<a href="https://www.bio.link/saptarshi"><i class="fa-sharp fa-solid fa-link"></i></a>
<!--added footers -->
</div>
<p><i class="fa-solid fa-copyright"></i> Drifty 2022</p>
</footer>
<footer class="footer">
<div class="social">
<a href="https://www.twitter.com/SSarkar2007"
><i class="fab fa-twitter"></i
></a>
<a href="https://github.com/SaptarshiSarkar12"
><i class="fab fa-github"></i
></a>
<a href="mailto:[email protected]"
><i class="fa-sharp fa-solid fa-envelope"></i
></a>
<a href="https://saptarshisarkar.hashnode.dev/"
><i class="fa-brands fa-hashnode"></i
></a>
<a href="https://www.bio.link/saptarshi"
><i class="fa-sharp fa-solid fa-link"></i
></a>
<!--added footers -->
</div>
<p><i class="fa-solid fa-copyright"></i> Drifty 2022</p>
</footer>

<!-- Scripts -->
<script src="script.js"></script>
</body>

</html>
<!-- dark mode button -->
<div class="btn-toggle">
<p>
<i class="fa-solid fa-lightbulb fb" ></i>
</p>
</div>
<!-- Scripts -->
<script src="script.js"></script>
<!-- Bootstrap js -->
<!-- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous">
</script> -->
</body>
</html>
Loading