Skip to content

Commit

Permalink
demo page done
Browse files Browse the repository at this point in the history
  • Loading branch information
@officialShaifaliJ
officialShaifaliJ committed Nov 9, 2022
1 parent e9adc4e commit d9d9468
Show file tree
Hide file tree
Showing 4 changed files with 518 additions and 0 deletions.
216 changes: 216 additions & 0 deletions demo.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,216 @@
<!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>Document</title>
<link rel="stylesheet" href="./styles/footer.css">
<link rel="stylesheet" href="./styles/navbar.css">
<link rel="stylesheet" href="./styles/demo.css">
</head>
<body>

<!-- navbar import -->
<div id="navbar"></div>

<!-- Demo of DeskTime ------<--BOOK DEMO -->
<div class="container ">

<div id="demotime">
<h1>Get a super quick in-depth demo of DeskTime</h1>
<p>
What’s the best way to find out if DeskTime works for you? Try it yourself! We’ll give you a personalized 1:1 DeskTime demo and answer any<br> questions you might have.
</p>
<button class="demo">BOOK A DEMO</button>
<button class="trial">START A FREE TRIAL</button>
</div>

<div>
<img src="https://desktime.com/static/web/demo/demo-of-desktime.png" alt="bgImggrey">
</div>


</div>

<!-- Demo 4 cards -->
<div id="card_div">
<div class="card">
<img src="https://desktime.com/static/web/demo/magnify.svg" alt="">
<h2>Demo account</h2>
<p>Learn how DeskTime tracks time, explore the dashboard and try all the available features in this self-guided DeskTime demo.</p>
<button>EXPLORE</button>
</div>
<div class="card">
<img src="https://desktime.com/static/web/demo/chat.svg" alt="">
<h2>Live demo</h2>
<p>Sign up for a 1:1 demo call with our product expert, take a personalized tour and get answers to any questions you might have.</p>
<button>BOOK A DEMO</button>
</div>
<div class="card">
<img src="https://desktime.com/static/web/demo/webinar.svg" alt="">
<h2>Webinars</h2>
<p>Watch on-demand webinars and tutorials to make sure you get the most out of all the features DeskTime has to offer.</p>
<button>WATCH NOW</button>
</div>
<div class="card">
<img src="https://desktime.com/static/web/demo/form.svg" alt="">
<h2>Sign Up</h2>
<p>Find out what time tracking means, add team members, and test the project feature for effective workflow management.</p>
<button>START A FREE TRIAL</button>
</div>
</div>

<!-- video part -->
<!-- For team -->
<div class="shadow">
<div class="video">

<div id="team" class="content_css">
<h1>DeskTime for Teams</h1>
<p>
Watch this tutorial to learn how to keep track of your employees' work with the Admin features of DeskTime, find out how to add team members, manage work schedules, create reports, and more.
</p>
<p>
With DeskTime you can plan and create shifts, manage absences and use the Project tracking feature to see who is working on what and for how long.
</p>
<p>
<i class="fa-sharp fa-solid fa-check"></i>
Keep track of processes and goals.
</p>
<p>
<i class="fa-sharp fa-solid fa-check"></i>
Set Automatic time & project tracking.
</p>
<p>
<i class="fa-sharp fa-solid fa-check"></i>
Grasp shift and absence scheduling.
</p>
<button class="demo">START A FREE TRIAL</button>
<button class="trial">BOOK A DEMO</button>

</div>
<div class="img_div">
<iframe width="560" height="315" src="https://www.youtube.com/embed/uFl2-NstWtc" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
</div>
<!-- for employee -->
<div class="video">
<div class="img_div">
<iframe width="560" height="315" src="https://www.youtube.com/embed/dXNTGAttl6Y" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

</div>
<div id="employee" class="content_css">
<h1>DeskTime for Employees</h1>
<p>
If you're working in a company that tracks your work hours with DeskTime, this video guide is for you.
</p>
<p>
Learn what DeskTime’s time tracking app is, how to navigate it, use its features, such as Projects, Work Schedules, Absence calendar, Reports, and more.
</p>
<p>
<i class="fa-sharp fa-solid fa-check"></i>
Identify your computer usage habits.
</p>
<p>
<i class="fa-sharp fa-solid fa-check"></i>
Improve upon work plan & execution.
</p>
<p>
<i class="fa-sharp fa-solid fa-check"></i>
See what's causing constraints in your day.
</p>
<button class="demo">START A FREE TRIAL</button>
<button class="trial">BOOK A DEMO</button>
</div>
</div>

<!-- for freelancer -->
<div class="shadow">
<div class="video">
<div id="freelancer" class="content_css">
<h1>DeskTime for Freelancers</h1>
<p>
This guide explores the main features of DeskTime for freelancers and shows how to manage projects, create reports, and change the settings specific to you.
</p>
<p>
Using DeskTime is a great way to never again get underpaid for the time invested in your clients' projects.
</p>
<p>
<i class="fa-sharp fa-solid fa-check"></i>
Track time spent on specific projects.
</p>
<p>
<i class="fa-sharp fa-solid fa-check"></i>
Use the Cost calculation feature.
</p>
<p>
<i class="fa-sharp fa-solid fa-check"></i>
Boost productivity to raise your income.
</p>
<button class="demo">START A FREE TRIAL</button>
<button class="trial">BOOK A DEMO</button>
</div>
<div class="img_div">
<iframe width="560" height="315" src="https://www.youtube.com/embed/pl3kbM9mC08" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
</div>

<!-- Rating Div -->
<div class="rating_div">
<div class="rate_card">
<img src="https://desktime.com/static/web/_common/ratings/capterra-white-logo.svg" alt="">
<h4>
4.5 out of 5 stars from 320 reviews
</h4>
</div>
<div class="rate_card">
<img src="https://desktime.com/static/web/_common/ratings/g2-crowd-white-logo.svg" alt="">
<h4>
4.5 out of 5 stars from 320 reviews
</h4>
</div>
<div class="rate_card">
<img src="https://desktime.com/static/web/_common/ratings/software-advice-white-logo.svg" alt="">
<h4>
4.5 out of 5 stars from 320 reviews
</h4>
</div>
</div>

<!-- self guided demo -->
<div id="yet">
<div id="laptop">
<img src="https://desktime.com/static/web/demo/notebook.png" alt="">
</div>
<div id="yet_card">
<h1>Not convinced yet?</h1>
<h1>Check out our self-guided demo</h1>
<p>If you want the full scope of what you’re getting once you sign up, visit our demo account. You can try out all the features DeskTime has to offer.</p>
<button class="demo">BOOK A DEMO</button>
</div>
</div>

<!-- DeskTime app -->
<div id="green_div">
<h1>
Join 400,000+ users already managing their time with the DeskTime app
</h1>
<input type="text" id="mail" placeholder="Your work email"><button class="demo">GET STARTED</button>
<p>Try free for 14 days. No credit card required.</p>
<p>By signing up, you agree to our terms and privacy policy.</p>
</div>

<!-- Footer import -->
<div id="footer"></div>

</body>
</html>
<script src="https://kit.fontawesome.com/24c494a6b6.js"
crossorigin="anonymous"
></script>
<script type="module" src="./scripts/demo.js"></script>
<script src="./scripts/navbar.js"></script>
<script src="./scripts/footer.js"></script>
54 changes: 54 additions & 0 deletions demo.txt
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
IMAGES URL

Background img https://desktime.com/static/web/_common/intro-background.png
Demo img https://desktime.com/static/web/demo/demo-of-desktime.png

Demo account https://desktime.com/static/web/demo/magnify.svg
Live demo https://desktime.com/static/web/demo/chat.svg
Webinar https://desktime.com/static/web/demo/webinar.svg
Signup https://desktime.com/static/web/demo/form.svg

Desk time for team https://desktime.com/static/web/demo/yt-dt-teams.png
Youtube https://desktime.com/bs4/images/play.png?2e458922cbc0b6b6a3ee465cfc50afdd

Desk time fo employee https://desktime.com/static/web/demo/yt-dt-employees.png

Desk time for freelancer https://desktime.com/static/web/demo/yt-dt-freelancers.png

Captera https://desktime.com/static/web/_common/ratings/capterra-white-logo.svg
CROWD https://desktime.com/static/web/_common/ratings/g2-crowd-white-logo.svg
SOFTWARE ADVICE https://desktime.com/static/web/_common/ratings/software-advice-white-logo.svg

SELF GUIDE DEMO https://desktime.com/static/web/demo/notebook.png


Abhilash https://desktime.com/static/web/testimonial-images/abhilash-subhash.png
Barrett https://desktime.com/static/web/testimonial-images/amtec.png
Mario https://desktime.com/static/web/testimonial-images/monteloeder.png
Rizah https://desktime.com/static/web/testimonial-images/rizah.png
VM samir https://desktime.com/static/web/testimonial-images/samir.jpg
Tony wilson https://desktime.com/static/web/testimonial-images/smart-it.png
Zack thompson https://desktime.com/static/web/testimonial-images/thompson-law.png
Ershadul https://desktime.com/static/web/testimonial-images/rise-up-labs.png
Alsam https://desktime.com/static/web/testimonial-images/alsam-hasib.png

Youtube channel link https://www.youtube.com/channel/UCHMGr8kbfSU2Ler6iBM4b1g

TODO LIST

---> DAY-2(Demo Page)

1.) Super Quick demo part
>> super quick div
>> 4 demo card
2.) Youtube video part
>> Team div
>> Employee div
>> Freelancer div

---> DAY -3(Demo Page)
1.) Rating & Companies part
>> rating div
>> Not convinced yet? div
>> Trust
2.)
19 changes: 19 additions & 0 deletions scripts/demo.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
//import navbar
import nav from '/components/nav.js';

let navbar=document.getElementById('navbar');
navbar.innerHTML=nav();

//import footer
import fot from '/components/fot.js';

let footer=document.getElementById('footer');
footer.innerHTML=fot();

// <!-- Demo 4 cards -->






Loading

0 comments on commit d9d9468

Please sign in to comment.