├── css ├── githubN.css ├── README.md ├── FreshBooks.css ├── Pivotal.css ├── footer.css ├── foot.css ├── signup.css ├── header.css ├── Insightly.css ├── demo.css ├── GitLab.css ├── GitHub.css ├── integration.css ├── login.css ├── Notion.css ├── slack.css ├── Trello.css ├── everhour.css ├── Pricing.css └── todoist.css ├── .vscode └── settings.json ├── images ├── 10.png ├── 11.png ├── 12.png ├── 13.png ├── 14.png ├── 15.png ├── 16.png ├── 17.png ├── 18.png ├── 19.png ├── 20.png ├── 21.png ├── 22.png ├── 23.png ├── 24.png ├── 25.png ├── 26.png ├── 27.png ├── 28.png ├── 29.png ├── 3.png ├── 4.png ├── 5.png ├── 6.png ├── 7.png ├── 8.png ├── 9.png ├── asana.png ├── jira.png ├── xero.png ├── Notion.png ├── arrowup.png ├── basecamp.png ├── clickup.png ├── download.png ├── github.png ├── gitlab.png ├── monday.png ├── rocket.png ├── todoist.png ├── trello.png ├── Quickbook.png ├── arrowdown.png ├── image1.png.jpg ├── image5.png.png ├── footer_logo.png ├── image10.png.webp ├── image11.png.webp ├── image3.png.webp ├── image4.png.webp ├── image6.png.webp ├── image7.png.webp ├── image8.png.webp ├── image9.png.webp ├── jira-primary.webp ├── asana-primary.webp ├── customer-kelly.webp ├── github-primary.webp ├── monday-primary.webp ├── notion-primary.webp ├── trello-primary.webp ├── basecamp-primary.webp ├── clickup-primary.webp ├── everhourLogo.png.webp └── quote.png ├── js ├── everhour.js └── Trello.js ├── README.md ├── Pivotal.html ├── components └── navbar.js ├── FreshBooks.html ├── Insightly.html ├── components_2 ├── footer.js └── foot.html ├── login.html ├── slack.html ├── navbar.html ├── quickbook.html ├── demo.html ├── index.html ├── signup.html ├── Pricing.html ├── todoist-time-tracking.html ├── integrations.html └── GitLab.html /css/githubN.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /css/README.md: -------------------------------------------------------------------------------- 1 | # hot-caption-4153 -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5502 3 | } -------------------------------------------------------------------------------- /images/10.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/10.png -------------------------------------------------------------------------------- /images/11.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/11.png -------------------------------------------------------------------------------- /images/12.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/12.png -------------------------------------------------------------------------------- /images/13.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/13.png -------------------------------------------------------------------------------- /images/14.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/14.png -------------------------------------------------------------------------------- /images/15.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/15.png -------------------------------------------------------------------------------- /images/16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/16.png -------------------------------------------------------------------------------- /images/17.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/17.png -------------------------------------------------------------------------------- /images/18.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/18.png -------------------------------------------------------------------------------- /images/19.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/19.png -------------------------------------------------------------------------------- /images/20.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/20.png -------------------------------------------------------------------------------- /images/21.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/21.png -------------------------------------------------------------------------------- /images/22.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/22.png -------------------------------------------------------------------------------- /images/23.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/23.png -------------------------------------------------------------------------------- /images/24.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/24.png -------------------------------------------------------------------------------- /images/25.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/25.png -------------------------------------------------------------------------------- /images/26.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/26.png -------------------------------------------------------------------------------- /images/27.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/27.png -------------------------------------------------------------------------------- /images/28.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/28.png -------------------------------------------------------------------------------- /images/29.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/29.png -------------------------------------------------------------------------------- /images/3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/3.png -------------------------------------------------------------------------------- /images/4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/4.png -------------------------------------------------------------------------------- /images/5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/5.png -------------------------------------------------------------------------------- /images/6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/6.png -------------------------------------------------------------------------------- /images/7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/7.png -------------------------------------------------------------------------------- /images/8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/8.png -------------------------------------------------------------------------------- /images/9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/9.png -------------------------------------------------------------------------------- /images/asana.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/asana.png -------------------------------------------------------------------------------- /images/jira.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/jira.png -------------------------------------------------------------------------------- /images/xero.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/xero.png -------------------------------------------------------------------------------- /images/Notion.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/Notion.png -------------------------------------------------------------------------------- /images/arrowup.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/arrowup.png -------------------------------------------------------------------------------- /images/basecamp.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/basecamp.png -------------------------------------------------------------------------------- /images/clickup.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/clickup.png -------------------------------------------------------------------------------- /images/download.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/download.png -------------------------------------------------------------------------------- /images/github.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/github.png -------------------------------------------------------------------------------- /images/gitlab.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/gitlab.png -------------------------------------------------------------------------------- /images/monday.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/monday.png -------------------------------------------------------------------------------- /images/rocket.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/rocket.png -------------------------------------------------------------------------------- /images/todoist.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/todoist.png -------------------------------------------------------------------------------- /images/trello.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/trello.png -------------------------------------------------------------------------------- /images/Quickbook.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/Quickbook.png -------------------------------------------------------------------------------- /images/arrowdown.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/arrowdown.png -------------------------------------------------------------------------------- /images/image1.png.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image1.png.jpg -------------------------------------------------------------------------------- /images/image5.png.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image5.png.png -------------------------------------------------------------------------------- /images/footer_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/footer_logo.png -------------------------------------------------------------------------------- /images/image10.png.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image10.png.webp -------------------------------------------------------------------------------- /images/image11.png.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image11.png.webp -------------------------------------------------------------------------------- /images/image3.png.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image3.png.webp -------------------------------------------------------------------------------- /images/image4.png.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image4.png.webp -------------------------------------------------------------------------------- /images/image6.png.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image6.png.webp -------------------------------------------------------------------------------- /images/image7.png.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image7.png.webp -------------------------------------------------------------------------------- /images/image8.png.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image8.png.webp -------------------------------------------------------------------------------- /images/image9.png.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/image9.png.webp -------------------------------------------------------------------------------- /images/jira-primary.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/jira-primary.webp -------------------------------------------------------------------------------- /images/asana-primary.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/asana-primary.webp -------------------------------------------------------------------------------- /images/customer-kelly.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/customer-kelly.webp -------------------------------------------------------------------------------- /images/github-primary.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/github-primary.webp -------------------------------------------------------------------------------- /images/monday-primary.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/monday-primary.webp -------------------------------------------------------------------------------- /images/notion-primary.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/notion-primary.webp -------------------------------------------------------------------------------- /images/trello-primary.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/trello-primary.webp -------------------------------------------------------------------------------- /images/basecamp-primary.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/basecamp-primary.webp -------------------------------------------------------------------------------- /images/clickup-primary.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/clickup-primary.webp -------------------------------------------------------------------------------- /images/everhourLogo.png.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chandrashekharjoshi302/hot-caption-4153/HEAD/images/everhourLogo.png.webp -------------------------------------------------------------------------------- /js/everhour.js: -------------------------------------------------------------------------------- 1 | var indexValue =1; 2 | showImg(indexValue); 3 | function side_slide(e){ 4 | showImg(indexValue += e); 5 | } 6 | function showImg(e){ 7 | var i; 8 | const img = document.querySelectorAll('.img'); 9 | if(e >img.length){ 10 | indexValue = 1; 11 | } 12 | if(e<1){ 13 | indexValue = img.length; 14 | } 15 | for(i=0; i{ 4 | let iframe_div=document.createElement("div") 5 | iframe_div.setAttribute("id","iframe_div") 6 | let content=document.getElementById("constent") 7 | 8 | let iframe=document.createElement("iframe"); 9 | 10 | iframe.src="https://www.youtube.com/embed/D_3ONFnI8MM"; 11 | iframe.allowFullscreen="fullscreen"; 12 | let cancel=document.createElement("button"); 13 | cancel.setAttribute("id","cancel") 14 | cancel.innerText="x"; 15 | cancel.addEventListener("click",()=>{ 16 | window.location.reload() 17 | }) 18 | iframe_div.append(iframe,cancel) 19 | content.append(iframe_div) 20 | }) 21 | -------------------------------------------------------------------------------- /css/FreshBooks.css: -------------------------------------------------------------------------------- 1 | #content{ 2 | display: grid; 3 | /* position: relative; */ 4 | width: 60%; 5 | /* border: 1px solid red; */ 6 | height: auto; 7 | justify-content: center; 8 | top: 20vh; 9 | left: 20vw; 10 | font-family: sans-serif; 11 | margin: auto; 12 | margin-top: 30px; 13 | } 14 | #content h3{ 15 | color: gray; 16 | text-align: center; 17 | font-size: 21px; 18 | line-height: 30px; 19 | font-weight: lighter; 20 | 21 | 22 | } 23 | #content p{ 24 | color: gray; 25 | font-size: 18px; 26 | line-height: 25px; 27 | 28 | } 29 | #content h1{ 30 | text-align: center; 31 | font-weight: lighter; 32 | 33 | } 34 | #content img{ 35 | 36 | 37 | margin: 0 30% 0 30%; 38 | } 39 | #content h2{ 40 | font-weight: lighter; 41 | } -------------------------------------------------------------------------------- /images/quote.png: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /css/Pivotal.css: -------------------------------------------------------------------------------- 1 | #one{ 2 | width: 50%; 3 | height: 300px; 4 | margin: auto; 5 | margin-top: 140px; 6 | text-align: center; 7 | color: #333333; 8 | font-family: geomanist-regular, sans-serif; 9 | } 10 | #one>h1{ 11 | font-size: 45px; 12 | font-weight: bold; 13 | } 14 | #one>p{ 15 | font-size: 20px; 16 | color: #767676; 17 | } 18 | #one>div{ 19 | display: flex; 20 | 21 | } 22 | #one>div>input{ 23 | padding: 13px 210px 13px 12px; 24 | margin: 10px 10px 10px 120px; 25 | } 26 | #one>div>button{ 27 | margin-top: 10px; 28 | height: 44px; 29 | width: 140px; 30 | color: #F6FBF7; 31 | background-color: #57BB71; 32 | border: 0px; 33 | border-radius: 4px; 34 | font-size: 16px; 35 | 36 | } 37 | #one>div>button:hover { 38 | background-color: #18A558; 39 | } 40 | .one{ 41 | width: 400px; 42 | display: flex; 43 | margin: 0px 250px 44 | } 45 | .one>img{ 46 | width: 25px; 47 | height: 25px; 48 | margin-right: 6px; 49 | } 50 | .one>p{ 51 | color: #767676; 52 | margin-top: 5px; 53 | } 54 | #two{ 55 | margin-top: -89px; 56 | position: relative; 57 | width: 100%; 58 | height: 650px; 59 | } 60 | .img1{ 61 | position: relative; 62 | top: 0; 63 | left: 990px; 64 | } 65 | .img2{ 66 | position: absolute; 67 | top: 90px; 68 | left: 210px; 69 | width: 73%; 70 | height: 100%; 71 | } -------------------------------------------------------------------------------- /css/footer.css: -------------------------------------------------------------------------------- 1 | #main_c{ 2 | width: 100%; 3 | height: 634px; 4 | border: 0px solid red; 5 | margin-top: 20px; 6 | background-color: #151616; 7 | } 8 | #inner_part{ 9 | width: 95%; 10 | height: 510px; 11 | border: 0px solid red; 12 | margin: auto; 13 | display: flex; 14 | } 15 | #inner_part>.inner_col{ 16 | width: 190px; 17 | height: 451px; 18 | border: 0px solid red; 19 | margin: auto; 20 | margin-top: 50px; 21 | /* color: white; */ 22 | } 23 | #inner_part>div:nth-child(1){ 24 | margin-left: 67px; 25 | } 26 | #inner_part>img{ 27 | width: 43px; 28 | height: 47px; 29 | margin-top: 50px; 30 | } 31 | 32 | .inner_col>h3{ 33 | color:gray; 34 | font-family: sans-serif; 35 | font-size: 14px; 36 | margin-top: 20px; 37 | } 38 | .inner_col>p>a{ 39 | color: white; 40 | text-decoration: none; 41 | font-family: sans-serif; 42 | font-size: 14px; 43 | line-height: 30px; 44 | } 45 | .inner_col>p>a:hover{ 46 | color:gray; 47 | } 48 | #last_part{ 49 | width: 90%; 50 | height: 100px; 51 | border: 0px solid red; 52 | margin: auto; 53 | display: flex; 54 | /* margin-top: 20px; */ 55 | /* background-color: #151616; */ 56 | } 57 | #last_part>div{ 58 | border: 0px solid red; 59 | width: 50%; 60 | display: flex; 61 | /* justify-content: flex-end; */ 62 | font-size: 8px; 63 | color: white; 64 | align-items: flex-start; 65 | font-weight: 20px; 66 | 67 | } 68 | #last_part>div:nth-child(2){ 69 | background-color: #151616; 70 | align-items: flex-end; 71 | justify-content: flex-end; 72 | } 73 | #last_part>div:nth-child(2)>span{ 74 | margin-bottom: 78px; 75 | padding-left: 10px; 76 | } 77 | 78 | 79 | -------------------------------------------------------------------------------- /css/foot.css: -------------------------------------------------------------------------------- 1 | #main_c{ 2 | width: 100%; 3 | height: 634px; 4 | border: 0px solid red; 5 | margin-top: 20px; 6 | background-color: #151616; 7 | } 8 | #inner_part{ 9 | width: 95%; 10 | height: 510px; 11 | border: 0px solid red; 12 | margin: auto; 13 | display: flex; 14 | } 15 | #inner_part>.inner_col{ 16 | width: 190px; 17 | height: 451px; 18 | border: 0px solid red; 19 | margin: auto; 20 | /* color: white; */ 21 | } 22 | #inner_part>div:nth-child(1){ 23 | margin-left: 67px; 24 | } 25 | #inner_part>img{ 26 | width: 43px; 27 | height: 47px; 28 | margin-top: 50px; 29 | } 30 | 31 | .inner_col>h3{ 32 | color:gray; 33 | font-family: sans-serif; 34 | font-size: 14px; 35 | } 36 | .inner_col>p>a{ 37 | color: white; 38 | text-decoration: none; 39 | font-family: sans-serif; 40 | font-size: 14px; 41 | } 42 | .inner_col>p>a:hover{ 43 | color:gray; 44 | } 45 | #last_part{ 46 | width: 90%; 47 | height: 100px; 48 | border: 0px solid red; 49 | margin: auto; 50 | display: flex; 51 | /* margin-top: 20px; */ 52 | /* background-color: #151616; */ 53 | } 54 | #last_part>div{ 55 | border: 0px solid red; 56 | width: 50%; 57 | display: flex; 58 | /* justify-content: flex-end; */ 59 | font-size: 8px; 60 | color: white; 61 | align-items: flex-start; 62 | font-weight: 20px; 63 | 64 | } 65 | #last_part>div:nth-child(2){ 66 | background-color: #151616; 67 | align-items: flex-end; 68 | justify-content: flex-end; 69 | } 70 | #last_part>div:nth-child(2)>span{ 71 | margin-bottom: 78px; 72 | padding-left: 10px; 73 | } 74 | 75 | 76 | -------------------------------------------------------------------------------- /css/signup.css: -------------------------------------------------------------------------------- 1 | #signUp_body { 2 | width: 50%; 3 | border: 0px solid red; 4 | height: 630px; 5 | margin: auto; 6 | margin-top: 140px; 7 | text-align: center; 8 | color: #333333; 9 | font-family: geomanist-regular, sans-serif; 10 | } 11 | .heading_005{ 12 | font-size: 45px; 13 | } 14 | .heading_006{ 15 | margin-left: -40px; 16 | width: 110%; 17 | font-size: 18px; 18 | color: #767676; 19 | } 20 | #googleSigns{ 21 | margin: 50px 100px 0px 0px; 22 | } 23 | .ok{ 24 | margin-right: 10px; 25 | margin-top: -200px; 26 | } 27 | .oko{ 28 | width: 365px; 29 | height: 275px; 30 | position: absolute; 31 | left: -700px; 32 | top: -14px; 33 | } 34 | 35 | #email{ 36 | margin-top: 5px; 37 | margin-bottom: 30px; 38 | height: 36px; 39 | width: 345px; 40 | border-radius: 3px; 41 | border: 1px solid #C0CCDA; 42 | padding-left: 10px; 43 | } 44 | 45 | #submit01{ 46 | font-size: 16px; 47 | background-color: #57BB71; 48 | color: white; 49 | border: 0px solid; 50 | width: 200px; 51 | height: 50px; 52 | margin-top: -40px; 53 | } 54 | .googleButton{ 55 | border: 1px solid #3C4858; 56 | background-color: transparent; 57 | margin-top: 0px; 58 | position: relative; 59 | top: -20px; 60 | right: -34px; 61 | font-size: 16px; 62 | margin-bottom: 20px; 63 | font-weight: 400; 64 | } 65 | 66 | .google_icon { 67 | width: 25px; 68 | height: 25px; 69 | position: relative; 70 | right: -148px; 71 | top: -14px; 72 | } 73 | 74 | 75 | .submit { 76 | height: 40px; 77 | width: 360px; 78 | border-radius: 5px; 79 | margin-top: 20px; 80 | font-family: 32px; 81 | text-align: center; 82 | }p{ 83 | color: #7C7C91; 84 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # hot-caption-4153 2 | 3 |

Everhour.com Clone

4 | 5 | 6 | 7 |

What is everhour.com -

8 |

"Everhour is an app that calculates your work hours, the work hours of your team, or a particular team member and pulls this data together into handy detailed reports. Add, remove, highlight data, change data columns, or add some extra information and simply share them within the app."

9 | 10 | 11 | 12 | 13 | 14 |

Some visuals of our project

15 | 16 |

Landing page:

17 | Landing page 18 | 19 |

Pricing page:

20 | Pricing page 21 |

Demo page:

22 | Demo page 23 |

Signup page:

24 | Signup page 25 | 26 |

Login page:

27 | Login page 28 |

Dashboard page:

29 | Dashboard page 30 | 31 | 32 |

Footer:

33 | Footer 34 | 35 | 36 | 37 |

View Deployment

38 | 39 |

Checkout live website :https://boisterous-monstera-ea0196.netlify.app/

40 | 41 | 42 | 43 | ## Team Members and Contributors 😇 : 44 | 45 | 46 | - 👤 chandrasekhar Joshi 47 | 48 | - 👤 suraj Kumar 49 | 50 | - 👤 anu das 51 | 52 | - 👤 preeti Raj 53 | 54 | - 👤 puneet savastava 55 | 56 | 57 | 58 | 59 | 60 | 61 |

Tech Stack

62 |

Git, HTML5, CSS3, JavaScript

63 | 64 | 65 | -------------------------------------------------------------------------------- /Pivotal.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Pivotal Tracker - Track Project 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |

Time tracking for Pivotal

20 |

Time estimates, budgets, reports & timesheets with Everhour’s Pivotal time tracker. Works in your interface! No more tab switching!

21 |
22 | 23 | 24 |
25 |
26 | 27 |

Or sign up with Google Account

28 |
29 |
30 |
31 | 32 | 33 |
34 | 35 | 36 | 37 | 38 | 51 | -------------------------------------------------------------------------------- /components/navbar.js: -------------------------------------------------------------------------------- 1 | 2 | 3 | function navbar(){ 4 | return ` 5 | ` 42 | } 43 | 44 | export default navbar; -------------------------------------------------------------------------------- /FreshBooks.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | FreshBooks 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |

Export your invoices to FreshBooks

17 |

Seamlessly export invoices you’ve created in Everhour to FreshBooks
18 | and automatically sync actual status back to Everhour.

19 | 20 |

What is FreshBooks?

21 |

FreshBooks is a refreshingly easy-to-use, fun and approachable cloud accounting solution that makes managing small biz finances simple and straightforward. Designed with a non-accountant in mind, easily create and send invoices, automatically import expenses and accept payments online, all from your phone or the web. Start a free 30-day trial today by clicking here.

22 |

Why are we integrating with FreshBooks?

23 |

With Everhour and FreshBooks, your project and accounting teams stay on the same page. They can easily and accurately track time and watch project progress. As well as bring information about billable time seamlessly into your FreshBooks environment.

24 |

How can I benefit from this?

25 |

By implementing this integration, we will help you fight time-consuming and tiring copy-pasting. Instead of switching between Everhour/FreshBooks tabs to fill in an invoice, you can properly complete all the steps in Everhour and billable hours will be automatically copied to FreshBooks.

26 |
27 | 28 | 29 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /css/header.css: -------------------------------------------------------------------------------- 1 | 2 | *{ 3 | margin:0; 4 | padding:0; 5 | } 6 | #nav{ 7 | display:grid; 8 | grid-template-columns: 0.5fr 2fr; 9 | height:70px; 10 | width: 100%; 11 | position: sticky; 12 | top: 0px; 13 | } 14 | #nav>div>a>img{ 15 | width: 155px; 16 | height: 53px; 17 | } 18 | #nav>div:first-child{ 19 | padding:20px 0px 50px 50px; 20 | } 21 | #nav2{ 22 | display:flex; 23 | justify-content: space-between; 24 | border: 0px solid red; 25 | } 26 | #nav3{ 27 | border: 0px solid red; 28 | display:flex; 29 | gap:50px; 30 | justify-content: space-around; 31 | padding:30px 0px; 32 | color: #7C7C7C; 33 | font-family: geomanist-regular, sans-serif; 34 | text-decoration: none solid rgb(124, 124, 124); 35 | font-size: 20px; 36 | margin-top: 3px; 37 | } 38 | #nav3>div>button{ 39 | padding:5px 10px; 40 | border:none; 41 | color:white; 42 | background-color: #57bb71; 43 | border-radius: 5px; 44 | } 45 | 46 | #nav3>div>a{ 47 | text-decoration: none; 48 | color: #7C7C7C; 49 | } 50 | #nav3>div>button:hover{ 51 | color:black; 52 | } 53 | #nav3>div:hover{ 54 | /* color:black; */ 55 | font-weight: bold; 56 | } 57 | #nav4>button{ 58 | padding:10px; 59 | border:none; 60 | color:white; 61 | background-color: #57bb71; 62 | border-radius: 5px; 63 | font-size: 18px; 64 | margin-left: 20px; 65 | 66 | } 67 | #nav4>button>a{ 68 | text-decoration: none; 69 | color: white; 70 | } 71 | #nav4{ 72 | justify-content: space-around; 73 | padding:30px 0px; 74 | color: #7C7C7C; 75 | font-family: geomanist-regular, sans-serif; 76 | text-decoration: none solid rgb(124, 124, 124); 77 | font-size: 20px; 78 | margin-right:50px; 79 | } 80 | #nav4>span>a{ 81 | text-decoration: none; 82 | color: #7C7C7C; 83 | } 84 | #nav4>span:hover{ 85 | color:black; 86 | font-weight: bold; 87 | } 88 | #int{ 89 | width:250px;border:1px solid black;padding:10px; 90 | background-color: white; 91 | color:#585757; 92 | font-size: 15px; 93 | } 94 | .hide>div>div:hover{ 95 | color:#57bb71; 96 | } 97 | #int>div>div>img{ 98 | width:15%; 99 | margin-right:5px; 100 | } 101 | #grid{ 102 | display:grid; 103 | grid-template-columns: repeat(2,1fr); 104 | row-gap:20px; 105 | } 106 | #grid>div>a{ 107 | color:#585757; 108 | text-decoration: none; 109 | } 110 | #grid>div>a:hover{ 111 | color:#57bb71 112 | } 113 | #inte{ 114 | margin-top:15px; 115 | border-top: 1px solid #7C7C7C; 116 | padding:10px; 117 | } 118 | .show{ 119 | display:grid; 120 | grid-template-columns: 1fr; 121 | gap:20px; 122 | } 123 | .hide{ 124 | visibility:hidden; 125 | } 126 | .show:hover .hide{ 127 | visibility:visible; 128 | } 129 | -------------------------------------------------------------------------------- /Insightly.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Insightly 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 |
18 |

Everhour + Insightly

19 |

How much time your sales people spend talking to customers on the phone? How much time do they spend managing their sales database?

20 | 21 |
22 |
23 |
24 |
25 |

Why tracking time?

26 |

With Everhour, you can add very important and clear metric into your sales process - time. How much time you spend on various types of activity, such as leads, opportunities, projects, and tasks.

27 |
28 |
29 | 30 |
31 |
32 |
33 |
34 |

How it works

35 |

After setup, Everhour natively embeds into Insightly interface. In other words, you can log time, watch progress without switching a tab.

36 |

On the other hand, we aggregate data and allow managers better analyze team activities.

37 |
38 |
39 | 40 |
41 |
42 |
43 |
44 |

Reporting

45 |

In Everhour, you can use different layouts, add / remove columns, group data on purpose and export your reports to PDF or Excel.

46 |
47 |
48 | 49 |
50 |
51 |
52 | 53 | 54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /css/Insightly.css: -------------------------------------------------------------------------------- 1 | body{ 2 | font-family:sans-serif; 3 | } 4 | #one{ 5 | width: 100%; 6 | position: relative; 7 | background-color: #fddcca4e; 8 | text-align: center; 9 | padding: 50px 35vw 100px 0vw; 10 | margin-top: 100px; 11 | } 12 | #one div{ 13 | width: 45%; 14 | margin: 0 25vw 0 25vw; 15 | } 16 | #one h1{ 17 | font-size: 50px; 18 | font-weight: lighter; 19 | } 20 | #one h2{ 21 | font-size: 25px; 22 | font-weight: lighter; 23 | } 24 | #one button{ 25 | font-size: 20px; 26 | padding: 15px 40px 15px 40px; 27 | border-radius: 25px; 28 | color: white; 29 | border-color: #ff5900; 30 | background-color: #ff5900; 31 | box-shadow: rgba(241, 91, 22, 0.959) 0px 22px 70px 4px; 32 | 33 | } 34 | #one button:hover, 35 | #one button:focus{ 36 | font-size: 20px; 37 | padding: 15px 40px 15px 40px; 38 | border-radius: 25px; 39 | background-color: #ff5900; 40 | color: white; 41 | border-color: #ff5900; 42 | box-shadow: rgba(0, 0, 0, 0.4) 0px 30px 90px; 43 | transition:5em; 44 | } 45 | /* ////////two div//////////// */ 46 | #two{ 47 | display: flex; 48 | width: 70vw; 49 | height: 200px; 50 | justify-content: space-between; 51 | margin-left: 15vw; 52 | transition: 2s; 53 | } 54 | #two div{ 55 | width: 30%; 56 | } 57 | 58 | #two img{ 59 | width: 100%; 60 | } 61 | #two h1{ 62 | color: #ff5900; 63 | line-height: 20px; 64 | } 65 | #two h3{ 66 | font-weight: lighter; 67 | line-height: 20px; 68 | } 69 | #two:hover, 70 | #two:focus { 71 | display: flex; 72 | width: 70vw; 73 | height: 200px; 74 | justify-content: space-around; 75 | margin-left: 15vw; 76 | } 77 | /* /////////////////3rd div/////////////////////// */ 78 | #three{ 79 | margin-top: 50px; 80 | display: flex; 81 | width: 70vw; 82 | height: auto; 83 | justify-content: space-between; 84 | margin-left: 15vw; 85 | transition: 2s; 86 | } 87 | #three div{ 88 | width: 30%; 89 | } 90 | 91 | #three img{ 92 | width: 100%; 93 | height: 100%; 94 | } 95 | #thre h1{ 96 | color: #ff5900; 97 | line-height: 20px; 98 | } 99 | #three h3{ 100 | font-weight: lighter; 101 | line-height: 20px; 102 | } 103 | #three:hover, 104 | #three:focus { 105 | margin-top: 50px; 106 | display: flex; 107 | width: 70vw; 108 | height: auto; 109 | justify-content: space-around; 110 | margin-left: 15vw; 111 | } 112 | /* ///////////////////4th div////////////////////// */ 113 | #four{ 114 | display: grid; 115 | width: 100%; 116 | padding-left: 17vw; 117 | margin-bottom: 100px; 118 | } 119 | 120 | #four_first{ 121 | width: 50%; 122 | margin-left: 10%; 123 | } 124 | #four_first h1{ 125 | text-align: center; 126 | } 127 | 128 | #four_second{ 129 | margin-top: 20px; 130 | } 131 | #four_second:hover, 132 | #four_second:focus{ 133 | margin-top: 100px; 134 | transition: ease; 135 | } 136 | 137 | 138 | -------------------------------------------------------------------------------- /css/demo.css: -------------------------------------------------------------------------------- 1 | #main{ 2 | width: 880px; 3 | height: 384px; 4 | margin: auto; 5 | border: 0px solid teal; 6 | margin-top: 100px; 7 | } 8 | #main>div>h1{ 9 | font-family: sans-serif; 10 | font-size: 48px; 11 | text-align: center; 12 | } 13 | #main>div>h3{ 14 | font-family: sans-serif; 15 | font-size: 22px; 16 | text-align: center; 17 | color: #767676; 18 | word-spacing: 0px; 19 | line-height: 29px; 20 | /* justify-content: center */ 21 | text-decoration: none; 22 | } 23 | 24 | #main>div>.button:hover{ 25 | background-color: #1abf68; 26 | color: white; 27 | } 28 | #main>div>button>i>img{ 29 | width: 20px; 30 | height: 20px; 31 | } 32 | small{ 33 | text-align: center; 34 | color: #7c7c7c; 35 | } 36 | 37 | 38 | 39 | 40 | button:hover{ 41 | background-color: #57bb71; 42 | color: white; 43 | } 44 | 45 | button>img{ 46 | width: 30px; 47 | } 48 | button>span{ 49 | padding: 2px; 50 | } 51 | #a>button:nth-child(1){ 52 | margin: auto; 53 | padding: 13px; 54 | width: 215px; 55 | border: 1px solid rgb(0, 128, 96); 56 | background-color: #57bb71; 57 | border-radius: 5px; 58 | color: white; 59 | font-size: 16px; 60 | margin-left: 200px; 61 | 62 | } 63 | #a>button:nth-child(2){ 64 | margin: auto; 65 | padding: 13px; 66 | width: 215px; 67 | border: 1px solid rgb(0, 128, 96); 68 | background-color: white; 69 | border-radius: 5px; 70 | color: #57bb71; 71 | font-size: 16px; 72 | margin-left: 20px; 73 | 74 | } 75 | #main2{ 76 | width: 536px; 77 | height: 629px; 78 | border: 0px solid red; 79 | margin: auto; 80 | padding: 56px 56px 56px 56px; 81 | line-height: 27px; 82 | font-size: 18px; 83 | text-align: left; 84 | color: #7c7c7c; 85 | font-family: sans-serif; 86 | box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; 87 | } 88 | #main2:hover{ 89 | box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px; 90 | } 91 | #main2>h4{ 92 | color: #333333; 93 | } 94 | #ch{ 95 | width: 50%; 96 | border: 0px solid teal; 97 | margin: auto; 98 | text-align: center; 99 | font-family: 'Nunito', sans-serif; 100 | font-family: 'Oleo Script Swash Caps', cursive; 101 | font-family: 'Open Sans', sans-serif; 102 | font-family: 'Roboto', sans-serif; 103 | /* text-align: start; */ 104 | /* margin-left: 20px; */ 105 | margin-top: 150px; 106 | } 107 | #ch>p,h3{ 108 | color: #767676; 109 | font-size: 20px; 110 | } 111 | button{ 112 | /* display: block; */ 113 | /* margin: auto; */ 114 | height: 48px; 115 | padding: 15px; 116 | width: 152px; 117 | border: 0px solid rgb(0, 128, 96); 118 | background-color: #57bb71; 119 | border-radius: 5px; 120 | color:white; 121 | font-size: 16px; 122 | cursor: pointer; 123 | } 124 | 125 | input{ 126 | height: 48px; 127 | /* padding: 15px; */ 128 | width: 340px; 129 | border: 1px solid rgb(0, 128, 96); 130 | /* background-color: #57bb71; */ 131 | border-radius: 5px; 132 | color:white; 133 | font-size: 16px; 134 | 135 | } -------------------------------------------------------------------------------- /css/GitLab.css: -------------------------------------------------------------------------------- 1 | body{ 2 | /* background: #F6FBF7; */ 3 | font-family:sans-serif; 4 | } 5 | /* //////////1st div////////////// */ 6 | #one{ 7 | text-align: center; 8 | width: 50vw; 9 | height: 60vh; 10 | margin: 0 25% 0 30% ; 11 | 12 | } 13 | #one h1{ 14 | font-size: 40px; 15 | 16 | } 17 | #one h2{ 18 | font-size: 21px; 19 | font-weight: lighter; 20 | color: #767676; 21 | } 22 | button{ 23 | padding: 10px; 24 | color: rgb(37, 143, 37); 25 | border: 1px solid rgb(37, 143, 37); 26 | border-radius: 5px; 27 | } 28 | button:hover, 29 | button:focus{ 30 | padding: 10px; 31 | color: white; 32 | border: 1px solid solid rgb(37, 143, 37); 33 | background-color: rgb(37, 143, 37); 34 | border-radius: 5px; 35 | } 36 | #one p{ 37 | color: #767676; 38 | } 39 | /* //////////////video div////////// */ 40 | #video { 41 | width: 60%; 42 | margin: 0 20% 0 25%; 43 | 44 | } 45 | /* //////////////2nd div//////////// */ 46 | #two{ 47 | display: flex; 48 | width: 80%; 49 | margin:0 10% 50px 20%; 50 | /* height: 300px; */ 51 | } 52 | #two img{ 53 | width: 100%; 54 | height: 70%; 55 | } 56 | #sub{ 57 | width: 90%; 58 | display: grid; 59 | grid-template-columns: repeat(2,1fr); 60 | 61 | margin-left: 10%; 62 | } 63 | #sub p{ 64 | color: #767676; 65 | line-height: 20px; 66 | } 67 | /* //////////////3rd div///////////// */ 68 | #three{ 69 | margin-top: 20px; 70 | width: 60%; 71 | position: relative; 72 | left: 25vw; 73 | } 74 | #three img{ 75 | width: 100%; 76 | } 77 | #three h3{ 78 | line-height: 30px; 79 | font-weight: lighter; 80 | } 81 | /* ////////////4th div///////////// */ 82 | #fourth{ 83 | display: flex; 84 | position: relative; 85 | gap: 10px; 86 | width: 70vw; 87 | left: 20vw; 88 | margin: 50px 0 50px 0; 89 | } 90 | #fourth img{ 91 | height: 50px; 92 | align-self: center; 93 | } 94 | #five { 95 | 96 | display: flex; 97 | position: relative; 98 | width: 80vw; 99 | left: 20vw; 100 | gap: 20px; 101 | height: 400px; 102 | } 103 | #five_first{ 104 | width: 40%; 105 | } 106 | #five_first img{ 107 | height: 80%; 108 | } 109 | .five_sub{ 110 | display: flex; 111 | } 112 | .five_sub p{ 113 | width: 90%; 114 | } 115 | .five_sub button{ 116 | border: transparent; 117 | background-color: transparent; 118 | } 119 | /* /////////////6th div //////////// */ 120 | #six{ 121 | margin: 110px 20vw 0 20vw; 122 | text-align: center; 123 | width: 60vw; 124 | display: grid; 125 | 126 | } 127 | #six img{ 128 | width: 10%; 129 | height: 50px; 130 | } 131 | /* //////////////7th div///////////// */ 132 | #seven{ 133 | display: grid; 134 | grid-template-columns: repeat(3,1fr); 135 | position: relative; 136 | width: 70vw; 137 | gap: 50px; 138 | left: 25vw; 139 | margin-bottom: 20px; 140 | } 141 | #seven div{ 142 | box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 143 | 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px; 144 | padding: 10px; 145 | } 146 | #Keep_reading{ 147 | 148 | height: auto; 149 | position: relative; 150 | text-align: center; 151 | margin-bottom: 50px; 152 | left: 10vw; 153 | } 154 | #eight{ 155 | display: flex; 156 | position: relative; 157 | gap: 300px; 158 | left: 30vw; 159 | margin-bottom: 100px; 160 | 161 | } 162 | #eight img{ 163 | width: 40px; 164 | height: 40px; 165 | } 166 | #eight_sub1{ 167 | display: flex; 168 | } 169 | 170 | ul.eight_2nd{ 171 | list-style-type: circle; 172 | line-height: 40px; 173 | } 174 | #eight p{ 175 | font-size: 20px; 176 | } 177 | #eight li{ 178 | font-size: 20px; 179 | } 180 | 181 | -------------------------------------------------------------------------------- /css/GitHub.css: -------------------------------------------------------------------------------- 1 | body{ 2 | /* background: #F6FBF7; */ 3 | font-family:sans-serif; 4 | } 5 | /* //////////1st div////////////// */ 6 | #one{ 7 | text-align: center; 8 | width: 50vw; 9 | height: 60vh; 10 | margin: 0 25% 0 30% ; 11 | 12 | } 13 | #one h1{ 14 | font-size: 40px; 15 | 16 | } 17 | #one h2{ 18 | font-size: 21px; 19 | font-weight: lighter; 20 | color: #767676; 21 | } 22 | button{ 23 | padding: 10px; 24 | color: rgb(37, 143, 37); 25 | border: 1px solid rgb(37, 143, 37); 26 | border-radius: 5px; 27 | } 28 | button:hover, 29 | button:focus{ 30 | padding: 10px; 31 | color: white; 32 | border: 1px solid solid rgb(37, 143, 37); 33 | background-color: rgb(37, 143, 37); 34 | border-radius: 5px; 35 | } 36 | #one p{ 37 | color: #767676; 38 | } 39 | /* //////////////video div////////// */ 40 | #video { 41 | width: 60%; 42 | margin: 0 20% 0 25%; 43 | 44 | } 45 | /* //////////////2nd div//////////// */ 46 | #two{ 47 | display: flex; 48 | width: 80%; 49 | margin:0 10% 50px 20%; 50 | /* height: 300px; */ 51 | } 52 | #two img{ 53 | width: 100%; 54 | height: 70%; 55 | } 56 | #sub{ 57 | width: 90%; 58 | display: grid; 59 | grid-template-columns: repeat(2,1fr); 60 | 61 | margin-left: 10%; 62 | } 63 | #sub p{ 64 | color: #767676; 65 | line-height: 20px; 66 | } 67 | /* //////////////3rd div///////////// */ 68 | #three{ 69 | margin-top: 20px; 70 | width: 60%; 71 | position: relative; 72 | left: 25vw; 73 | } 74 | #three img{ 75 | width: 100%; 76 | } 77 | #three h3{ 78 | line-height: 30px; 79 | font-weight: lighter; 80 | } 81 | /* ////////////4th div///////////// */ 82 | #fourth{ 83 | display: flex; 84 | position: relative; 85 | gap: 10px; 86 | width: 70vw; 87 | left: 20vw; 88 | margin: 50px 0 50px 0; 89 | } 90 | #fourth img{ 91 | height: 50px; 92 | align-self: center; 93 | } 94 | #five { 95 | 96 | display: flex; 97 | position: relative; 98 | width: 80vw; 99 | left: 20vw; 100 | gap: 20px; 101 | height: 400px; 102 | } 103 | #five_first{ 104 | width: 40%; 105 | } 106 | #five_first img{ 107 | height: 80%; 108 | } 109 | .five_sub{ 110 | display: flex; 111 | } 112 | .five_sub p{ 113 | width: 90%; 114 | } 115 | .five_sub button{ 116 | border: transparent; 117 | background-color: transparent; 118 | } 119 | /* /////////////6th div //////////// */ 120 | #six{ 121 | margin: 110px 20vw 0 20vw; 122 | text-align: center; 123 | width: 60vw; 124 | display: grid; 125 | 126 | } 127 | #six img{ 128 | width: 10%; 129 | height: 50px; 130 | } 131 | /* //////////////7th div///////////// */ 132 | #seven{ 133 | display: grid; 134 | grid-template-columns: repeat(3,1fr); 135 | position: relative; 136 | width: 70vw; 137 | gap: 50px; 138 | left: 25vw; 139 | margin-bottom: 20px; 140 | } 141 | #seven div{ 142 | box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 143 | 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px; 144 | padding: 10px; 145 | } 146 | #Keep_reading{ 147 | height: auto; 148 | position: relative; 149 | text-align: center; 150 | margin-bottom: 50px; 151 | left: 10vw; 152 | } 153 | #eight{ 154 | display: flex; 155 | position: relative; 156 | gap: 300px; 157 | left: 30vw; 158 | margin-bottom: 100px; 159 | 160 | } 161 | #eight img{ 162 | width: 40px; 163 | height: 40px; 164 | } 165 | #eight_sub1{ 166 | display: flex; 167 | } 168 | 169 | ul.eight_2nd{ 170 | list-style-type: circle; 171 | line-height: 40px; 172 | } 173 | #eight p{ 174 | font-size: 20px; 175 | } 176 | #eight li{ 177 | font-size: 20px; 178 | } 179 | 180 | -------------------------------------------------------------------------------- /css/integration.css: -------------------------------------------------------------------------------- 1 | #header{ 2 | width: 60%; 3 | border: 0px solid teal; 4 | margin: auto; 5 | text-align: center; 6 | margin-top: 100px; 7 | font-family: 'Nunito', sans-serif; 8 | font-family: 'Oleo Script Swash Caps', cursive; 9 | font-family: 'Roboto', sans-serif; 10 | font-size: 20px; 11 | } 12 | #header>p{ 13 | color: #767676; 14 | font-size: 20px; 15 | } 16 | #box{ 17 | width: 85%; 18 | border: 0px solid teal; 19 | height: 1500px; 20 | margin: auto; 21 | margin-top: 200px; 22 | display: grid; 23 | grid-template-columns: repeat(4,1fr); 24 | gap: 20px; 25 | } 26 | #box>div{ 27 | width: 260.5px; 28 | /* border: 1px solid red ; */ 29 | box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px; 30 | border-radius: 5px; 31 | height: 244px; 32 | } 33 | 34 | #box>div>div:nth-child(1){ 35 | width: 80px; 36 | border: 0px solid teal; 37 | padding: 20px; 38 | margin: auto; 39 | margin-top: 20px; 40 | } 41 | #box>div>div:nth-child(2){ 42 | width: 247px; 43 | border-top: 1px solid rgb(230, 236, 236); 44 | /* padding: 20px; */ 45 | margin: auto; 46 | height: 68px; 47 | margin-top: 27px; 48 | font-family: 'Nunito', sans-serif; 49 | font-family: 'Oleo Script Swash Caps', cursive; 50 | font-family: 'Open Sans', sans-serif; 51 | font-family: 'Roboto', sans-serif; 52 | text-align: start; 53 | margin-left: 20px; 54 | 55 | } 56 | 57 | @keyframes bounce { 58 | 0%, 100%, 20%, 50%, 80% { 59 | -webkit-transform: translateY(0); 60 | -ms-transform: translateY(0); 61 | transform: translateY(0) 62 | } 63 | 40% { 64 | -webkit-transform: translateY(-30px); 65 | -ms-transform: translateY(-30px); 66 | transform: translateY(-30px) 67 | } 68 | 60% { 69 | -webkit-transform: translateY(-15px); 70 | -ms-transform: translateY(-15px); 71 | transform: translateY(-15px) 72 | } 73 | } 74 | #box>div{ 75 | position: relative; 76 | /* top: 50%; */ 77 | /* left: 50%; */ 78 | /* height: 180px; */ 79 | /* width: 180px; */ 80 | /* background-color: red; */ 81 | /* border-radius: 50%; */ 82 | /* line-height: 180px; */ 83 | text-align: center; 84 | /* text-transform: uppercase; */ 85 | -webkit-animation-duration: 1s; 86 | animation-duration: 1s; 87 | -webkit-animation-fill-mode: both; 88 | animation-fill-mode: both; 89 | -webkit-animation-timing-function: ease-in-out; 90 | animation-timing-function: ease-in-out; 91 | animation-iteration-count: infinite; 92 | -webkit-animation-iteration-count: infinite; 93 | /* color: white; */ 94 | } 95 | #box>div:hover{ 96 | cursor: pointer; 97 | animation-name: bounce; 98 | -moz-animation-name: bounce; 99 | border: 1px solid teal; 100 | } 101 | #ch{ 102 | width: 50%; 103 | border: 0px solid teal; 104 | margin: auto; 105 | text-align: center; 106 | font-family: 'Nunito', sans-serif; 107 | font-family: 'Oleo Script Swash Caps', cursive; 108 | font-family: 'Open Sans', sans-serif; 109 | font-family: 'Roboto', sans-serif; 110 | /* text-align: start; */ 111 | /* margin-left: 20px; */ 112 | margin-top: 150px; 113 | } 114 | #ch>p,h3{ 115 | color: #767676; 116 | font-size: 20px; 117 | } 118 | button{ 119 | /* display: block; */ 120 | /* margin: auto; */ 121 | height: 48px; 122 | padding: 15px; 123 | width: 152px; 124 | border: 0px solid rgb(0, 128, 96); 125 | background-color: #57bb71; 126 | border-radius: 5px; 127 | color:white; 128 | font-size: 16px; 129 | cursor: pointer; 130 | } 131 | 132 | input{ 133 | height: 48px; 134 | /* padding: 15px; */ 135 | width: 340px; 136 | border: 1px solid rgb(0, 128, 96); 137 | /* background-color: #57bb71; */ 138 | border-radius: 5px; 139 | color:white; 140 | font-size: 16px; 141 | 142 | } 143 | -------------------------------------------------------------------------------- /css/login.css: -------------------------------------------------------------------------------- 1 | #content{ 2 | width: 100%; 3 | height: auto; 4 | font-family: sans-serif; 5 | } 6 | a{ 7 | color: #5d95e2; 8 | } 9 | #one h1{ 10 | font-size: 40px; 11 | font-weight: lighter; 12 | } 13 | #one{ 14 | margin-top: 100px; 15 | text-align: center; 16 | } 17 | #one h3{ 18 | color: #877676; 19 | font-weight: lighter; 20 | } 21 | #one_span{ 22 | border-bottom: 1px dashed; 23 | } 24 | span{ 25 | 26 | border-bottom: 1px solid; 27 | border-color:rgb(220,180,140); 28 | color: #877676; 29 | font-size: 15px; 30 | } 31 | /* //////////////two////////////// */ 32 | #two{ 33 | width: 66%; 34 | margin: 50px 15% 50px 15%; 35 | display: flex; 36 | justify-content: space-around; 37 | box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; 38 | padding: 50px 20px 50px 20px; 39 | } 40 | #two>div{ 41 | width: 40%; 42 | } 43 | #two_one{ 44 | text-align: center; 45 | } 46 | #two_one p{ 47 | color: #877676; 48 | font-size: 17px; 49 | font-weight: lighter; 50 | } 51 | .login_google{ 52 | width: 80%; 53 | height: 40px; 54 | margin: 10px 10% 10px 10%; 55 | display: flex; 56 | align-items: center; 57 | justify-content: space-around; 58 | background-color: transparent; 59 | border-radius: 3px; 60 | border: 1px solid rgb(135, 131, 131); 61 | color: #877676; 62 | font-weight: lighter; 63 | } 64 | .login_google img{ 65 | width: 30px; 66 | height: 30px; 67 | } 68 | 69 | #email{ 70 | width: 80%; 71 | height: 40px; 72 | margin: 10px 10% 10px 10%; 73 | border-radius: 3px; 74 | border: 1px solid rgb(72, 68, 68); 75 | font-size: 17px; 76 | font-weight: lighter; 77 | } 78 | 79 | #password{ 80 | width: 80%; 81 | height: 40px; 82 | margin: 10px 10% 10px 10%; 83 | border-radius: 3px; 84 | border: 1px solid rgb(72, 68, 68); 85 | font-size: 17px; 86 | font-weight: lighter; 87 | } 88 | 89 | 90 | #two_two p{ 91 | margin-top: -10px; 92 | color: #877676; 93 | line-height: 47px; 94 | } 95 | #two_two h4{ 96 | 97 | margin-bottom: 15px; 98 | font-size: 17px; 99 | font-weight: lighter; 100 | line-height: 20px; 101 | } 102 | #login{ 103 | width: 40%; 104 | padding: 15px 0 15px 0; 105 | background-color: #57bb71; 106 | color: white; 107 | border-radius: 5px ; 108 | border: 0px; 109 | } 110 | #login:hover, 111 | #login:focus{ 112 | width: 40%; 113 | padding: 15px 0 15px 0; 114 | background-color: #57bb71; 115 | color: white; 116 | border-radius: 5px ; 117 | border: 0px; 118 | box-shadow: #57bb71 0px 5px 15px; 119 | border: 1px solid rgb(87,187,113); 120 | } 121 | 122 | #three{ 123 | text-align: center; 124 | width: 100%; 125 | height: auto; 126 | 127 | } 128 | #three>div{ 129 | width: 36%; 130 | margin: 0 32% 0 32%; 131 | } 132 | #three h1{ 133 | font-size: 40px; 134 | font-weight: lighter; 135 | } 136 | #three h3{ 137 | font-weight: lighter; 138 | color: #877676; 139 | } 140 | #three_sub{ 141 | display: flex; 142 | width: 100%; 143 | justify-content: flex-end; 144 | margin-bottom: 20px; 145 | } 146 | #three_sub>div{ 147 | height: 100%; 148 | width: fit-content; 149 | } 150 | #three_email{ 151 | display: flex; 152 | gap: 20px; 153 | 154 | } 155 | #email_three{ 156 | width:400px ; 157 | border-radius: 5px; 158 | font-size: 17px; 159 | border: 1px solid rgb(87,187,113); 160 | } 161 | #three_try_it_free{ 162 | width: 200px; 163 | height: 60px; 164 | border-radius: 5px; 165 | border: 0px; 166 | background-color: #57bb71; 167 | color: white; 168 | font-size: 17px; 169 | } 170 | #three_try_it_free:hover, 171 | #three_try_it_free:focus{ 172 | width: 200px; 173 | height: 60px; 174 | background-color: #57bb71; 175 | color: white; 176 | border-radius: 5px ; 177 | border: 0px; 178 | box-shadow: #57bb71 0px 5px 15px; 179 | border-color: #57bb71; 180 | } 181 | 182 | #three_sub2{ 183 | display: flex; 184 | width: 100%; 185 | text-align: center; 186 | justify-content: center; 187 | margin: 50px 0 0 0; 188 | } 189 | #three_google{ 190 | display: flex; 191 | align-items: center; 192 | gap: 10px; 193 | justify-content: center; 194 | font-size: 17px; 195 | border: 0px; 196 | background-color: transparent; 197 | color: #877676; 198 | } 199 | 200 | #three_google img{ 201 | width: 30px; 202 | height: 30px; 203 | } 204 | hr{ 205 | border: 1px solid #fce7e7; 206 | } -------------------------------------------------------------------------------- /components_2/footer.js: -------------------------------------------------------------------------------- 1 | function footer(){ 2 | return `
3 |
4 | 5 |
6 |

Company

7 |
8 |

about us

9 |

Contact

10 | 11 |
12 |
13 |

Product

14 |
15 |

Tour

16 |

Pricing

17 |

Reqest a demo

18 |

Customers

19 |

API & does

20 |

Status

21 |
22 | 34 |

Integrations

35 |
36 |

Asana

37 |

Basecamp

38 |

Trello

39 |

Jira

40 |

Github

41 |

Clickup

42 |

Monday

43 |

Notion

44 |

Todoist

45 |

GitLab

46 |

All

47 | 48 |
49 | 61 | 69 | 70 |
71 |
72 |
73 |

© 2022 Everhour Terms| Privacy| Cookies | Sitemap

74 |
75 |
76 | 77 | 78 | 79 | 80 | 81 |
82 | 83 |
84 | 85 |
86 | 87 | ` 88 | } 89 | 90 | export default footer -------------------------------------------------------------------------------- /login.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | Login 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 |
22 |
23 |

Log in to Everhour

24 |

Using the former version of Everhour? Please login here

25 |
26 |
27 |
28 | 32 |

or

33 |
34 |
35 | 36 |
37 |
38 | 39 | 40 |

41 | Login with SSO 42 |

43 |

44 | Reset Password 45 |

46 |
47 |
48 |
49 |

50 |

NEWS

51 |

Integration with Todoist

52 |

Everhour now integrates with Todoist! Learn more

53 |

54 |

55 |

Integration with Notion 56 |

57 |

Everhour now integrates with Notion! Learn more

58 |

59 |

60 |

Single Sign-On

61 |

Use single sign-on (SSO) to access Everhour for your

62 |

projects and timesheets. Learn more

63 |

64 |
65 | 66 |
67 |
68 |
69 |
70 |

New to Everhour?

71 |

Try Everhour for free and see if it works for your business

72 |
73 |
74 | 75 | 76 | 77 |
78 | 79 |
80 |
81 |
82 | 86 |
87 |
88 |
89 | 90 |
91 |
92 |
93 | 94 |
95 | 96 | 97 | 98 | 99 | -------------------------------------------------------------------------------- /slack.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Timesheets, Timecards and Time Off in Slack - Everhour 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 |
19 | 23 |
24 |

Everhour + Slack

25 |

Keep track of your project timesheets, working hours, and paid time off inside Slack

26 |
27 |
28 |
image9
29 |
30 | 31 |
32 |
33 |

How Everhour integrates with Slack?

34 |

Receive daily and weekly messages in your Slack channel about all the work done 35 | by your team including clock-in, clock-out, and time off

36 |
37 |
38 |
39 | 40 |
41 |
1
42 |

Daily and weekly timeheets

43 |

Every day and once a week you receive a message 44 | with a list of tasks that your employee worked on and the total time worked.

45 |
46 |
2
47 |

Clock-in and clock-out

48 |

Regardless of whether the employee worked on the project tasks, you can see their working hours.

49 |
50 |
3
51 |

Paid time off

52 |

Everyone who had approved time off for a day will be displayed in a separate block with the concrete type PTO.

53 |
54 |
55 | 56 |
57 |
58 |

4.5 / 5 that's how people rate Everhour. See what 300+ reviewers are saying 59 | about us on popular platforms, such as Capterra, G2Crowd, or TrustRadius.Read what real people say.

60 |
61 | 62 |
63 |
64 |

What else Everhour can do for you?

65 |

Besides our handy Slack integration, you will get access to
66 | many useful features through our site

67 |
68 |
69 | 70 | 71 | 72 | 73 | 74 |
75 |
76 |

Let's get you started

77 |

Try Everhour for free and see if it works for your business

78 | 79 | 80 |
81 | Or sign up with Google Account
82 | 83 |
84 |
85 |
  • Track time from the apps you already use
  • 86 |
  • Know where your team’s time is going
  • 87 |
  • Keep projects on budget
  • 88 |
  • Increase transparency
  • 89 |
  • Make your workflow more efficient
  • 90 |
  • Spot burnout before it happens
  • 91 |
    92 |
    93 | 94 | 95 | 96 | 97 | 98 | 99 | -------------------------------------------------------------------------------- /navbar.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | navbar 10 | 106 | 107 | 108 | 142 | 143 | -------------------------------------------------------------------------------- /components_2/foot.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |
    13 |
    14 | 15 |
    16 |

    Company

    17 |

    about us

    18 |

    Contact

    19 | 20 |
    21 |
    22 |

    Product

    23 |

    Tour

    24 |

    Pricing

    25 |

    Reqest a demo

    26 |

    Customers

    27 |

    API & does

    28 |

    Status

    29 |
    30 | 41 |

    Integrations

    42 |

    Asana

    43 |

    Basecamp

    44 |

    Trello

    45 |

    Jira

    46 |

    Github

    47 |

    Clickup

    48 |

    Monday

    49 |

    Notion

    50 |

    Todoist

    51 |

    GitLab

    52 |

    All

    53 | 54 |
    55 | 66 | 73 | 74 |
    75 |
    76 |
    77 |

    © 2022 Everhour Terms| Privacy| Cookies | Sitemap

    78 |
    79 |
    80 | 81 | 82 | 83 | 84 | 85 |
    86 | 87 |
    88 | 89 |
    90 | 91 | 92 | 93 | 94 | 95 | 96 | -------------------------------------------------------------------------------- /quickbook.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Timesheets, Timecards and Time Off in Slack - Everhour 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
    20 |
    21 | 25 |
    26 |

    Everhour + Slack

    27 |

    Keep track of your project timesheets, working hours, and paid time off inside Slack

    28 |
    29 |
    30 |
    image9
    31 |
    32 | 33 |
    34 |
    35 |

    How Everhour integrates with Slack?

    36 |

    Receive daily and weekly messages in your Slack channel about all the work done 37 | by your team including clock-in, clock-out, and time off

    38 |
    39 |
    40 |
    41 | 42 |
    43 |
    1
    44 |

    Sync clients

    45 |

    We will automatically sync all your existing clients so you don’t have to manage clients in several places.

    46 |
    47 |
    2
    48 |

    Copy invoices to QuickBooks

    49 |

    You can create an invoice for billable hours and expenses. We'll copy this invoice as a draft to QuickBooks.

    50 |
    51 |
    3
    52 |

    Paid time off

    53 |

    We will keep synching and display up-to-date invoice status, number, issue date and invoice amount on our invoices page.

    54 |
    55 |
    56 | 57 |
    58 |
    59 |

    4.5 / 5 that's how people rate Everhour. See what 300+ reviewers are saying 60 | about us on popular platforms, such as Capterra, G2Crowd, or TrustRadius.Read what real people say.

    61 |
    62 | 63 |
    64 |
    65 |

    What else Everhour can do for you?

    66 |

    Besides our handy Slack integration, you will get access to
    67 | many useful features through our site

    68 |
    69 |
    70 | 71 | 72 | 73 | 74 | 75 |
    76 |
    77 |

    Let's get you started

    78 |

    Try Everhour for free and see if it works for your business

    79 | 80 | 81 |
    82 | Or sign up with Google Account
    83 | 84 |
    85 |
    86 |
  • Track time from the apps you already use
  • 87 |
  • Know where your team’s time is going
  • 88 |
  • Keep projects on budget
  • 89 |
  • Increase transparency
  • 90 |
  • Make your workflow more efficient
  • 91 |
  • Spot burnout before it happens
  • 92 |
    93 |
    94 | 95 | 96 | 97 | 98 | 99 | 112 | -------------------------------------------------------------------------------- /demo.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Request Free Everhour Demo 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 |
    21 |
    22 |

    Book a 30-min live demo

    23 |

    10+ users? Let one of our customer success experts show you how Everhour
    works, with plenty of time set aside for questions

    24 |
    25 |
    26 | 27 |
    28 | 29 | 30 |
    31 |
    32 |
    33 |

    What you’ll learn

    34 |
    39 |

    Other information 40 |

    41 | 47 | 48 | 49 |
    50 |
    51 |

    Let’s get you started

    52 |

    Try Everhour for free and see if it works for your business

    53 | 54 | 55 |

    Or sign up with Google Account

    56 | 57 |
    58 | 59 | 60 | 61 | 62 | 63 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Everhour -- intutive Time Tracker & Timesheets for Teams 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 |
    21 |
    22 |

    4.5 (500+ reviews)

    23 |
    24 | 25 |
    26 |
    27 |

    Powerful time tracking software with
    hassle-free integrations

    28 |

    Accurate time tracker for budgeting, client invoicing and painless payroll.
    29 | Works with the apps your team already use

    30 | 31 | 32 |
    33 | Or sign up with Google Account
    34 | 35 |
    36 |
    37 | 38 | 39 | 40 | 41 | 42 |

    Track time and watch progress inside
    the most popular apps

    43 | 44 | 54 | 55 | 56 |
    57 |
    58 |
    59 |
    60 |
    61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 |
    70 | 73 |
    74 | 75 | 76 |
    77 |
    1
    78 |

    Quick setup

    79 |

    Connect Everhour with your tool and start tracking time right away. No manual project setup required.

    80 |
    81 |
    2
    82 |

    Native integration

    83 |

    Time tracking controls natively appears inside your project management tool, making it easy to track time.

    84 |
    85 |
    3
    86 |

    Automatic updates

    87 |

    Everhour syncs changes automatically. That means your reports will always show the freshest data.

    88 |
    89 |
    90 | 91 |
    92 |
    93 |

    Everhour has helped 240,000+ people complete over 135 million tasks in 3 million projects

    94 |
    95 |
    96 |

    97 | Everhour helps us track our engineering hours which is a requirement for several Government 98 | grants we have received. Without Everhour, we would be unable to accurately track the hours 99 | associated with each individual project we are working on as a company. The reports are easily 100 | customizable which allows me to extract the data I need. Everhour is a great tool for our time 101 | tracking needs!

    102 |

    Kelly Bonneau, CPA

    103 |

    Accounting Manager at 7shifts

    104 | Read more reviews 105 |
    106 |
    107 |
    108 |
    109 |
    110 | 111 | 112 | 113 | 114 | 115 |
    116 |
    117 |

    Take control of your time with Everhour

    118 |

    Beautiful integrations. Intuitive interface. No unexpected fees

    119 | 120 | 121 |
    122 | Or sign up with Google Account
    123 | 124 |
    125 |
    126 |
  • Track time from the apps you already use
  • 127 |
  • Know where your team’s time is going
  • 128 |
  • Keep projects on budget
  • 129 |
  • Increase transparency
  • 130 |
  • Make your workflow more efficient
  • 131 |
  • Spot burnout before it happens
  • 132 |
    133 |
    134 | 135 | 136 | 137 | 138 | 139 | -------------------------------------------------------------------------------- /signup.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Sign up to Everhour 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
    19 |

    Make your team more productive with Everhour

    20 |

    Join 3,500+ customers who use Everhour to track time and plan their future projects more effectively

    21 | 22 |
    23 |
    24 | 25 | 26 |
    27 | 28 | 29 | 30 |

    31 | 32 |
    33 |
    34 |

    35 |

    36 | 37 |

    38 | 39 |
    40 | 41 |
    42 |

    Free to try • No credit card required • 1-minute signup

    43 |
    44 | 45 | 46 | 47 | 48 | 49 | 86 | 87 | -------------------------------------------------------------------------------- /css/Notion.css: -------------------------------------------------------------------------------- 1 | #top{ 2 | background-color: #F6FBF7; 3 | height: 500px; 4 | } 5 | #one{ 6 | 7 | width: 50%; 8 | height: 300px; 9 | margin: auto; 10 | margin-top: 140px; 11 | text-align: center; 12 | color: #333333; 13 | font-family: geomanist-regular, sans-serif; 14 | } 15 | #one>h1{ 16 | font-size: 45px; 17 | font-weight: bold; 18 | } 19 | #one>p{ 20 | font-size: 21px; 21 | color: #767676; 22 | } 23 | #one>div>button{ 24 | margin-top: 10px; 25 | height: 48px; 26 | width: 240px; 27 | color: #57BB71; 28 | background-color: white ; 29 | border: 1px solid #57BB71; 30 | border-radius: 4px; 31 | font-size: 16px; 32 | 33 | } 34 | #one>div>button>img{ 35 | width: 20px; 36 | position: relative; 37 | top: 3px; 38 | right: 8px; 39 | } 40 | #one>div>button:hover { 41 | background-color: #18A558; 42 | color: white; 43 | } 44 | #two{ 45 | margin-top: -89px; 46 | position: relative; 47 | width: 100%; 48 | height: 650px; 49 | } 50 | .img1{ 51 | position: relative; 52 | top: -170px; 53 | left: 1000px; 54 | } 55 | .img2{ 56 | position: absolute; 57 | top: -110px; 58 | left: 260px; 59 | width: 65%; 60 | height: 90%; 61 | } 62 | .ek{ 63 | position: absolute; 64 | width: 63px; 65 | height: 35px; 66 | top: 220px; 67 | right: 760px; 68 | background-color: white; 69 | } 70 | .ek:hover{ 71 | width: 70px; 72 | height: 40px; 73 | border: 5px solid #57BB71 ; 74 | border-radius: 30px; 75 | box-shadow: #57BB71 0px 5px 15px; 76 | 77 | } 78 | #three{ 79 | display: flex; 80 | font-family: geomanist-regular, sans-serif; 81 | height: 600px; 82 | } 83 | .thr{ 84 | margin-left: 200px; 85 | } 86 | .thr>h1{ 87 | color: #333333; 88 | font-size: 35px; 89 | width: 400px; 90 | } 91 | 92 | .thr>img{ 93 | width: 340px; 94 | } 95 | .thru{ 96 | display: grid; 97 | grid-template-columns: repeat(2,300px); 98 | grid-template-rows: repeat(3,150px); 99 | grid-gap: 40px; 100 | margin: 10px 0px 0px 100px; 101 | } 102 | .thru{ 103 | color: #333333; 104 | font-weight: lighter; 105 | } 106 | 107 | .thru>div>p{ 108 | color: #6f747b; 109 | } 110 | .thru>div>p>span{ 111 | background-color: #FBF9A9; 112 | } 113 | #list{ 114 | color: #333333; 115 | width: 50%; 116 | margin: auto; 117 | text-align: left; 118 | font-family: geomanist-regular, sans-serif; 119 | margin-top: 140px; 120 | } 121 | a{ 122 | color: royalblue; 123 | } 124 | #list>h3{ 125 | margin-top: 30px; 126 | font-size: large; 127 | } 128 | #list>p{ 129 | font-size: 19px; 130 | } 131 | #list>p>span{ 132 | background-color: #FDFBC0; 133 | } 134 | #list>img{ 135 | width: 95%; 136 | margin-bottom: 40px; 137 | } 138 | #rate{ 139 | display: flex; 140 | height: 120px; 141 | margin-top: 80px; 142 | background-color: #F6FBF7; 143 | } 144 | #rate>img{ 145 | width: 150px; 146 | height: 75px; 147 | margin: 20px 0px 0px 330px; 148 | } 149 | #rate>p{ 150 | margin: 40px 0px 0px 20px; 151 | width: 700px; 152 | color: #7C7C7C; 153 | font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;; 154 | font-size: large; 155 | } 156 | #QA{ 157 | background-color: white; 158 | display: flex; 159 | font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;; 160 | 161 | } 162 | #QA>div{ 163 | margin: 100px 0px 60px 160px ; 164 | width: 30%; 165 | height: 600px; 166 | } 167 | #QA>div>h1{ 168 | color: #333333; 169 | font-weight: 600; 170 | } 171 | #QA>div>p{ 172 | width: 530px; 173 | color: #767676; 174 | font-size: 19px; 175 | } 176 | #QA>div>img{ 177 | width: 480px; 178 | } 179 | 180 | #drig{ 181 | text-align: left; 182 | margin-top: 10px; 183 | height:80%; 184 | display: grid; 185 | grid-template-columns: 1fr; 186 | width: 600px; 187 | } 188 | #drig>div{ 189 | margin-top: 30px; 190 | cursor: pointer; 191 | border-bottom: 0.5px #57bb71 solid; 192 | } 193 | .hide>p>span{ 194 | color: royalblue; 195 | } 196 | .hide{ 197 | display:none; 198 | } 199 | .show:hover + .hide{ 200 | display:block; 201 | } 202 | .show{ 203 | color: #333333; 204 | color: rgb(51, 51, 51); 205 | background-color: #000000; 206 | background-color: rgba(0, 0, 0, 0); 207 | font-family: geomanist-book, sans-serif; 208 | font-size: 20px; 209 | line-height: 43.92px; 210 | vertical-align: baseline; 211 | letter-spacing: normal; 212 | word-spacing: 0px; 213 | font-weight: 400; 214 | font-style: normal; 215 | font-variant: normal; 216 | text-transform: none; 217 | text-decoration: none solid rgb(51, 51, 51); 218 | text-indent: 0px; 219 | } 220 | .hide{ 221 | color: #7C7C7C; 222 | line-height: 28px; 223 | vertical-align: baseline; 224 | letter-spacing: normal; 225 | font-weight: 400; 226 | font-style: normal; 227 | font-variant: normal; 228 | text-transform: none; 229 | text-decoration: none solid rgb(51, 51, 51); 230 | text-align: left; 231 | text-indent: 0px; 232 | font-family: sans-serif; 233 | font-size: 16px; 234 | } 235 | .info{ 236 | color: #7C7C7C; 237 | text-align: center; 238 | font-size: 19px; 239 | background-color: white; 240 | } 241 | #brand{ 242 | width: 100%; 243 | text-align: center; 244 | height: auto; 245 | background-color: white; 246 | } 247 | #brand>div{ 248 | display: grid; 249 | width: 80%; 250 | margin: 20px 15% 30px 10%; 251 | gap: 30px; 252 | grid-template-columns: repeat(10,1fr); 253 | background-color: white; 254 | } 255 | #brand img{ 256 | width: 90%; 257 | height: 80px; 258 | } 259 | #lasttt { 260 | background-color: white; 261 | display: flex; 262 | margin: auto; 263 | margin-bottom: 160px; 264 | } 265 | #lasttt>div{ 266 | margin-top: 100px; 267 | margin-left: 210px; 268 | } 269 | 270 | #input { 271 | font-size: 20px; 272 | width: 300px; 273 | padding: 10px; 274 | margin:20px 10px 20px 0px ; 275 | } 276 | #div{ 277 | display:flex; 278 | } 279 | 280 | #button { 281 | width: 160px; 282 | height: 48px; 283 | padding: 7px; 284 | font-size: 19px; 285 | margin-left: 10px; 286 | background-color: #57bb71; 287 | color: white; 288 | border: none; 289 | border-radius: 5px; 290 | margin:20px 0px 20px 0px ; 291 | } 292 | #button:hover{ 293 | box-shadow: 1px 1px 20px #6ecab3; 294 | } 295 | #lasttt>div>div>i>img { 296 | width: 2.5%; 297 | position: relative; 298 | top: 3px; 299 | left: 9px; 300 | } 301 | 302 | #c{ 303 | padding-bottom: 5px; 304 | font-size: 20px; 305 | margin-left: 10px; 306 | color:#767676; 307 | } 308 | #lasttt>div>li { 309 | color: #333333; 310 | line-height: 27px; 311 | font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;; 312 | font-size: 19px; 313 | width: 240px; 314 | margin-left: -500px ; 315 | 316 | } 317 | #li>li:nth-child(1){ 318 | margin-top: 30px; 319 | } 320 | #lasttt>div>li::marker{ 321 | color:#57bb71; 322 | font-size: 40px; 323 | 324 | } 325 | #lasttt>div>h2{ 326 | 327 | color: #333333; 328 | color: rgb(51, 51, 51); 329 | background-color: #000000; 330 | background-color: rgba(0, 0, 0, 0); 331 | font-family: geomanist-book, sans-serif; 332 | font-size: 36px; 333 | line-height: 43.92px; 334 | vertical-align: baseline; 335 | letter-spacing: normal; 336 | word-spacing: 0px; 337 | font-weight: 400; 338 | font-style: normal; 339 | font-variant: normal; 340 | text-transform: none; 341 | text-decoration: none solid rgb(51, 51, 51); 342 | text-indent: 0px; 343 | width: 800px; 344 | 345 | } 346 | #last>div{ 347 | text-align: left ; 348 | } 349 | #lasttt>div>h3{ 350 | color: #767676; 351 | color: rgb(118, 118, 118); 352 | background-color: #000000; 353 | background-color: rgba(0, 0, 0, 0); 354 | font-family: geomanist-regular, sans-serif; 355 | font-size: 18px; 356 | line-height: 25.92px; 357 | vertical-align: baseline; 358 | letter-spacing: normal; 359 | word-spacing: 0px; 360 | margin: 0px 0px 8px; 361 | padding: 0px; 362 | font-weight: 400; 363 | font-style: normal; 364 | font-variant: normal; 365 | text-transform: none; 366 | text-decoration: none solid rgb(118, 118, 118); 367 | text-indent: 0px; 368 | margin-top: -20px; 369 | } 370 | 371 | 372 | #box{ 373 | display: flex; 374 | position: absolute; 375 | top: 50%; 376 | left: 50%; 377 | height: 50px; 378 | width: 50px; 379 | border-radius: 50%; 380 | color: rgb(87,187,113); 381 | border-color: rgb(87,187,113); 382 | border: 1px solid rgb(87,187,113); 383 | align-items: center; 384 | justify-content: center; 385 | } -------------------------------------------------------------------------------- /css/slack.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-color: #f6fbf7; 3 | } 4 | #first { 5 | display: grid; 6 | grid-template-columns: repeat(2, 1fr); 7 | gap: 50px; 8 | width: 90%; 9 | margin: auto; 10 | margin-top: 100px; 11 | } 12 | 13 | #logo>div>img { 14 | width: 100%; 15 | height: 100%; 16 | } 17 | 18 | #logo { 19 | display: flex; 20 | gap: -10px; 21 | } 22 | 23 | #write>h1 { 24 | color: #333333; 25 | color: rgb(51, 51, 51); 26 | background-color: #000000; 27 | background-color: rgba(0, 0, 0, 0); 28 | font-family: geomanist-regular, sans-serif; 29 | font-size: 48px; 30 | line-height: 56.16px; 31 | vertical-align: baseline; 32 | letter-spacing: normal; 33 | word-spacing: 0px; 34 | margin: 0px 0px 24px; 35 | padding: 0px; 36 | font-weight: 400; 37 | font-style: normal; 38 | font-variant: normal; 39 | text-transform: none; 40 | text-decoration: none solid rgb(51, 51, 51); 41 | text-align: left; 42 | text-indent: 0px; 43 | } 44 | 45 | #write>h3 { 46 | color: #767676; 47 | color: rgb(118, 118, 118); 48 | background-color: #000000; 49 | background-color: rgba(0, 0, 0, 0); 50 | font-family: geomanist-regular, sans-serif; 51 | font-size: 22px; 52 | line-height: 29.92px; 53 | vertical-align: baseline; 54 | letter-spacing: normal; 55 | word-spacing: 0px; 56 | margin: 0px 0px 8px; 57 | padding: 0px; 58 | font-weight: 400; 59 | font-style: normal; 60 | font-variant: normal; 61 | text-transform: none; 62 | text-decoration: none solid rgb(118, 118, 118); 63 | text-align: left; 64 | text-indent: 0px; 65 | } 66 | 67 | #everhourSlack { 68 | width: 50%; 69 | margin: auto; 70 | margin-top: 100px; 71 | gap: 30px; 72 | } 73 | 74 | #everhourSlack>div>h2 { 75 | 76 | color: #333333; 77 | color: rgb(51, 51, 51); 78 | background-color: #000000; 79 | background-color: rgba(0, 0, 0, 0); 80 | font-family: geomanist-book, sans-serif; 81 | font-size: 36px; 82 | line-height: 43.92px; 83 | vertical-align: baseline; 84 | letter-spacing: normal; 85 | word-spacing: 0px; 86 | margin: 0px 0px 8px; 87 | padding: 0px; 88 | font-weight: 400; 89 | font-style: normal; 90 | font-variant: normal; 91 | text-transform: none; 92 | text-decoration: none solid rgb(51, 51, 51); 93 | text-align: center; 94 | text-indent: 0px; 95 | } 96 | 97 | #everhourSlack>div>h3{ 98 | color: #767676; 99 | color: rgb(118, 118, 118); 100 | background-color: #000000; 101 | background-color: rgba(0, 0, 0, 0); 102 | font-family: geomanist-regular, sans-serif; 103 | font-size: 18px; 104 | line-height: 25.92px; 105 | vertical-align: baseline; 106 | letter-spacing: normal; 107 | word-spacing: 0px; 108 | margin: 0px 0px 8px; 109 | padding: 0px; 110 | font-weight: 400; 111 | font-style: normal; 112 | font-variant: normal; 113 | text-transform: none; 114 | text-decoration: none solid rgb(118, 118, 118); 115 | text-align: center; 116 | text-indent: 0px; 117 | } 118 | 119 | #image { 120 | text-align: center; 121 | justify-content: center; 122 | align-items: center; 123 | margin-top: 60px; 124 | } 125 | 126 | #middle { 127 | display: flex; 128 | width: 80%; 129 | margin: auto; 130 | margin-top: 40px; 131 | gap: 20px; 132 | } 133 | 134 | #middle>div { 135 | display: flex; 136 | gap: 20px; 137 | } 138 | 139 | #middle>div>div:first-child { 140 | background-color: #fcedd5; 141 | border-top-left-radius: 50%; 142 | border-top-right-radius: 50%; 143 | border-bottom-left-radius: 50%; 144 | border-bottom-right-radius: 0%; 145 | width: 40px; 146 | height: 30px; 147 | font-size: 20px; 148 | text-align: center; 149 | padding: 20px; 150 | 151 | } 152 | 153 | #middle>div:nth-child(2)>div:first-child { 154 | background-color: #fcedd5; 155 | border-top-left-radius: 50%; 156 | border-top-right-radius: 0%; 157 | border-bottom-left-radius: 50%; 158 | border-bottom-right-radius: 50%; 159 | width: 40px; 160 | height: 30px; 161 | font-size: 20px; 162 | text-align: center; 163 | padding: 20px; 164 | 165 | } 166 | #middle>div:nth-child(3)>div:first-child { 167 | background-color: #fcedd5; 168 | border-top-left-radius: 50%; 169 | border-top-right-radius: 50%; 170 | border-bottom-left-radius: 0%; 171 | border-bottom-right-radius: 50%; 172 | width: 40px; 173 | height: 30px; 174 | font-size: 20px; 175 | text-align: center; 176 | padding: 20px; 177 | 178 | } 179 | 180 | #middle>div>div:first-child>span { 181 | margin: 20px; 182 | font-size: 30px; 183 | text-align: end; 184 | color: orange; 185 | } 186 | 187 | #middle>div>div:nth-child(2)>p:first-child { 188 | color: #050505; 189 | font-family: geomanist-book, sans-serif; 190 | font-size: 20px; 191 | line-height: 26px; 192 | vertical-align: baseline; 193 | letter-spacing: normal; 194 | word-spacing: 0px; 195 | margin: 0px 0px 8px; 196 | padding: 0px; 197 | font-style: normal; 198 | font-variant: normal; 199 | text-transform: none; 200 | text-decoration: none solid rgb(51, 51, 51); 201 | text-align: left; 202 | text-indent: 0px; 203 | font-weight:500 ; 204 | } 205 | 206 | #middle>div>div:nth-child(2)>p:last-child { 207 | color: #7C7C7C; 208 | color: rgb(124, 124, 124); 209 | background-color: #000000; 210 | background-color: rgba(0, 0, 0, 0); 211 | font-family: geomanist-regular, sans-serif; 212 | font-size: 18px; 213 | line-height: 26px; 214 | vertical-align: baseline; 215 | letter-spacing: normal; 216 | word-spacing: 0px; 217 | margin: 0px; 218 | padding: 0px; 219 | font-weight: 400; 220 | font-style: normal; 221 | font-variant: normal; 222 | text-transform: none; 223 | text-decoration: none solid rgb(124, 124, 124); 224 | text-align: left; 225 | text-indent: 0px 226 | } 227 | 228 | #star { 229 | display: grid; 230 | grid-template-columns: 1fr 2fr; 231 | background-color: #f6fbf7; 232 | padding: 40px; 233 | margin-top: 80px; 234 | margin-bottom: 40px; 235 | } 236 | 237 | #star>div>img { 238 | width: 40%; 239 | margin-left: 240px; 240 | margin-right: 0; 241 | padding: 0; 242 | background-color: #f6fbf7; 243 | } 244 | 245 | #star>div>p { 246 | color: #7C7C7C; 247 | font-family: geomanist-regular, sans-serif; 248 | font-size: 18px; 249 | line-height: 25.92px; 250 | vertical-align: baseline; 251 | letter-spacing: normal; 252 | word-spacing: 0px; 253 | margin: 0px; 254 | padding: 0px; 255 | font-weight: 400; 256 | font-style: normal; 257 | font-variant: normal; 258 | text-transform: none; 259 | text-decoration: none solid rgb(124, 124, 124); 260 | text-align: start; 261 | text-indent: 0px 262 | } 263 | 264 | #last { 265 | display: flex; 266 | width: 90%; 267 | margin: auto; 268 | margin-top: 100px; 269 | } 270 | 271 | input { 272 | font-size: 20px; 273 | width: 300px; 274 | padding: 10px; 275 | margin:20px 0 20px 0px; 276 | } 277 | 278 | button { 279 | width: 160px; 280 | padding: 18px; 281 | margin-left: 10px; 282 | background-color: #57bb71; 283 | color: white; 284 | border: none; 285 | border-radius: 5px; 286 | } 287 | button:hover{ 288 | box-shadow: 1px 1px 20px #6ecab3; 289 | } 290 | 291 | #last>div>div>i>img { 292 | width: 3%; 293 | } 294 | #last>div>div>i> { 295 | padding-top:10px; 296 | } 297 | #last>div>div>span>a{ 298 | padding-bottom: 5px; 299 | font-size: 20px; 300 | margin-left: 10px; 301 | color:#767676; 302 | } 303 | #last>div>li { 304 | color: #333333; 305 | line-height: 27px; 306 | vertical-align: baseline; 307 | letter-spacing: normal; 308 | word-spacing: 0px; 309 | font-size: 19px; 310 | font-style: normal; font-variant: normal; text-transform: none; 311 | text-decoration: none solid rgb(51, 51, 51); text-align: left; text-indent: 0px; 312 | } 313 | #last>div>li::marker{ 314 | color:#57bb71; 315 | font-size: 40px; 316 | 317 | } 318 | #last>div>h2 { 319 | 320 | color: #333333; 321 | color: rgb(51, 51, 51); 322 | background-color: #000000; 323 | background-color: rgba(0, 0, 0, 0); 324 | font-family: geomanist-book, sans-serif; 325 | font-size: 36px; 326 | line-height: 43.92px; 327 | vertical-align: baseline; 328 | letter-spacing: normal; 329 | word-spacing: 0px; 330 | margin: 0px 0px 8px; 331 | padding: 0px; 332 | font-weight: 400; 333 | font-style: normal; 334 | font-variant: normal; 335 | text-transform: none; 336 | text-decoration: none solid rgb(51, 51, 51); 337 | text-indent: 0px; 338 | } 339 | #last>div>h3{ 340 | color: #767676; 341 | color: rgb(118, 118, 118); 342 | background-color: #000000; 343 | background-color: rgba(0, 0, 0, 0); 344 | font-family: geomanist-regular, sans-serif; 345 | font-size: 18px; 346 | line-height: 25.92px; 347 | vertical-align: baseline; 348 | letter-spacing: normal; 349 | word-spacing: 0px; 350 | margin: 0px 0px 8px; 351 | padding: 0px; 352 | font-weight: 400; 353 | font-style: normal; 354 | font-variant: normal; 355 | text-transform: none; 356 | text-decoration: none solid rgb(118, 118, 118); 357 | text-indent: 0px; 358 | } 359 | a{ 360 | text-decoration: underline; 361 | color:#5090e2; 362 | } -------------------------------------------------------------------------------- /css/Trello.css: -------------------------------------------------------------------------------- 1 | body{ 2 | font-family:sans-serif; 3 | } 4 | 5 | #one{ 6 | margin-top: 100px; 7 | width: 100%; 8 | text-align: center; 9 | padding: 0 20vw 0 20vw; 10 | 11 | } 12 | #one div{ 13 | 14 | width: 55%; 15 | } 16 | #one h1{ 17 | font-size: 45px; 18 | font-weight:lighter; 19 | 20 | } 21 | #one h2{ 22 | font-size: 23px; 23 | font-weight:lighter; 24 | color:rgb(121,126,131) 25 | } 26 | #one_button{ 27 | width: 250px; 28 | height: 50px; 29 | border-radius: 5px; 30 | background-color: white; 31 | color: rgb(87,187,113); 32 | border: 1px solid rgb(87,187,113); 33 | } 34 | 35 | #one_button:hover , 36 | #one_button:focus{ 37 | width: 250px; 38 | height: 50px; 39 | color: white; 40 | background-color: rgb(87,187,113); 41 | border-radius: 5px; 42 | box-shadow: rgb(87,187,113) 0px 5px 15px; 43 | font-size: 20px; 44 | font-weight: lighter; 45 | 46 | } 47 | 48 | 49 | 50 | 51 | #one_button>div{ 52 | 53 | display: grid; 54 | width: 100%; 55 | height: 100%; 56 | grid-template-columns:70px 300px; 57 | grid-template-rows: 50px; 58 | text-align: center; 59 | align-items: center; 60 | font-size: 20px; 61 | } 62 | 63 | #one p{ 64 | color:rgb(121,126,131) 65 | } 66 | #logo{ 67 | height: 80%; 68 | margin-bottom: 10%; 69 | border: 1px solid blue; 70 | display: flex; 71 | background-color: rgb(81, 81, 210); 72 | border-radius: 5px; 73 | } 74 | 75 | 76 | #one_button:focus{ 77 | width: 250px; 78 | height: 50px; 79 | border-radius: 5px; 80 | background-color: rgb(87,187,113); 81 | color:white; 82 | border: 1px solid rgb(87,187,113); 83 | box-shadow: rgb(87,187,113) 0px 5px 15px; 84 | } 85 | /* //////////two div///////////// */ 86 | #two{ 87 | width: 100%; 88 | padding: 0 17vw 0 17vw; 89 | margin-top: 50px; 90 | 91 | } 92 | #two div{ 93 | width: 60%; 94 | position: relative; 95 | } 96 | #two img{ 97 | width: 100%; 98 | height: 100%; 99 | } 100 | 101 | #video{ 102 | display: flex; 103 | position: absolute; 104 | top: 50%; 105 | left: 50%; 106 | height: 50px; 107 | width: 50px; 108 | border-radius: 50%; 109 | color: rgb(87,187,113); 110 | border-color: rgb(87,187,113); 111 | border: 1px solid rgb(87,187,113); 112 | align-items: center; 113 | justify-content: center; 114 | } 115 | #video:hover, 116 | #video:focus-visible{ 117 | position: absolute; 118 | top: 50%; 119 | left: 50%; 120 | padding: 25px; 121 | border-radius: 50px; 122 | color: rgb(87,187,113); 123 | border-color: rgb(87,187,113); 124 | border: 1px solid rgb(87,187,113); 125 | background-color: white; 126 | } 127 | /* ///////////three div/////////////// */ 128 | #three { 129 | margin-top: 50px; 130 | width: 100%; 131 | padding: 0 15% 0 15%; 132 | height: auto; 133 | 134 | } 135 | #three p{ 136 | color:rgb(121,126,131) 137 | } 138 | #three>div{ 139 | 140 | width: 70%; 141 | display: flex; 142 | gap: 50px; 143 | 144 | } 145 | #sub{ 146 | display: grid; 147 | grid-template-columns: repeat(2,1fr); 148 | gap: 10px; 149 | line-height: 25px; 150 | } 151 | /* ////////////four div//////////////// */ 152 | #four{ 153 | margin-top: 150px; 154 | width: 100%; 155 | display: flex; 156 | justify-content: space-around; 157 | text-align: center; 158 | } 159 | #four p{ 160 | color:rgb(121,126,131) 161 | } 162 | #four h3{ 163 | color:rgb(121,126,131) 164 | } 165 | #four div{ 166 | width: 50%; 167 | } 168 | /* /////////five div//////////////////// */ 169 | #five{ 170 | width: 100%; 171 | height: auto; 172 | line-height: 25px; 173 | } 174 | #five>div{ 175 | margin: 50px 20% 50px 20%; 176 | display: grid; 177 | height: 100%; 178 | width: 60%; 179 | grid-template-columns: repeat(2,1fr); 180 | gap: 50px; 181 | } 182 | #five p{ 183 | color:rgb(121,126,131) 184 | } 185 | 186 | /* ////////////six div//////////////// */ 187 | #six { 188 | 189 | width: 100%; 190 | gap: 20px; 191 | height: auto; 192 | } 193 | #six>div{ 194 | display: flex; 195 | width: 70%; 196 | margin: 50px 15% 50px 15%; 197 | justify-content: space-between; 198 | } 199 | #six_first{ 200 | width: 40%; 201 | } 202 | #six_first img{ 203 | width: 100%; 204 | height: 70%; 205 | } 206 | #six_two{ 207 | height: 100%; 208 | display: grid; 209 | gap: 30px; 210 | font-size: 20px; 211 | } 212 | .six_sub{ 213 | display: flex; 214 | } 215 | .six_sub p{ 216 | width: 90%; 217 | } 218 | .six_sub button{ 219 | border: transparent; 220 | background-color: transparent; 221 | } 222 | /* /////////////7th div //////////// */ 223 | #seven{ 224 | width: 100%; 225 | text-align: center; 226 | height: auto; 227 | } 228 | #seven>div{ 229 | display: grid; 230 | width: 70%; 231 | margin: 20px 15% 30px 15%; 232 | grid-template-columns: repeat(10,1fr); 233 | } 234 | #seven img{ 235 | width: 100%; 236 | height: 50px; 237 | } 238 | /* //////////////8th div///////////// */ 239 | #eight{ 240 | width: 100%; 241 | height: auto; 242 | margin-top: 50px; 243 | line-height: 25px; 244 | 245 | } 246 | 247 | #eight>div{ 248 | width: 75%; 249 | margin: 30px 12% 30px 12%; 250 | display: grid; 251 | grid-template-columns: repeat(3,1fr); 252 | gap: 50px; 253 | font-size: 16px; 254 | font-weight: lighter; 255 | } 256 | #eight>div>div{ 257 | padding: 25px; 258 | box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px; 259 | color: #777471; 260 | } 261 | 262 | #Keep_reading{ 263 | display: flex; 264 | height: 100px; 265 | width: 100%; 266 | text-align: center; 267 | align-items: center; 268 | justify-content: center; 269 | 270 | } 271 | .keep_reading_button{ 272 | padding: 10px 20px 10px 20px; 273 | color: rgb(87,187,113); 274 | background-color: white; 275 | border-radius: 5px; 276 | border: 1px solid rgb(87,187,113); 277 | font-size: 20px; 278 | font-weight: lighter; 279 | } 280 | .keep_reading_button:hover, 281 | .keep_reading_button:focus{ 282 | 283 | color: white; 284 | background-color: rgb(87,187,113); 285 | border-radius: 5px; 286 | box-shadow: rgb(87,187,113) 0px 5px 15px; 287 | font-size: 20px; 288 | font-weight: lighter; 289 | } 290 | 291 | /* //////////////////9the//////////////////// */ 292 | #nine{ 293 | width: 100%; 294 | margin: 50px 0 50px 0; 295 | } 296 | #nine>div{ 297 | margin: 0 15% 0 15% ; 298 | width: 70%; 299 | display: flex; 300 | justify-content: space-between; 301 | } 302 | #nine img{ 303 | width: 20px; 304 | height: 20px; 305 | } 306 | #nine_sub1{ 307 | display: flex; 308 | align-items: center; 309 | gap: 10px; 310 | } 311 | 312 | .nine_2nd{ 313 | list-style-type:disc; 314 | line-height: 40px; 315 | 316 | } 317 | .nine_2nd>li::marker{ 318 | color:#57bb71; 319 | font-size: 40px; 320 | background-color: #57bb71; 321 | } 322 | #nine p{ 323 | font-size: 20px; 324 | } 325 | #nine li{ 326 | font-size: 20px; 327 | } 328 | #nine input{ 329 | border-radius: 5px; 330 | padding: 10px 30px 10px 30px; 331 | border: 1px solid rgb(87,187,113); 332 | } 333 | #nine p{ 334 | color:rgb(121,126,131); 335 | font-weight: lighter; 336 | font-size: 15px; 337 | } 338 | #nine h3{ 339 | color:rgb(121,126,131); 340 | font-weight: lighter; 341 | font-size: 17px; 342 | } 343 | .try_free{ 344 | padding: 10px 20px 10px 20px; 345 | color: white; 346 | border: 1px solid rgb(87,187,113); 347 | background-color: rgb(87,187,113); 348 | border-radius: 5px; 349 | font-size: 20px; 350 | } 351 | .try_free:hover, 352 | .try_free:focus{ 353 | 354 | color: white; 355 | border: 1px solid rgb(87,187,113); 356 | border-radius: 5px; 357 | box-shadow: rgb(87,187,113) 0px 5px 15px; 358 | } 359 | /* //////////youtube video for one///////// */ 360 | #iframe_div{ 361 | position: absolute; 362 | top: 60vh; 363 | left: 20vw; 364 | width: 60vw; 365 | height: 60vh; 366 | } 367 | 368 | iframe{ 369 | position: absolute; 370 | top: 15%; 371 | left: 0vw; 372 | width: 60vw; 373 | height: 60vh; 374 | } 375 | 376 | #cancel{ 377 | position: absolute; 378 | width: auto; 379 | height: auto; 380 | border: transparent; 381 | right: 0%; 382 | top: 0%; 383 | border-radius: 50%; 384 | color: black; 385 | font-size: 30px; 386 | background-color: transparent; 387 | 388 | } 389 | #cancel:hover, 390 | #cancel:focus{ 391 | position: absolute; 392 | width: auto; 393 | height: auto; 394 | border: transparent; 395 | right: 0%; 396 | top: 0%; 397 | border-radius: 50%; 398 | color: black; 399 | font-size: 30px; 400 | box-shadow: rgba(211, 64, 38, 0.25) 0px 30px 60px -12px inset, rgba(246, 14, 14, 0.897) 0px 18px 36px -18px inset; 401 | } 402 | /* //////////button logo for no1////////// */ 403 | 404 | #logo_one{ 405 | display: flex; 406 | justify-content:center; 407 | align-items:center; 408 | } 409 | #logo_two{ 410 | display: flex; 411 | justify-content:center; 412 | } 413 | #logo_one>div{ 414 | 415 | width: 70%; 416 | height: 80%; 417 | border-radius: 5px; 418 | background-color: white; 419 | } 420 | #logo_two>div{ 421 | margin-top: 10%; 422 | width: 70%; 423 | height: 60%; 424 | border-radius: 5px; 425 | background-color: white; 426 | } 427 | a{ 428 | color: #7c9be5; 429 | } 430 | .a{ 431 | background-color: #fdfbc2; 432 | } -------------------------------------------------------------------------------- /css/everhour.css: -------------------------------------------------------------------------------- 1 | #star { 2 | display: grid; 3 | grid-template-columns: repeat(2,1fr); 4 | gap:20px; 5 | width:55%; 6 | margin:auto; 7 | margin-top: 80px; 8 | 9 | } 10 | 11 | #star>div>img { 12 | width: 35%; 13 | margin-left: 240px; 14 | margin-right: 0; 15 | padding: 0; 16 | background-color: #f6fbf7; 17 | } 18 | 19 | #star>div>p { 20 | color: #7C7C7C; 21 | font-family: geomanist-regular, sans-serif; 22 | text-decoration: none solid rgb(124, 124, 124); 23 | } 24 | #first{ 25 | width: 80%; 26 | margin: auto; 27 | text-align: center; 28 | } 29 | 30 | #first>div>input { 31 | font-size: 20px; 32 | width: 300px; 33 | padding: 10px; 34 | margin:20px 0 20px 0px; 35 | } 36 | 37 | #first>div>button { 38 | width: 160px; 39 | padding: 18px; 40 | margin-left: 10px; 41 | background-color: #57bb71; 42 | color: white; 43 | border: none; 44 | border-radius: 5px; 45 | } 46 | #first>div>button:hover{ 47 | box-shadow: 1px 1px 20px #6ecab3; 48 | } 49 | 50 | #first>div>div>i>img { 51 | width: 2%; 52 | } 53 | #first>div>div>i> { 54 | padding-top:10px; 55 | } 56 | #first>div>div>span>a{ 57 | padding-bottom: 5px; 58 | font-size: 20px; 59 | margin-left: 10px; 60 | color:#767676; 61 | } 62 | #first>div>h1,#h1{ 63 | 64 | color: #333333; 65 | color: rgb(51, 51, 51); 66 | background-color: #000000; 67 | background-color: rgba(0, 0, 0, 0); 68 | font-family: geomanist-book, sans-serif; 69 | font-size: 46px; 70 | line-height: 55px; 71 | vertical-align: baseline; 72 | letter-spacing: normal; 73 | word-spacing: 0px; 74 | margin: 0px 0px 8px; 75 | padding: 0px; 76 | font-style: normal; 77 | font-variant: normal; 78 | text-transform: none; 79 | text-decoration: none solid rgb(51, 51, 51); 80 | text-indent: 0px; 81 | font-weight: 400; 82 | } 83 | #first>div>h3{ 84 | color: #767676; 85 | color: rgb(118, 118, 118); 86 | background-color: #000000; 87 | background-color: rgba(0, 0, 0, 0); 88 | font-family: geomanist-regular, sans-serif; 89 | font-size: 25px; 90 | line-height: 35px; 91 | font-weight: 400; 92 | margin-top: 20px; 93 | } 94 | #h1{ 95 | text-align: center; 96 | margin-top: 100px; 97 | font-weight: 500; 98 | } 99 | #logo{ 100 | display:flex; 101 | gap:20px; 102 | width:80%; 103 | margin:auto; 104 | margin-top:60px; 105 | } 106 | #logo>a>div{ 107 | display:flex; 108 | gap:10px; 109 | } 110 | #logo>a>div>div>img{ 111 | width:30px; 112 | height:30px; 113 | } 114 | #logo>a>div>div{ 115 | font-size: 25px; 116 | color:#111111; 117 | text-decoration: none; 118 | font-weight: 400; 119 | } 120 | #logo>a>div>div:hover{ 121 | color:#57bb71; 122 | } 123 | #logo>a{ 124 | text-decoration: none; 125 | color:#111111; 126 | } 127 | #middle { 128 | display: flex; 129 | width: 80%; 130 | margin: auto; 131 | margin-top: 40px; 132 | gap: 20px; 133 | } 134 | 135 | #middle>div { 136 | display: flex; 137 | gap: 20px; 138 | } 139 | 140 | #middle>div>div:first-child { 141 | background-color: #f2fbf9; 142 | border-top-left-radius: 50%; 143 | border-top-right-radius: 50%; 144 | border-bottom-left-radius: 50%; 145 | border-bottom-right-radius: 0%; 146 | width: 40px; 147 | height: 30px; 148 | font-size: 20px; 149 | text-align: center; 150 | padding: 20px; 151 | 152 | } 153 | #middle>div>div:first-child>span { 154 | margin: 20px; 155 | font-size: 30px; 156 | text-align: end; 157 | color: #57bb71 158 | } 159 | 160 | #middle>div>div:nth-child(2)>p:first-child { 161 | color: #050505; 162 | font-family: geomanist-book, sans-serif; 163 | font-size: 20px; 164 | line-height: 26px; 165 | vertical-align: baseline; 166 | letter-spacing: normal; 167 | word-spacing: 0px; 168 | margin: 0px 0px 8px; 169 | padding: 0px; 170 | font-style: normal; 171 | font-variant: normal; 172 | text-transform: none; 173 | text-decoration: none solid rgb(51, 51, 51); 174 | text-align: left; 175 | text-indent: 0px; 176 | font-weight:500 ; 177 | } 178 | 179 | #middle>div>div:nth-child(2)>p:last-child { 180 | color: #7C7C7C; 181 | color: rgb(124, 124, 124); 182 | background-color: #000000; 183 | background-color: rgba(0, 0, 0, 0); 184 | font-family: geomanist-regular, sans-serif; 185 | font-size: 18px; 186 | line-height: 26px; 187 | vertical-align: baseline; 188 | letter-spacing: normal; 189 | word-spacing: 0px; 190 | margin: 0px; 191 | padding: 0px; 192 | font-weight: 400; 193 | font-style: normal; 194 | font-variant: normal; 195 | text-transform: none; 196 | text-decoration: none solid rgb(124, 124, 124); 197 | text-align: left; 198 | text-indent: 0px 199 | } 200 | #last { 201 | display: flex; 202 | width: 90%; 203 | margin: auto; 204 | margin-top: 200px; 205 | margin-bottom: 150px; 206 | } 207 | 208 | input { 209 | font-size: 20px; 210 | width: 300px; 211 | padding: 10px; 212 | margin:20px 0 20px 0px; 213 | } 214 | 215 | button { 216 | width: 160px; 217 | padding: 18px; 218 | margin-left: 10px; 219 | background-color: #57bb71; 220 | color: white; 221 | border: none; 222 | border-radius: 5px; 223 | } 224 | button:hover{ 225 | box-shadow: 1px 1px 20px #6ecab3; 226 | } 227 | #last>div>div>i>img { 228 | width: 3%; 229 | } 230 | #last>div>div>i> { 231 | padding-top:10px; 232 | } 233 | #last>div>div>span>a{ 234 | padding-bottom: 5px; 235 | font-size: 20px; 236 | margin-left: 10px; 237 | color:#767676; 238 | } 239 | #last>div>li { 240 | color: #333333; 241 | line-height: 27px; 242 | vertical-align: baseline; 243 | letter-spacing: normal; 244 | word-spacing: 0px; 245 | font-size: 19px; 246 | font-style: normal; font-variant: normal; text-transform: none; 247 | text-decoration: none solid rgb(51, 51, 51); text-align: left; text-indent: 0px; 248 | } 249 | #last>div>li::marker{ 250 | color:#57bb71; 251 | font-size: 40px; 252 | 253 | } 254 | #last>div>h2,#a>div>h2 { 255 | 256 | color: #333333; 257 | color: rgb(51, 51, 51); 258 | background-color: #000000; 259 | background-color: rgba(0, 0, 0, 0); 260 | font-family: geomanist-book, sans-serif; 261 | font-size: 36px; 262 | line-height: 43.92px; 263 | vertical-align: baseline; 264 | letter-spacing: normal; 265 | word-spacing: 0px; 266 | margin: 0px 0px 8px; 267 | padding: 0px; 268 | font-weight: 400; 269 | font-style: normal; 270 | font-variant: normal; 271 | text-transform: none; 272 | text-decoration: none solid rgb(51, 51, 51); 273 | text-indent: 0px; 274 | } 275 | #last>div>h3{ 276 | color: #767676; 277 | color: rgb(118, 118, 118); 278 | background-color: #000000; 279 | background-color: rgba(0, 0, 0, 0); 280 | font-family: geomanist-regular, sans-serif; 281 | font-size: 18px; 282 | line-height: 25.92px; 283 | vertical-align: baseline; 284 | letter-spacing: normal; 285 | word-spacing: 0px; 286 | margin: 0px 0px 8px; 287 | padding: 0px; 288 | font-weight: 400; 289 | font-style: normal; 290 | font-variant: normal; 291 | text-transform: none; 292 | text-decoration: none solid rgb(118, 118, 118); 293 | text-indent: 0px; 294 | } 295 | .content{ 296 | height:600px; 297 | width:1200px; 298 | overflow:hidden; 299 | position:relative; 300 | margin:auto; 301 | margin-top: 70px; 302 | display:flex; 303 | gap:20px; 304 | justify-content: space-around; 305 | } 306 | .content .images{ 307 | height:100%; 308 | width:90%; 309 | } 310 | .images img{ 311 | height:100%; 312 | width:100%; 313 | } 314 | 315 | .slide span{ 316 | font-size:35px; 317 | color:grey; 318 | line-height: 41px;; 319 | } 320 | #left>div{ 321 | border:1px solid white; 322 | height:50px; 323 | width:50px; 324 | background-color: #f6fbf7; 325 | border-radius: 50%; 326 | box-shadow: 1px 5px 10px #7C7C7C; 327 | text-align: center; 328 | margin-top: 250px; 329 | margin-left: 5px; 330 | } 331 | #right>div{ 332 | border:1px solid white; 333 | height:50px; 334 | width:50px; 335 | background-color: #f6fbf7; 336 | border-radius: 50%; 337 | box-shadow: 1px 5px 10px #7C7C7C; 338 | text-align: center; 339 | margin-top: 250px; 340 | margin-right: 5px; 341 | } 342 | #costmor{ 343 | display:flex; 344 | width:90%; 345 | margin:auto; 346 | gap:100px; 347 | margin-top: 150px; 348 | } 349 | #costmor>div>#quote>div>div>img{ 350 | width:200%; 351 | height: 100%; 352 | margin-top: 50px; 353 | margin-right: 20px; 354 | } 355 | #quote{ 356 | display:flex; 357 | gap:80px; 358 | } 359 | #quote>div>p:first-child{ 360 | color: #7C7C7C; 361 | font-family: geomanist-regular, sans-serif; 362 | text-decoration: none solid rgb(124, 124, 124); 363 | margin-top: 60px; 364 | font-size: 20px; 365 | line-height: 30px; 366 | } 367 | b { 368 | background-image: linear-gradient(-100deg, rgba(250, 247, 133, 0.3), rgba(250, 247, 133, 0.7) 95%, rgba(250, 247, 133, 0.1)); 369 | color: #767676; 370 | font-weight: 100; 371 | } 372 | #quote>div>a{ 373 | color:rgb(86, 140, 241); 374 | font-size: 20px; 375 | 376 | } 377 | #quote>div>h4{ 378 | font-weight: bold; 379 | font-size: 20px; 380 | } 381 | #quote>div>p:last-of-type{ 382 | color: #7C7C7C; 383 | font-family: geomanist-regular, sans-serif; 384 | text-decoration: none solid rgb(124, 124, 124); 385 | font-size: 20px; 386 | } 387 | #a{ 388 | border-bottom: 10px #fdf5e1 solid ; 389 | border-left: 10px #fdf5e1 solid ; 390 | padding-bottom:50px; 391 | padding-left: 40px; 392 | } -------------------------------------------------------------------------------- /Pricing.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Everhour Pricing & Free Trial 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |
    17 |

    Simple pricing with no extra fees

    18 |

    Start with no commitment. Try everything. Subscribe if you love it.

    19 | 20 |
    21 | 22 |

    Team Plan

    23 |

    All Features, plus best-in-class integrations

    24 |
    25 |

    26 |
    27 |
    28 |
    29 |

    / user / month, starting at 5 users

    30 |
    31 |

    Unlimited users

    32 |

    Unlimited projects and clients

    33 |

    Track time inside most popular tools →

    34 |

    Optional screenshots

    35 |

    Customizable reports

    36 |

    Schedule reports by email

    37 |

    Lock time entries at certain rules

    38 |

    Time tracking reminders

    39 |

    Time approval

    40 |

    Single sign-on (SSO)

    41 |

    Budget & estimates

    42 |

    Manage billable rates and labor costs

    43 |

    Expenses

    44 |

    Scheduling

    45 |

    Invoicing

    46 |

    Time off

    47 |

    Fast and responsive support

    48 |

    API

    49 |
    50 | 51 |
    52 |

    Currency INR

    53 |
    54 |

    Your questions. Answered!

    55 |

    Here is the list of the most frequent questions. If you’d have other questions or ideas — contact us .

    56 | 57 |
    58 | 59 | 60 |
    61 |
    What's the trial period purpose?

    When you sign up, you get a fully-functional account for 2 weeks, which gives you access to everything Everhour has to offer. After 14 days, you will need to pick a plan and enter your credit card details. We’ll email you a couple of days before your trial expires to remind you.

    62 |
    What means 'Starting at 5 users'?

    This is kind of a basic usage fee. You can subscribe even if you have fewer than 5 users, however, in this case, the minimum usage fee will apply. So it's either $50/month on a month-to-month basis or $42.5/month billed in advance on a yearly basis.

    63 |
    Can I change my plan later?

    Yes, you can upgrade/downgrade your plan at any time. You will be credited for the remainder of your current plan and charged for your new plan when you upgrade.

    64 |
    Can I add or remove members at any time?

    Absolutely! Everhour is pay-as-you-go, and you can easily add or remove members from your account with a couple of clicks.

    65 |
    What if I want to cancel my service?

    No problem. If you decide Everhour isn’t for you (or you just need to pause), simply cancel before your next billing period. This date is listed on your billing page. Unfortunately, we can’t refund you for partial use or the amount of time left in your subscription.

    66 |
    What kind of payment methods do you accept?

    We currently accept any credit or debit card with a MasterCard, Visa, Discover Network, American Express, Diners Club International or JCB logo.

    67 |
    Which currency will I be charged in?

    We charge you in US dollars. However, the debit currency depends on your card and your bank.

    68 |
    69 |
    70 | 71 | 72 |
    73 |
    74 |

    Take control of your time with Everhour

    75 |

    Beautiful integrations. Intuitive interface. No unexpected fees

    76 |
    77 |
    78 |
    79 | Or sign up with Google Account
    80 | 81 |
    82 |
    83 |
  • Track time from the apps you already use
  • 84 |
  • Know where your team’s time is going
  • 85 |
  • Keep projects on budget
  • 86 |
  • Increase transparency
  • 87 |
  • Make your workflow more efficient
  • 88 |
  • Spot burnout before it happens
  • 89 |
    90 |
    91 | 92 | 93 | 94 | 95 | 119 | 120 | -------------------------------------------------------------------------------- /css/Pricing.css: -------------------------------------------------------------------------------- 1 | #one{ 2 | width: 50%; 3 | height: 300px; 4 | margin: auto; 5 | margin-top: 140px; 6 | text-align: center; 7 | color: #333333; 8 | font-family: geomanist-regular, sans-serif; 9 | } 10 | #one>h1{ 11 | font-size: 45px; 12 | } 13 | #one>p{ 14 | font-size: 21px; 15 | color: #767676; 16 | } 17 | button{ 18 | width: 120px; 19 | height: 30px; 20 | border-radius: 13px; 21 | border: 0px; 22 | } 23 | #box{ 24 | 25 | width: 49%; 26 | height: 900px; 27 | margin: auto; 28 | box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; 29 | margin-top: 40px; 30 | } 31 | img{ 32 | width: 300px; 33 | background-color: white; 34 | } 35 | #box>h1{ 36 | margin-right: 90px; 37 | color: #333333; 38 | } 39 | #box>p{ 40 | margin-left: 46px; 41 | text-align: left; 42 | color:#7C7C7C; 43 | } 44 | #cont{ 45 | height: 80px; 46 | width: 150px; 47 | margin: 40px 0px 0px 50px; 48 | } 49 | 50 | #list{ 51 | line-height: 1px; 52 | font-size: 14px; 53 | } 54 | .one{ 55 | display: flex; 56 | } 57 | .one>img{ 58 | margin-top: 3px; 59 | width: 30px; 60 | height: 25px; 61 | margin-left: 40px; 62 | } 63 | .two{ 64 | display: flex; 65 | } 66 | .two>img{ 67 | margin-top: 3px; 68 | width: 30px; 69 | height: 25px; 70 | margin-left: 40px; 71 | } 72 | .three{ 73 | display: flex; 74 | } 75 | .three>img{ 76 | margin-top: 3px; 77 | width: 30px; 78 | height: 25px; 79 | margin-left: 40px; 80 | } 81 | .four{ 82 | display: flex; 83 | } 84 | .four>img{ 85 | margin-top: 3px; 86 | width: 30px; 87 | height: 25px; 88 | margin-left: 40px; 89 | } 90 | .five{ 91 | display: flex; 92 | } 93 | .five>img{ 94 | margin-top: 3px; 95 | width: 30px; 96 | height: 25px; 97 | margin-left: 40px; 98 | } 99 | .six{ 100 | display: flex; 101 | } 102 | .six>img{ 103 | margin-top: 3px; 104 | width: 30px; 105 | height: 25px; 106 | margin-left: 40px; 107 | } 108 | .seven{ 109 | display: flex; 110 | } 111 | .seven>img{ 112 | margin-top: 3px; 113 | width: 30px; 114 | height: 25px; 115 | margin-left: 40px; 116 | } 117 | .eight{ 118 | display: flex; 119 | } 120 | .eight>img{ 121 | margin-top: 3px; 122 | width: 30px; 123 | height: 25px; 124 | margin-left: 40px; 125 | } 126 | .nine{ 127 | display: flex; 128 | } 129 | .nine>img{ 130 | margin-top: 3px; 131 | width: 30px; 132 | height: 25px; 133 | margin-left: 40px; 134 | } 135 | .ten{ 136 | display: flex; 137 | } 138 | .ten>img{ 139 | margin-top: 3px; 140 | width: 30px; 141 | height: 25px; 142 | margin-left: 40px; 143 | } 144 | .eleven{ 145 | display: flex; 146 | } 147 | .eleven>img{ 148 | margin-top: 3px; 149 | width: 30px; 150 | height: 25px; 151 | margin-left: 40px; 152 | } 153 | .twelve{ 154 | display: flex; 155 | } 156 | .twelve>img{ 157 | margin-top: 3px; 158 | width: 30px; 159 | height: 25px; 160 | margin-left: 40px; 161 | } 162 | .thirteen{ 163 | display: flex; 164 | } 165 | .thirteen>img{ 166 | margin-top: 3px; 167 | width: 30px; 168 | height: 25px; 169 | margin-left: 40px; 170 | } 171 | .fourteen{ 172 | display: flex; 173 | } 174 | .fourteen>img{ 175 | margin-top: 3px; 176 | width: 30px; 177 | height: 25px; 178 | margin-left: 40px; 179 | } 180 | .fivteen{ 181 | display: flex; 182 | } 183 | .fivteen>img{ 184 | margin-top: 3px; 185 | width: 30px; 186 | height: 25px; 187 | margin-left: 40px; 188 | } 189 | .sixteen{ 190 | display: flex; 191 | } 192 | .sixteen>img{ 193 | margin-top: 3px; 194 | width: 30px; 195 | height: 25px; 196 | margin-left: 40px; 197 | } 198 | .seventeen{ 199 | display: flex; 200 | } 201 | .seventeen>img{ 202 | margin-top: 3px; 203 | width: 30px; 204 | height: 25px; 205 | margin-left: 40px; 206 | } 207 | .eightteen{ 208 | display: flex; 209 | } 210 | .eightteen>img{ 211 | margin-top: 3px; 212 | width: 30px; 213 | height: 25px; 214 | margin-left: 40px; 215 | } 216 | 217 | #QA{ 218 | font-family: geomanist-regular, sans-serif; 219 | margin: 200px 0px 60px -200px ; 220 | width: 30%; 221 | height: 600px; 222 | } 223 | #QA>h1{ 224 | color: #333333; 225 | font-weight: 600; 226 | width: 190%; 227 | font-size: 33px; 228 | } 229 | #QA>p{ 230 | width: 530px; 231 | color: #767676; 232 | font-size: 19px; 233 | text-align: left; 234 | } 235 | #QA>img{ 236 | width: 480px; 237 | } 238 | a{ 239 | color: royalblue; 240 | } 241 | #cont>h4{ 242 | color: #57BB71; 243 | margin: 10px 120px 0px 0px; 244 | font-size: 20px; 245 | font-weight: lighter; 246 | } 247 | #money{ 248 | width: 110px; 249 | height: 80px; 250 | margin: -25px 0px 0px 17px; 251 | font-size: 60px; 252 | color: #57BB71 ; 253 | } 254 | #point{ 255 | width: 36px; 256 | height: 23px; 257 | margin: -39px 0px 0px 104px ; 258 | color: #57BB71 ; 259 | } 260 | #butt:hover{ 261 | border: 2px solid #57BB71; 262 | border-color: #57BB71; 263 | color: #57BB71; 264 | background-color: white; 265 | } 266 | #but:hover{ 267 | border: 2px solid #57BB71; 268 | border-color: #57BB71; 269 | color: #57BB71; 270 | background-color: white; 271 | } 272 | .flag{ 273 | width: 22px; 274 | } 275 | 276 | 277 | #ans{ 278 | margin: -650px 0px 0px 400px; 279 | width: 80%; 280 | } 281 | #last { 282 | display: flex; 283 | width: 90%; 284 | margin: auto; 285 | margin-top: 300px; 286 | margin-bottom: 150px; 287 | margin-left: -210px; 288 | } 289 | 290 | #input { 291 | font-size: 20px; 292 | width: 300px; 293 | padding: 10px; 294 | margin:20px 10px 20px 0px ; 295 | } 296 | #div{ 297 | display:flex; 298 | } 299 | #li{ 300 | margin-top: 20px; 301 | } 302 | #button { 303 | width: 160px; 304 | height: 48px; 305 | padding: 7px; 306 | font-size: 19px; 307 | margin-left: 10px; 308 | background-color: #57bb71; 309 | color: white; 310 | border: none; 311 | border-radius: 5px; 312 | margin:20px 0px 20px 0px ; 313 | } 314 | #button:hover{ 315 | box-shadow: 1px 1px 20px #6ecab3; 316 | } 317 | #last>div>div>i>img { 318 | width: 2.5%; 319 | position: relative; 320 | top: 2px; 321 | left: 7px; 322 | } 323 | #last>div>div>i> { 324 | padding-top:10px; 325 | } 326 | #last>div>div>span>a{ 327 | padding-bottom: 5px; 328 | font-size: 20px; 329 | margin-left: 10px; 330 | color:#767676; 331 | } 332 | #last>div>li { 333 | color: #333333; 334 | line-height: 27px; 335 | vertical-align: baseline; 336 | letter-spacing: normal; 337 | word-spacing: 0px; 338 | font-size: 19px; 339 | font-style: normal; font-variant: normal; text-transform: none; 340 | text-decoration: none solid rgb(51, 51, 51); text-align: left; text-indent: 0px; 341 | width: 390px; 342 | } 343 | #last>div>li::marker{ 344 | color:#57bb71; 345 | font-size: 40px; 346 | 347 | } 348 | #last>div>h2{ 349 | 350 | color: #333333; 351 | color: rgb(51, 51, 51); 352 | background-color: #000000; 353 | background-color: rgba(0, 0, 0, 0); 354 | font-family: geomanist-book, sans-serif; 355 | font-size: 36px; 356 | line-height: 43.92px; 357 | vertical-align: baseline; 358 | letter-spacing: normal; 359 | word-spacing: 0px; 360 | font-weight: 400; 361 | font-style: normal; 362 | font-variant: normal; 363 | text-transform: none; 364 | text-decoration: none solid rgb(51, 51, 51); 365 | text-indent: 0px; 366 | width: 800px; 367 | 368 | } 369 | #last>div{ 370 | text-align: left ; 371 | } 372 | #last>div>h3,#source>h3{ 373 | color: #767676; 374 | color: rgb(118, 118, 118); 375 | background-color: #000000; 376 | background-color: rgba(0, 0, 0, 0); 377 | font-family: geomanist-regular, sans-serif; 378 | font-size: 18px; 379 | line-height: 25.92px; 380 | vertical-align: baseline; 381 | letter-spacing: normal; 382 | word-spacing: 0px; 383 | margin: 0px 0px 8px; 384 | padding: 0px; 385 | font-weight: 400; 386 | font-style: normal; 387 | font-variant: normal; 388 | text-transform: none; 389 | text-decoration: none solid rgb(118, 118, 118); 390 | text-indent: 0px; 391 | } 392 | /* #drop{ 393 | display:grid; 394 | grid-template-columns: 1fr 2fr; 395 | gap:100px; 396 | width:90%; 397 | margin:auto; 398 | } */ 399 | #drig{ 400 | text-align: left; 401 | margin-top: 50px; 402 | height:80%; 403 | display: grid; 404 | grid-template-columns: 1fr; 405 | } 406 | #drig>div{ 407 | margin-top: 30px; 408 | cursor: pointer; 409 | border-bottom: 0.5px #57bb71 solid; 410 | } 411 | .hide{ 412 | display:none; 413 | } 414 | .show:hover + .hide{ 415 | display:block; 416 | } 417 | .show{ 418 | color: #333333; 419 | color: rgb(51, 51, 51); 420 | background-color: #000000; 421 | background-color: rgba(0, 0, 0, 0); 422 | font-family: geomanist-book, sans-serif; 423 | font-size: 20px; 424 | line-height: 43.92px; 425 | vertical-align: baseline; 426 | letter-spacing: normal; 427 | word-spacing: 0px; 428 | font-weight: 400; 429 | font-style: normal; 430 | font-variant: normal; 431 | text-transform: none; 432 | text-decoration: none solid rgb(51, 51, 51); 433 | text-indent: 0px; 434 | } 435 | .hide{ 436 | color: #7C7C7C; 437 | line-height: 28px; 438 | vertical-align: baseline; 439 | letter-spacing: normal; 440 | font-weight: 400; 441 | font-style: normal; 442 | font-variant: normal; 443 | text-transform: none; 444 | text-decoration: none solid rgb(51, 51, 51); 445 | text-align: left; 446 | text-indent: 0px; 447 | font-family: sans-serif; 448 | font-size: 16px; 449 | } 450 | /* #drop>div{ 451 | border:red solid; 452 | } */ 453 | #source>h2{ 454 | color: #333333; 455 | color: rgb(51, 51, 51); 456 | background-color: #000000; 457 | background-color: rgba(0, 0, 0, 0); 458 | font-family: geomanist-book, sans-serif; 459 | font-size: 36px; 460 | vertical-align: baseline; 461 | letter-spacing: normal; 462 | word-spacing: 0px; 463 | font-weight: 300; 464 | font-style: normal; 465 | font-variant: normal; 466 | text-transform: none; 467 | text-decoration: none solid rgb(51, 51, 51); 468 | text-indent: 0px; 469 | } 470 | -------------------------------------------------------------------------------- /todoist-time-tracking.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Todoist Time-tracking by Everhour-Try for free 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 30 |
    31 |
    32 |

    Todoist time tracking integration

    33 |

    Track time on to-dos right from Todoist. 34 | No more tab switching! Accurate time tracker for robust reporting, budgeting, and payroll.

    35 |
    36 |
    37 | 39 |

    Free to try  •   No credit card required   •   1-minute signup

    40 |
    41 | 42 |
    43 |

    Why Everhour is the best time tracking integration for Todoist on the market?

    44 | 45 |
    46 |
    47 |
    1. Quick setup

    When you connect Todoist with Everhour timesheet app, we sync all your active projects and to-dos so that your team can start tracking time right away.No manual project setup required.

    48 |
    2. Less employee teaching

    You don’t need to explain to your staff how to use additional employee time tracking software. Time tracking controls will appear right inside the Todoist interface, making it easy for them to track time.

    49 |
    3. Accuracy

    Employees often forget to track time as it's not convenient for them to switch between time clock app and the task management app. Everhour eliminates these steps and improves time tracking accuracy.

    50 |
    4. Estimates are always in front of you

    Everhour shows time vs. estimate beside task titles. When the entire team sees progress on tasks, they will hold you accountable for ensuring work is done.

    51 |
    5. Automatic updates

    When you add a new project or change the name of the existing to-dos in Todoist, we will sync this change automatically in Everhour. That means your reports will always show the freshest data.

    52 |
    6. Detailed reports

    Todoist time tracking reports let you organize reported time using various information from your Todoist to-dos such as tags, sections, or custom fields. So you can dive deeper into tracked work hours analysis to get more accurate results.

    53 |
    54 |
    55 | 56 |
    57 |

    How to track time in Todoist with Everhour

    58 |
    • Step 1: Create an Everhour account 59 |

      Sign up for free and install our browser extension. This is how we embed controls into the Todoist interface. We support all popular browsers:Chrome, Firefox, Safari, Edge.

    • 60 |
    • Step 2: Connect Everhour and Todoist 61 |

      After signup, Everhour will automatically sync all your shared projects. Personal projects (not shared with anyone) won’t be synchronised by Everhour and time cannot be tracked for these projects. Sync happens periodically so all new projects and to-dos that you create in Todoist will be visible in Everhour reports. Everhour also updates the names of tasks or projects if they were renamed in Todoist. 62 | This way Everhour reports will always show you the freshest data.

      63 |
    • 64 |
    • Step 3: Invite your team 65 |

      You need to invite your team to join Everhour. They will also need to connect their Todoist accounts and install our browser extension. Only those you invite into Everhour will be able to track time 66 | and attendance and see time progress (not necessarily all Todoist users). Your clients or guests will not see anything in Todoist unless you invite them.

    • 67 |
    • Step 4: Track time inside Todoist 68 |

      You can track time using the timer or log time manually. 69 | You’ll see the time reported by each employee and its progress.

      70 |
    • 71 |
    • Step 5: Track time via the Everhour browser extension 72 |

      You don't necessarily need to open Todoist or Everhour website. By clicking on the timer icon in the browser 73 | toolbar you can quickly start the timer, add time to any task, edit time or estimate, and more.

      74 |
    • 75 |
    • Step 6: Make custom reports with Todoist data 76 |

      There are a number of columns that show specific data coming from Todoist. 77 | Open Todoist time tracking report builder and select any of the columns to display the data in your report.

      78 |
    • 79 |
    • Step 7: Find out more... 80 |

      Timers page shows what your team is doing right now. Timesheet page helps to view the structured 81 | picture of the time a member spent for a week. Timecard page displays when a user started their workday, when they had breaks and when they finished their work. 82 | Timeoff page shows all vacations, sick leaves, and any other PTO types.

      83 |
    • 84 |
    85 |
    86 | 87 |
    88 |
    89 |

    4.5 / 5 that's how people rate Everhour. See what 300+ reviewers are saying 90 | about us on popular platforms, such as Capterra, G2Crowd, or TrustRadius.Read what real people say.

    91 |
    92 | 93 |
    94 |

    Your questions. Answered!

    95 |

    Here is the list of the most frequent questions. If you’d have other questions or ideas — contact us.

    96 | 97 |
    98 |
    99 |
    Is Everhour easy to connect with Todoist?

    Yes. Just sign up with Everhour and invite your team. The next step would be to install our browser extension. And that's it! Open your Todoist and start tracking time.

    100 |
    How does Everhour for Todoist work?

    After integration, Everhour embeds controls into the Todoist interface and thus extends it with many useful features. You can keep tracking time from Todoist, through the Everhour website or browser extension.

    101 |
    What if not all my Todoist users need time tracking?

    No problem. You can invite and pay only for those Notion users who are going to track time and use other Everhour features.

    102 |
    Will someone else (like clients) see my time?

    Only those people who are a part of your Everhour team and installed our browser extension can see time-related data in Todoist.

    103 |
    Does Everhour work on Todoist native apps?

    Only those people who are a part of your Everhour team and installed our browser extension can see time-related data in Todoist.

    104 |
    105 |
    106 | 107 |
    108 |
    109 |

    Todoist time tracking with Everhour

    110 |

    Try Everhour + Todoist and your team will be 100% focused on progress!

    111 |
    112 |
    113 |
    114 | Or sign up with Google Account
    115 | 116 |
    117 |
    118 |
  • Works natively with Todoist
  • 119 |
  • Syncs automatically
  • 120 |
  • No long learning process
  • 121 |
  • Increase transparency
  • 122 |
  • Quick and easy to start
  • 123 |
  • 3,500+ happy customers
  • 124 |
    125 |
    126 | 127 | 128 | 129 | 130 | 143 | -------------------------------------------------------------------------------- /integrations.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | integration 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 29 |
    30 |
    31 |
    32 | 33 |
    34 |
    35 |

    Asana

    36 |

    Project Management

    37 | 38 |
    39 |
    40 |
    41 |
    42 | 43 |
    44 |
    45 |

    Basecamp

    46 |

    Project Management

    47 | 48 |
    49 |
    50 |
    51 |
    52 | 53 |
    54 |
    55 |

    BitBucket

    56 |

    Git Repository Service

    57 | 58 |
    59 |
    60 |
    61 |
    62 | 63 |
    64 |
    65 |

    ClickUp

    66 |

    Project Management

    67 | 68 |
    69 |
    70 |
    71 |
    72 | 73 |
    74 |
    75 |

    FreshBooks

    76 |

    Accounting

    77 | 78 |
    79 |
    80 |
    81 |
    82 | 83 |
    84 |
    85 |

    GitHub

    86 |

    Git Repository Service

    87 | 88 |
    89 |
    90 |
    91 |
    92 | 93 |
    94 |
    95 |

    Gitlab

    96 |

    Project Management

    97 | 98 |
    99 |
    100 |
    101 |
    102 | 103 |
    104 |
    105 |

    Insightly

    106 |

    CRM

    107 | 108 |
    109 |
    110 |
    111 |
    112 | 113 |
    114 |
    115 |

    JIRA

    116 |

    Project Management

    117 | 118 |
    119 |
    120 |
    121 |
    122 | 123 |
    124 |
    125 |

    Monday

    126 |

    Project Management

    127 | 128 |
    129 |
    130 |
    131 |
    132 | 133 |
    134 |
    135 |

    Notion

    136 |

    Project Management

    137 | 138 |
    139 |
    140 |
    141 |
    142 | 143 |
    144 |
    145 |

    Pivotal Tracker

    146 |

    Project Management

    147 | 148 |
    149 |
    150 |
    151 |
    152 | 153 |
    154 |
    155 |

    QuixkBooks

    156 |

    Accounting

    157 | 158 |
    159 |
    160 |
    161 |
    162 | 163 |
    164 |
    165 |

    Slack

    166 |

    Team Communication

    167 | 168 |
    169 |
    170 |
    171 |
    172 | 173 |
    174 |
    175 |

    Teamwork Projects

    176 |

    Project Management

    177 | 178 |
    179 |
    180 |
    181 |
    182 | 183 |
    184 |
    185 |

    Todoist

    186 |

    Project Management

    187 | 188 |
    189 |
    190 |
    191 |
    192 | 193 |
    194 |
    195 |

    Trello

    196 |

    Project Management

    197 | 198 |
    199 |
    200 |
    201 |
    202 | 203 |
    204 |
    205 |

    Xero

    206 |

    Accounting

    207 | 208 |
    209 |
    210 |
    211 |
    212 | 213 |
    214 |
    215 |

    Zapier

    216 |

    integration Software

    217 | 218 |
    219 |
    220 | 221 | 222 | 223 |
    224 |
    225 |

    Let’s get you started

    226 |

    Try Everhour for free and see if it works for your business

    227 | 228 | 229 |

    Or sign up with Google Account

    230 | 231 |
    232 | 233 | 234 | 235 | 236 | 237 | 238 | -------------------------------------------------------------------------------- /css/todoist.css: -------------------------------------------------------------------------------- 1 | 2 | #everhourSlack { 3 | width: 50%; 4 | margin: auto; 5 | margin-top: 100px; 6 | gap: 30px; 7 | } 8 | 9 | #everhourSlack>div>h2 { 10 | 11 | color: #333333; 12 | color: rgb(51, 51, 51); 13 | background-color: #000000; 14 | background-color: rgba(0, 0, 0, 0); 15 | font-family: geomanist-book, sans-serif; 16 | font-size: 36px; 17 | line-height: 43.92px; 18 | vertical-align: baseline; 19 | letter-spacing: normal; 20 | word-spacing: 0px; 21 | margin: 0px 0px 8px; 22 | padding: 0px; 23 | font-weight: 400; 24 | font-style: normal; 25 | font-variant: normal; 26 | text-transform: none; 27 | text-decoration: none solid rgb(51, 51, 51); 28 | text-align: center; 29 | text-indent: 0px; 30 | } 31 | 32 | #everhourSlack>div>h3 { 33 | color: #767676; 34 | color: rgb(118, 118, 118); 35 | background-color: #000000; 36 | background-color: rgba(0, 0, 0, 0); 37 | font-family: geomanist-regular, sans-serif; 38 | font-size: 18px; 39 | line-height: 25.92px; 40 | vertical-align: baseline; 41 | letter-spacing: normal; 42 | word-spacing: 0px; 43 | margin: 0px 0px 8px; 44 | padding: 0px; 45 | font-weight: 400; 46 | font-style: normal; 47 | font-variant: normal; 48 | text-transform: none; 49 | text-decoration: none solid rgb(118, 118, 118); 50 | text-align: center; 51 | text-indent: 0px; 52 | } 53 | 54 | button>div>img { 55 | width: 30px; 56 | height: 30px; 57 | } 58 | 59 | #btn{ 60 | display: flex; 61 | width: 250px; 62 | font-size: 18px; 63 | text-align: center; 64 | justify-content: center; 65 | align-items: center; 66 | margin: auto; 67 | margin-top: 50px; 68 | padding: 10px; 69 | background-color: #fff; 70 | color: #008d26; 71 | border: 1px #008d26 solid; 72 | border-radius: 5px; 73 | } 74 | 75 | #btn:hover { 76 | background-color: #22a745; 77 | border: none; 78 | color: white; 79 | } 80 | 81 | button>div:last-child { 82 | margin-left: 20px; 83 | } 84 | 85 | P { 86 | text-align: center; 87 | color: #767676; 88 | } 89 | 90 | #video { 91 | text-align: center; 92 | justify-content: center; 93 | align-items: center; 94 | margin-top: 60px; 95 | } 96 | 97 | #flex { 98 | display: grid; 99 | grid-template-columns: 1fr 2fr; 100 | gap: 100px; 101 | width: 90%; 102 | margin: auto; 103 | margin-top: 80px; 104 | } 105 | 106 | #grid { 107 | display: grid; 108 | grid-template-columns: repeat(2, 1fr); 109 | gap: 60px; 110 | } 111 | 112 | #grid>div>p { 113 | color: #7C7C7C; 114 | line-height: 23.04px; 115 | vertical-align: baseline; 116 | letter-spacing: normal; 117 | word-spacing: 0px; 118 | margin: 0px 0px 16px; 119 | padding: 0px; 120 | font-weight: 400; 121 | font-style: normal; 122 | font-variant: normal; 123 | text-transform: none; 124 | text-decoration: none solid rgb(124, 124, 124); 125 | text-align: start; 126 | text-indent: 0px; 127 | font-family: geomanist-regular, sans-serif; 128 | font-size: 16px; 129 | } 130 | 131 | #grid>div>h5 { 132 | color: #333232; 133 | line-height: 24px; 134 | vertical-align: baseline; 135 | letter-spacing: normal; 136 | word-spacing: 0px; 137 | margin: 0px 0px 8px; 138 | padding: 0px; 139 | font-weight: bold; 140 | font-style: normal; 141 | font-variant: normal; 142 | text-transform: none; 143 | text-decoration: none solid #333232; 144 | text-align: start; 145 | text-indent: 0px; 146 | font-family: geomanist-regular, sans-serif; 147 | font-size: 16px; 148 | } 149 | 150 | b { 151 | background-image: linear-gradient(-100deg, rgba(250, 247, 133, 0.3), rgba(250, 247, 133, 0.7) 95%, rgba(250, 247, 133, 0.1)); 152 | color: #767676; 153 | font-weight: 100; 154 | } 155 | 156 | #flex>div>h2 { 157 | color: #333333; 158 | line-height: 43.92px; 159 | vertical-align: baseline; 160 | letter-spacing: normal; 161 | font-size:36px; 162 | word-spacing: 0px; 163 | margin: 0px 0px 24px; 164 | padding: 0px; 165 | font-weight: bold; font-style: normal;font-variant: normal; text-transform: none; 166 | text-decoration: none solid rgb(51, 51, 51); text-align: start; text-indent: 0px 167 | } 168 | a{ 169 | text-decoration: underline; 170 | color:#5090e2; 171 | } 172 | #middle{ 173 | width:60%; 174 | margin:auto; 175 | margin-top: 140px; 176 | } 177 | #middle>ul>li>img{ 178 | width:100%; 179 | } 180 | #middle>ul>li{ 181 | margin:40px 0; 182 | } 183 | #middle>ul>li>strong{ 184 | color: #333333; 185 | line-height: 28px; 186 | vertical-align: baseline; 187 | letter-spacing: normal; 188 | word-spacing: 0px; 189 | margin: 0px ; 190 | padding: 0px; 191 | font-weight: bold; 192 | font-style: normal; 193 | font-variant: normal; 194 | text-transform: none; 195 | text-decoration: none solid rgb(51, 51, 51); 196 | text-align: left; 197 | text-indent: 0px; 198 | font-family: geomanist-regular, sans-serif; 199 | font-size: 22px; 200 | } 201 | #middle>ul>li>p{ 202 | color: #7C7C7C; 203 | line-height: 28px; 204 | vertical-align: baseline; 205 | letter-spacing: normal; 206 | word-spacing: 0px; 207 | margin: 24px 0 4px; 208 | padding: 0px; 209 | font-weight: 400; 210 | font-style: normal; 211 | font-variant: normal; 212 | text-transform: none; 213 | text-decoration: none solid rgb(51, 51, 51); 214 | text-align: left; 215 | text-indent: 0px; 216 | font-family: sans-serif; 217 | font-size: 20px; 218 | } 219 | #middle>ul>li::marker{ 220 | color:#57bb71; 221 | font-size: 30px; 222 | } 223 | h1{ 224 | text-align: left; 225 | font-size: 40px; 226 | color:#333232; 227 | } 228 | #star { 229 | display: grid; 230 | grid-template-columns: 1fr 2fr; 231 | background-color: #f6fbf7; 232 | padding: 40px; 233 | margin-top: 80px; 234 | margin-bottom: 40px; 235 | } 236 | 237 | #star>div>img { 238 | width: 40%; 239 | margin-left: 240px; 240 | margin-right: 0; 241 | padding: 0; 242 | background-color: #f6fbf7; 243 | } 244 | 245 | #star>div>p { 246 | color: #7C7C7C; 247 | font-family: geomanist-regular, sans-serif; 248 | font-size: 18px; 249 | line-height: 25.92px; 250 | vertical-align: baseline; 251 | letter-spacing: normal; 252 | word-spacing: 0px; 253 | margin: 0px; 254 | padding: 0px; 255 | font-weight: 400; 256 | font-style: normal; 257 | font-variant: normal; 258 | text-transform: none; 259 | text-decoration: none solid rgb(124, 124, 124); 260 | text-align: start; 261 | text-indent: 0px 262 | } 263 | #last { 264 | display: flex; 265 | width: 90%; 266 | margin: auto; 267 | margin-top: 200px; 268 | margin-bottom: 150px; 269 | } 270 | 271 | #input { 272 | font-size: 25px; 273 | width: 300px; 274 | padding: 10px; 275 | margin:20px 10px 20px 0px ; 276 | } 277 | #div{ 278 | display:flex; 279 | } 280 | #li{ 281 | margin-top: 40px; 282 | } 283 | #button { 284 | width: 160px; 285 | padding: 18px; 286 | margin-left: 10px; 287 | background-color: #57bb71; 288 | color: white; 289 | border: none; 290 | border-radius: 5px; 291 | margin:20px 0px 20px 0px ; 292 | } 293 | #button:hover{ 294 | box-shadow: 1px 1px 20px #6ecab3; 295 | } 296 | #last>div>div>i>img { 297 | width: 3%; 298 | } 299 | #last>div>div>i> { 300 | padding-top:10px; 301 | } 302 | #last>div>div>span>a{ 303 | padding-bottom: 5px; 304 | font-size: 20px; 305 | margin-left: 10px; 306 | color:#767676; 307 | } 308 | #last>div>li { 309 | color: #333333; 310 | line-height: 27px; 311 | vertical-align: baseline; 312 | letter-spacing: normal; 313 | word-spacing: 0px; 314 | font-size: 19px; 315 | font-style: normal; font-variant: normal; text-transform: none; 316 | text-decoration: none solid rgb(51, 51, 51); text-align: left; text-indent: 0px; 317 | } 318 | #last>div>li::marker{ 319 | color:#57bb71; 320 | font-size: 40px; 321 | 322 | } 323 | #last>div>h2{ 324 | 325 | color: #333333; 326 | color: rgb(51, 51, 51); 327 | background-color: #000000; 328 | background-color: rgba(0, 0, 0, 0); 329 | font-family: geomanist-book, sans-serif; 330 | font-size: 36px; 331 | line-height: 43.92px; 332 | vertical-align: baseline; 333 | letter-spacing: normal; 334 | word-spacing: 0px; 335 | font-weight: 400; 336 | font-style: normal; 337 | font-variant: normal; 338 | text-transform: none; 339 | text-decoration: none solid rgb(51, 51, 51); 340 | text-indent: 0px; 341 | } 342 | #last>div>h3,#source>h3{ 343 | color: #767676; 344 | color: rgb(118, 118, 118); 345 | background-color: #000000; 346 | background-color: rgba(0, 0, 0, 0); 347 | font-family: geomanist-regular, sans-serif; 348 | font-size: 18px; 349 | line-height: 25.92px; 350 | vertical-align: baseline; 351 | letter-spacing: normal; 352 | word-spacing: 0px; 353 | margin: 0px 0px 8px; 354 | padding: 0px; 355 | font-weight: 400; 356 | font-style: normal; 357 | font-variant: normal; 358 | text-transform: none; 359 | text-decoration: none solid rgb(118, 118, 118); 360 | text-indent: 0px; 361 | } 362 | #drop{ 363 | display:grid; 364 | grid-template-columns: 1fr 2fr; 365 | gap:100px; 366 | width:90%; 367 | margin:auto; 368 | } 369 | #drig{ 370 | margin-top: 50px; 371 | height:80%; 372 | display: grid; 373 | grid-template-columns: 1fr; 374 | } 375 | #drig>div{ 376 | margin-top: 30px; 377 | cursor: pointer; 378 | border-bottom: 0.5px #57bb71 solid; 379 | } 380 | .hide{ 381 | display:none; 382 | } 383 | .show:hover + .hide{ 384 | display:block; 385 | } 386 | .show{ 387 | color: #333333; 388 | color: rgb(51, 51, 51); 389 | background-color: #000000; 390 | background-color: rgba(0, 0, 0, 0); 391 | font-family: geomanist-book, sans-serif; 392 | font-size: 20px; 393 | line-height: 43.92px; 394 | vertical-align: baseline; 395 | letter-spacing: normal; 396 | word-spacing: 0px; 397 | font-weight: 400; 398 | font-style: normal; 399 | font-variant: normal; 400 | text-transform: none; 401 | text-decoration: none solid rgb(51, 51, 51); 402 | text-indent: 0px; 403 | } 404 | .hide{ 405 | color: #7C7C7C; 406 | line-height: 28px; 407 | vertical-align: baseline; 408 | letter-spacing: normal; 409 | font-weight: 400; 410 | font-style: normal; 411 | font-variant: normal; 412 | text-transform: none; 413 | text-decoration: none solid rgb(51, 51, 51); 414 | text-align: left; 415 | text-indent: 0px; 416 | font-family: sans-serif; 417 | font-size: 16px; 418 | } 419 | /* #drop>div{ 420 | border:red solid; 421 | } */ 422 | #source>h2{ 423 | color: #333333; 424 | color: rgb(51, 51, 51); 425 | background-color: #000000; 426 | background-color: rgba(0, 0, 0, 0); 427 | font-family: geomanist-book, sans-serif; 428 | font-size: 36px; 429 | vertical-align: baseline; 430 | letter-spacing: normal; 431 | word-spacing: 0px; 432 | font-weight: 300; 433 | font-style: normal; 434 | font-variant: normal; 435 | text-transform: none; 436 | text-decoration: none solid rgb(51, 51, 51); 437 | text-indent: 0px; 438 | } 439 | *{ 440 | margin:0; 441 | padding:0; 442 | } 443 | #nav{ 444 | display:grid; 445 | grid-template-columns: 0.5fr 2fr; 446 | height:70px; 447 | position: sticky; 448 | } 449 | #nav>div>a>img{ 450 | width:55%; 451 | } 452 | #nav>div:first-child{ 453 | padding:20px 0px 50px 50px; 454 | } 455 | #nav2{ 456 | display:flex; 457 | justify-content: space-between; 458 | } 459 | #nav3{ 460 | display:flex; 461 | gap:50px; 462 | justify-content: space-around; 463 | padding:30px 0px; 464 | color: #7C7C7C; 465 | font-family: geomanist-regular, sans-serif; 466 | text-decoration: none solid rgb(124, 124, 124); 467 | font-size: 20px; 468 | } 469 | #nav3>div>button{ 470 | padding:5px 10px; 471 | border:none; 472 | color:white; 473 | background-color: #57bb71; 474 | border-radius: 5px; 475 | } 476 | #nav3>div>button:hover{ 477 | color:black; 478 | } 479 | #nav3>div:hover{ 480 | /* color:black; */ 481 | font-weight: bold; 482 | } 483 | #nav4>button{ 484 | padding:10px; 485 | border:none; 486 | color:white; 487 | background-color: #57bb71; 488 | border-radius: 5px; 489 | font-size: 18px; 490 | margin-left: 20px; 491 | } 492 | #nav4{ 493 | justify-content: space-around; 494 | padding:30px 0px; 495 | color: #7C7C7C; 496 | font-family: geomanist-regular, sans-serif; 497 | text-decoration: none solid rgb(124, 124, 124); 498 | font-size: 20px; 499 | margin-right:50px; 500 | } 501 | #nav4>span{ 502 | margin-left:30px; 503 | } 504 | #nav4>span:hover{ 505 | color:black; 506 | font-weight: bold; 507 | } 508 | #int{ 509 | width:250px;border:1px solid black;padding:10px; 510 | } 511 | #int>div>div>img{ 512 | width:15%; 513 | margin-right:5px; 514 | } 515 | #grid{ 516 | display:grid; 517 | grid-template-columns: repeat(2,1fr); 518 | row-gap:20px; 519 | } 520 | #inte{ 521 | margin-top:15px; 522 | border-top: 1px solid #7C7C7C; 523 | padding:10px; 524 | } 525 | #p{ 526 | margin-top: 20px; 527 | } -------------------------------------------------------------------------------- /GitLab.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | GitLab 9 | 10 | 11 | 12 | 13 | 14 | 15 |
    16 |
    17 |

    GitLab time tracking integration

    18 |

    Accurate time tracker with robust reporting, budgeting, and payroll. 19 | Works perfectly inside GitLab. No more tab switching!

    20 | 21 |

    Free to try • No credit card required • 1-minute signup

    22 |
    23 |
    24 | 25 |
    26 |
    27 |
    28 |

    Why Everhour is the best time tracking integration for GitLab on the market?

    29 | 30 |
    31 |
    32 |
    33 |

    When you connect GitLab with Everhour timesheet app, we will automatically sync your projects so that your team can start tracking time right away. No manual project setup required.

    34 |

    35 |
    36 |

    2. Less employee teaching

    37 |

    You don’t need to explain to your staff how to use additional employee time tracking software. Time tracking controls will appear right inside the GitLab interface, making it easy for them to track time.

    38 |
    39 |
    40 |

    3. Accuracy

    41 |

    Employees often forget to track time as it's not convenient for them to switch between time clock app and project management app. Everhour eliminates these steps and improves time tracking accuracy.

    42 |
    43 |
    44 |

    4. Estimates are always in front of you

    45 |

    Everhour shows time vs. estimate beside task titles. When the entire team sees progress on tasks, they will hold you accountable for ensuring work is done.

    46 |
    47 |
    48 |

    5. Automatic updates

    49 |

    GitLab time tracking reports let you organize reported time using various information from your GitLab tasks such as tags, milestones, or custom fields. So you can dive deeper into tracked work hours analysis to get more accurate results.

    50 |
    51 |
    52 |

    6. Detailed reports

    53 |

    GitLab time tracking reports let you organize reported time using various information from your GitLab tasks such as tags, sections, or custom fields. So you can dive deeper into analysis to get more accurate results.

    54 |
    55 |
    56 |
    57 |
    58 |

    How to track time in GitLab

    59 |

    Step 1: Create an Everhour account

    60 |

    Sign up for free and install our browser extension. This is how we embed controls into the GitLab interface. We support all popular browsers: Chrome, Firefox, Safari, Edge.

    61 |

    Step 2: Connect Everhour and GitLab

    62 |

    After signup, Everhour will automatically sync all your projects. Sync happens periodically so all new projects that you create in GitLab will be visible in Everhour reports. Everhour also updates the names of tasks or projects if they were renamed in GitLab. This way Everhour reports will always show you the freshest data.

    63 | 64 | 65 |

    Step 3: Invite your team

    66 |

    You need to invite your team to join Everhour. They will also need to connect their GitLab accounts and install our browser extension. Only those you invite into Everhour will be able to track time and see time progress (not necessarily all GitLab users). Your clients or guests will not see anything in GitLab unless you invite them.

    67 |

    Step 4: Track time inside GitLab

    68 | 69 |

    You can track time using the timer or log time manually. You’ll see the time reported by each employee and its progress.

    70 | 71 | 72 |

    Step 5: Track time via the Everhour browser extension

    73 |

    You don't necessarily need to open GitLab or Everhour website. By clicking on the timer icon in the browser toolbar you can quickly start the timer, add time to any task, edit time or estimate, and more.

    74 | 75 |

    Step 6: Make custom reports with GitLab data

    76 |

    There are a number of columns that show specific data coming from GitLab. Open GitLab time tracking report builder and select any of the columns to display the data in your report.

    77 | 78 |

    Step 7: Find out more...

    79 |

    Timers page shows what your team is doing right now. Timesheet page helps to view the structured picture of the time a member spent for a week. Timecard page displays when a user started their workday, when they had breaks and when they finished their work. Timeoff page shows all vacations, sick leaves, and any other PTO types. 80 | 81 |

    82 | 83 |
    84 |
    85 | 86 |

    4.5 of 5 is how people usually rate Everhour. Based on 500+ reviews on such popular platforms as Capterra, G2Crowd, or TrustRadius. Read what real people say.

    87 |
    88 |
    89 |
    90 |

    Your questions. Answered!

    91 |

    Here is the list of the most frequent questions. If you’d have other questions or ideas — contact us.

    92 | 93 |
    94 |
    95 |
    96 |

    Is Everhour easy to connect with GitHub? 97 |

    98 | 99 |
    100 |
    101 |
    102 |

    How does Everhour for GitHub work?

    103 | 104 |
    105 |
    106 |
    107 |

    Why does Everhour need read and write access to GitHub repos?

    108 | 109 |
    110 |
    111 |
    112 |

    What if not all my GitHub users need time tracking?

    113 | 114 |
    115 |
    116 |
    117 |

    Will someone else (like clients) see my time in GitHub?

    118 | 119 |
    120 |
    121 |
    122 |

    How to invite other GitHub users to Everhour?

    123 | 124 |
    125 |
    126 |
    127 |

    Does Everhour work on GitHub native apps?

    128 | 129 |
    130 |
    131 |
    132 |
    133 |
    134 |

    A time tracker you can trust for life

    135 |
    136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 |
    147 |
    148 |
    149 |
    150 |

    “Overall a great and very affordable software with just the right amount of very robust and well thought out features! The perfect tool for freelancers and companies! I hate wasting time on complex software. Everhour just gets out of my way so I can get work done. Very responsive and helpful support! GitHub integration is fantastic and makes time tracking a lot easier and faster! I can build detailed reports of my work for clients. Exporting invoices directly to Freshbooks perfectly integrates my time tracking with my invoicing workflow. The app allows me to quickly start/stop timers when I forgot to do so on the web.”

    151 |

    — Benjamin W. (Source: Capterra)

    152 |
    153 |
    154 |

    “I am the owner of the company, and I use Everhour for timekeeping of myself and my subcontractors. All team members use the system - from web developers to tech support to project management to design.” 155 | 156 |

    157 |

    158 | — Jennifer H. (Source: TrustRadius) 159 |

    160 |
    161 |
    162 |

    "The best time tracker for GitHub. Close integration to GitHub allows us to work with estimates and man-hours with ease. Flexible reporting satisfies our needs. Built-in calculations of projects costs and budgets control are cool."

    163 |

    — Mike D. (Source: G2.com)

    164 |
    165 |
    166 |

    “We are a 15 people team working remotely from different cities of Latin America and Europe, and time tracking for each client, project, and task has been always a major issue. We’ve been using Everhour for the past year or so, and it has become an essential tool for our team. It does not only give us the ability to track how much time we have dedicated to a project, but also to estimate how much time a particular task will need in order to be completed next time and by who. Easily create and save reports with just a few clicks”

    167 |

    — Daniel Y. (Source: TrustRadius)

    168 |
    169 |
    170 |

    “Everhour is being used by my department now, but it’s planned to be used across the whole company. We were having problems tracking the times of every project and Everhour ended up being the best solution to the issue. We’re tracking our tasks involved in every project, in every level (software development, meetings, project management, etc.)”

    171 |

    172 | — Maria Lucia S. (Source: TrustRadius) 173 |

    174 |
    175 |
    176 |

    “Everhour has already paid for itself for the year by helping me track time I was missing in client projects. It is easy to use, has friendly customer service people, and the reports make it easy to invoice clients and track projects.”

    177 |

    — Jennifer D. (Source: TrustRadius)

    178 |
    179 | 180 |
    181 |
    182 | 183 |
    184 |
    185 |
    186 |

    GitHub time tracking done right

    187 |

    Try Everhour for free and see the results

    188 |
    189 | 190 | 193 |
    194 |
    195 | 196 |

    197 | Or sign up with Google Account

    198 |
    199 |
    200 |
      201 |
    • 202 | Works natively with GitHub
    • 203 |
    • Syncs automatically
    • 204 |
    • Quick and easy to start
    • 205 |
    • 3,500+ happy customers
    • 206 |
    207 |
    208 |
    209 | 210 | 211 | 212 | 213 | 214 | --------------------------------------------------------------------------------