From 999fa029f93265ff47ebe916e9fd2a9022c337ca Mon Sep 17 00:00:00 2001
From: Mitisha Agarwal <mitisha310@gmail.com>
Date: Fri, 27 Nov 2020 01:04:38 +0530
Subject: [PATCH 1/9] --- Auto-Git Commit ---
---
assets/css/style.css | 61 ++++++++++++++++++++------------------------
1 file changed, 28 insertions(+), 33 deletions(-)
diff --git a/assets/css/style.css b/assets/css/style.css
index abf5b26..9734309 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1,3 +1,11 @@
+:root{
+ --primary-color: #1bb1dc;
+ --secondary-color: #0a98c0;
+ --white-color: #ffffff;
+
+}
+
+
body {
background: #fff;
color: #444;
@@ -5,14 +13,14 @@ body {
}
a {
- color: #1bb1dc;
+ color: var(--primary-color);
transition: 0.5s;
}
a:hover,
a:active,
a:focus {
- color: #0a98c0;
+ color: var(--secondary-color);
outline: none;
text-decoration: none;
}
@@ -38,7 +46,7 @@ h6 {
.back-to-top {
position: fixed;
display: none;
- background: #1bb1dc;
+ background: var(--primary-color);
color: #fff;
width: 54px;
height: 54px;
@@ -81,7 +89,7 @@ h6 {
top: calc(50% - 30px);
left: calc(50% - 30px);
border: 6px solid #f2f2f2;
- border-top: 6px solid #1bb1dc;
+ border-top: 6px solid var(--primary-color);
border-radius: 50%;
width: 60px;
height: 60px;
@@ -134,7 +142,7 @@ h6 {
}
#topbar .social-links a:hover {
- color: #1bb1dc;
+ color:var(--primary-color);
}
#topbar .social-links a:first-child {
@@ -248,7 +256,7 @@ h6 {
.main-nav a:hover,
.main-nav .active > a,
.main-nav li:hover > a {
- color: #1bb1dc;
+ color: var(--primary-color);
text-decoration: none;
}
@@ -288,7 +296,7 @@ h6 {
.main-nav .drop-down ul a:hover,
.main-nav .drop-down ul .active > a,
.main-nav .drop-down ul li:hover > a {
- color: #1bb1dc;
+ color: var(--primary-color);
}
.main-nav .drop-down > a:after {
@@ -467,7 +475,7 @@ h6 {
}
#hero .intro-info h2 span {
- color: #1bb1dc;
+ color: var(--primary-color);
}
@media (max-width: 767px) {
@@ -489,13 +497,14 @@ h6 {
border-radius: 4px;
transition: 0.5s;
color: #fff;
- background: #1bb1dc;
+ background: var(--primary-color);
color: #fff;
}
#hero .intro-info .btn-get-started:hover,
#hero .intro-info .btn-services:hover {
- background: #0a98c0;
+ background: color: var(--secondary-color);
+;
}
/*--------------------------------------------------------------
@@ -568,7 +577,7 @@ h6 {
#about .about-content ul li i {
font-size: 20px;
padding-right: 4px;
- color: #1bb1dc;
+ color: var(--primary-color);
float: left;
}
@@ -661,7 +670,7 @@ h6 {
}
#services .box:hover .title a {
- color: #1bb1dc;
+ color: var(--primary-color);
}
#services .description {
@@ -769,8 +778,8 @@ h6 {
}
#call-to-action .cta-btn:hover {
- background: #1bb1dc;
- border: 3px solid #1bb1dc;
+ background: var(--primary-color);
+ border: 3px solid var(--primary-color);
}
/* Features Section
@@ -971,21 +980,6 @@ h6 {
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
/* Testimonials Section
--------------------------------*/
#testimonials {
@@ -1066,7 +1060,7 @@ h6 {
}
#testimonials .owl-dot.active {
- background-color: #1bb1dc;
+ background-color: var(--primary-color);
}
/*Sponsors
@@ -1183,7 +1177,7 @@ img {
}
#faq #faq-list a.collapse {
- color: #1bb1dc;
+ color: var(--primary-color);
}
#faq #faq-list a.collapsed {
@@ -1236,7 +1230,7 @@ img {
#footer .footer-top .social-links a {
font-size: 18px;
display: inline-block;
- background: #1bb1dc;
+ background: var(--primary-color);
color: #fff;
line-height: 1;
padding: 8px 0;
@@ -1249,7 +1243,8 @@ img {
}
#footer .footer-top .social-links a:hover {
- background: #0a98c0;
+ background: color: var(--secondary-color);
+;
color: #fff;
}
From 83bfaae2917eb14a4104b62556d67c890ec9a2c7 Mon Sep 17 00:00:00 2001
From: Mitisha Agarwal <mitisha310@gmail.com>
Date: Fri, 27 Nov 2020 01:34:58 +0530
Subject: [PATCH 2/9] --- Auto-Git Commit ---
---
assets/css/style.css | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/assets/css/style.css b/assets/css/style.css
index 9734309..4757544 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -2,7 +2,7 @@
--primary-color: #1bb1dc;
--secondary-color: #0a98c0;
--white-color: #ffffff;
-
+ var(--white-color)
}
From 64edb552a51f59ab20d48c6dad21a8a4b3f67cfb Mon Sep 17 00:00:00 2001
From: Mitisha Agarwal <mitisha310@gmail.com>
Date: Fri, 27 Nov 2020 16:13:41 +0530
Subject: [PATCH 3/9] --- Auto-Git Commit ---
---
assets/css/style.css | 90 ++++++++++++++++++++++++--------------------
1 file changed, 49 insertions(+), 41 deletions(-)
diff --git a/assets/css/style.css b/assets/css/style.css
index 4757544..a7ef339 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -2,12 +2,16 @@
--primary-color: #1bb1dc;
--secondary-color: #0a98c0;
--white-color: #ffffff;
- var(--white-color)
+ --purple-light: #535074;
+ --purple-dark1: #413e66;
+ --white-dark: #f2f2f2;
+
+
}
body {
- background: #fff;
+ background: var(--white-color);
color: #444;
font-family: "Open Sans", sans-serif;
}
@@ -47,7 +51,7 @@ h6 {
position: fixed;
display: none;
background: var(--primary-color);
- color: #fff;
+ color: var(--white-color);
width: 54px;
height: 54px;
text-align: center;
@@ -62,7 +66,7 @@ h6 {
.back-to-top i {
padding-top: 17px;
- color: #fff;
+ color: var(--white-color);
}
@media (max-width: 768px) {
@@ -80,7 +84,7 @@ h6 {
bottom: 0;
z-index: 9999;
overflow: hidden;
- background: #fff;
+ background: var(--white-color);
}
#preloader:before {
@@ -88,7 +92,7 @@ h6 {
position: fixed;
top: calc(50% - 30px);
left: calc(50% - 30px);
- border: 6px solid #f2f2f2;
+ border: 6px solid var(--white-dark);
border-top: 6px solid var(--primary-color);
border-radius: 50%;
width: 60px;
@@ -112,7 +116,11 @@ h6 {
}
100% {
transform: rotate(360deg);
- }
+ -webkit-transform: rotate(360deg);
+ -moz-transform: rotate(360deg);
+ -ms-transform: rotate(360deg);
+ -o-transform: rotate(360deg);
+}
}
/*--------------------------------------------------------------
@@ -135,7 +143,7 @@ h6 {
}
#topbar .social-links a {
- color: #535074;
+ color: var(--purple-light);
padding: 4px 12px;
display: inline-block;
line-height: 1px;
@@ -170,7 +178,7 @@ h6 {
#header.header-pages {
height: 70px;
padding: 15px 0;
- background-color: #fff;
+ background-color: var(--white-color);
box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.3);
}
@@ -205,7 +213,7 @@ h6 {
#header .logo h1 a,
#header .logo h1 a:hover {
- color: #413e66;
+ color: var(--purple-dark1);
text-decoration: none;
}
@@ -244,7 +252,7 @@ h6 {
.main-nav a {
display: block;
position: relative;
- color: #413e66;
+ color: var(--purple-dark1);
padding: 10px 15px;
transition: 0.3s;
font-size: 14px;
@@ -269,7 +277,7 @@ h6 {
opacity: 0;
visibility: hidden;
padding: 10px 0;
- background: #fff;
+ background: var(--white-color);
box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
transition: ease all 0.3s;
}
@@ -349,7 +357,7 @@ h6 {
.mobile-nav a {
display: block;
position: relative;
- color: #fff;
+ color: var(--white-color);
padding: 10px 20px;
font-weight: 500;
}
@@ -427,7 +435,7 @@ h6 {
}
.mobile-nav-active .mobile-nav-toggle i {
- color: #fff;
+ color: var(--white-color);
}
/*--------------------------------------------------------------
@@ -468,7 +476,7 @@ h6 {
}
#hero .intro-info h2 {
- color: #413e66;
+ color: var(--purple-dark1);
margin-bottom: 40px;
font-size: 48px;
font-weight: 700;
@@ -496,9 +504,9 @@ h6 {
padding: 10px 32px;
border-radius: 4px;
transition: 0.5s;
- color: #fff;
+ color: var(--white-color);
background: var(--primary-color);
- color: #fff;
+ color: var(--white-color);
}
#hero .intro-info .btn-get-started:hover,
@@ -514,7 +522,7 @@ h6 {
--------------------------------*/
.section-header h3 {
font-size: 36px;
- color: #413e66;
+ color: var(--purple-dark1);
text-align: center;
font-weight: 700;
position: relative;
@@ -526,7 +534,7 @@ h6 {
margin: auto;
font-size: 15px;
padding-bottom: 60px;
- color: #535074;
+ color: var(--purple-light);
width: 50%;
}
@@ -553,7 +561,7 @@ h6 {
}
#about .about-content h2 {
- color: #413e66;
+ color: var(--purple-dark1);
font-family: "Montserrat", sans-serif;
font-weight: 700;
}
@@ -589,7 +597,7 @@ h6 {
#about .about-img img {
width: 100%;
- border: 8px solid #fff;
+ border: 8px solid var(--white-color);
transition: 0.5s;
}
@@ -634,7 +642,7 @@ h6 {
overflow: hidden;
border-radius: 10px;
margin: 0 10px 40px 10px;
- background: #fff;
+ background: var(--white-color);
box-shadow: 0 10px 29px 0 rgba(68, 88, 144, 0.1);
transition: all 0.3s ease-in-out;
text-align: center;
@@ -707,7 +715,7 @@ h6 {
font-size: 24px;
font-weight: 600;
margin-left: 56px;
- color: #413e66;
+ color: var(--purple-dark1);
margin-bottom: 5px;
}
@@ -746,13 +754,13 @@ h6 {
}
#call-to-action .cta-title {
- color: #fff;
+ color: var(--white-color);
font-size: 28px;
font-weight: 700;
}
#call-to-action .cta-text {
- color: #fff;
+ color: var(--white-color);
}
@media (min-width: 991px) {
@@ -773,8 +781,8 @@ h6 {
border-radius: 3px;
transition: 0.5s;
margin: 10px;
- border: 3px solid #fff;
- color: #fff;
+ border: 3px solid var(--white-color);
+ color: var(--white-color);
}
#call-to-action .cta-btn:hover {
@@ -856,14 +864,14 @@ h6 {
right: -14px;
display: inline-block;
border-top: 14px solid transparent;
- border-left: 14px solid #fff;
- border-right: 0 solid #fff;
+ border-left: 14px solid var(--white-color);
+ border-right: 0 solid var(--white-color);
border-bottom: 14px solid transparent;
content: " ";
}
.timeline > li > .timeline-badge {
- color: #fff;
+ color: var(--white-color);
width: 50px;
height: 50px;
line-height: 50px;
@@ -921,7 +929,7 @@ h6 {
.timeline-title {
margin-top: 0;
- color: #413e66;
+ color: var(--purple-dark1);
}
.timeline-body > p,
@@ -941,7 +949,7 @@ h6 {
}
.timeline-heading:hover{
- color: #413e66;
+ color: var(--purple-dark1);
}
.timeline-heading:focus{
@@ -999,7 +1007,7 @@ h6 {
#testimonials .testimonial-item .testimonial-img {
width: 120px;
border-radius: 50%;
- border: 4px solid #fff;
+ border: 4px solid var(--white-color);
float: left;
}
@@ -1195,7 +1203,7 @@ img {
padding: 0 0 30px 0;
font-size: 14px;
text-align: center;
- background: #fff;
+ background: var(--white-color);
}
#footer .footer-top {
@@ -1213,7 +1221,7 @@ img {
padding: 2px 0 2px 0;
line-height: 1;
font-family: "Montserrat", sans-serif;
- color: #413e66;
+ color: var(--purple-dark1);
font-weight: 400;
letter-spacing: 3px;
text-transform: uppercase;
@@ -1224,14 +1232,14 @@ img {
line-height: 24px;
margin-bottom: 0;
font-family: "Montserrat", sans-serif;
- color: #535074;
+ color: var(--purple-light);
}
#footer .footer-top .social-links a {
font-size: 18px;
display: inline-block;
background: var(--primary-color);
- color: #fff;
+ color: var(--white-color);
line-height: 1;
padding: 8px 0;
margin-right: 4px;
@@ -1245,7 +1253,7 @@ img {
#footer .footer-top .social-links a:hover {
background: color: var(--secondary-color);
;
- color: #fff;
+ color: var(--white-color);
}
@media (max-width: 574px) {
@@ -1257,7 +1265,7 @@ img {
#footer .footer-top h4 {
font-size: 14px;
font-weight: bold;
- color: #413e66;
+ color: var(--purple-dark1);
text-transform: uppercase;
position: relative;
padding-bottom: 10px;
@@ -1281,10 +1289,10 @@ img {
/* Handle */
::-webkit-scrollbar-thumb {
- background: #535074;
+ background: var(--purple-light);
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
- background:#413e66;
+ background:var(--purple-dark1);
}
\ No newline at end of file
From f189e9997b6cec8aebea76a1808f5923a92d75e8 Mon Sep 17 00:00:00 2001
From: Mitisha Agarwal <mitisha310@gmail.com>
Date: Fri, 27 Nov 2020 18:21:43 +0530
Subject: [PATCH 4/9] --- Auto-Git Commit ---
---
assets/css/style.css | 170 +++++++++++++++++++++++++++++++++++++------
assets/js/main.js | 35 +++++++++
index.html | 10 +++
3 files changed, 192 insertions(+), 23 deletions(-)
diff --git a/assets/css/style.css b/assets/css/style.css
index a7ef339..8ad7997 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -5,8 +5,39 @@
--purple-light: #535074;
--purple-dark1: #413e66;
--white-dark: #f2f2f2;
+ --blue-dark: #8dc2fa;
+ --white-dark2: #f5f8fd;
+ --blue-color2: #065e77;
+ --white-dark3: #ebf1fa;
+ --purple-dark2: #8a87b6;
+ --purple-dark3: #696592;
+ --black: #000;
+ --grey: #ccc;
+ --purple-dark4: #2d2b46;
+ --grey1: #999999;
+ --grey2: #111111;
+ --purple-dark5: #ffffff;
-
+}
+
+[data-theme="dark"] {
+ --primary-color: #1bb1dc;
+ --secondary-color: #0a98c0;
+ --white-color: #000000;
+ --purple-light: #535074;
+ --purple-dark1: #413e66;
+ --white-dark: #ffffff;
+ --blue-dark: #8dc2fa;
+ --white-dark2: #ffffff;
+ --blue-color2: #065e77;
+ --white-dark3: #ebf1fa;
+ --purple-dark2: #8a87b6;
+ --purple-dark3: #696592;
+ --black: #ffffff;
+ --grey: #ffffff;
+ --purple-dark4: #2d2b46;
+ --grey1: #ffffff;
+ --grey2: #ffffff;
}
@@ -99,6 +130,10 @@ h6 {
height: 60px;
-webkit-animation: animate-preloader 1s linear infinite;
animation: animate-preloader 1s linear infinite;
+ -webkit-border-radius: 50%;
+ -moz-border-radius: 50%;
+ -ms-border-radius: 50%;
+ -o-border-radius: 50%;
}
@-webkit-keyframes animate-preloader {
@@ -107,7 +142,11 @@ h6 {
}
100% {
transform: rotate(360deg);
- }
+ -webkit-transform: rotate(360deg);
+ -moz-transform: rotate(360deg);
+ -ms-transform: rotate(360deg);
+ -o-transform: rotate(360deg);
+}
}
@keyframes animate-preloader {
@@ -172,6 +211,10 @@ h6 {
right: 0;
transition: all 0.5s;
z-index: 997;
+ -webkit-transition: all 0.5s;
+ -moz-transition: all 0.5s;
+ -ms-transition: all 0.5s;
+ -o-transition: all 0.5s;
}
#header.header-scrolled,
@@ -280,6 +323,10 @@ h6 {
background: var(--white-color);
box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
transition: ease all 0.3s;
+ -webkit-transition: ease all 0.3s;
+ -moz-transition: ease all 0.3s;
+ -ms-transition: ease all 0.3s;
+ -o-transition: ease all 0.3s;
}
.main-nav .drop-down:hover > ul {
@@ -298,7 +345,7 @@ h6 {
font-size: 14px;
font-weight: 500;
text-transform: none;
- color: #065e77;
+ color: var(--blue-color2);
}
.main-nav .drop-down ul a:hover,
@@ -346,6 +393,10 @@ h6 {
padding-top: 18px;
background: rgba(40, 38, 70, 0.8);
transition: 0.4s;
+ -webkit-transition: 0.4s;
+ -moz-transition: 0.4s;
+ -ms-transition: 0.4s;
+ -o-transition: 0.4s;
}
.mobile-nav * {
@@ -365,7 +416,7 @@ h6 {
.mobile-nav a:hover,
.mobile-nav .active > a,
.mobile-nav li:hover > a {
- color: #8dc2fa;
+ color: var(--blue-dark);
text-decoration: none;
}
@@ -407,11 +458,15 @@ h6 {
line-height: 1;
cursor: pointer;
text-align: right;
+ -webkit-transition: all 0.4s;
+ -moz-transition: all 0.4s;
+ -ms-transition: all 0.4s;
+ -o-transition: all 0.4s;
}
.mobile-nav-toggle i {
margin: 18px 18px 0 0;
- color: #065e77;
+ color: var(--blue-color2);
}
.mobile-nav-overly {
@@ -445,7 +500,7 @@ h6 {
width: 100%;
height: 100vh;
position: relative;
- background: #f5f8fd url("../img/intro-bg.jpg") center top no-repeat;
+ background: var(--white-dark2) url("../img/intro-bg.jpg") center top no-repeat;
background-size: cover;
}
@@ -507,6 +562,10 @@ h6 {
color: var(--white-color);
background: var(--primary-color);
color: var(--white-color);
+ -webkit-transition: 0.5s;
+ -moz-transition: 0.5s;
+ -ms-transition: 0.5s;
+ -o-transition: 0.5s;
}
#hero .intro-info .btn-get-started:hover,
@@ -547,7 +606,7 @@ h6 {
/* Section with background
--------------------------------*/
.section-bg {
- background: #f5f8fd;
+ background: var(--white-dark2);
}
/* About Us Section
@@ -567,7 +626,7 @@ h6 {
}
#about .about-content h3 {
- color: #696592;
+ color: var(--purple-dark3);
font-weight: 400;
font-size: 22px;
font-style: italic;
@@ -614,7 +673,7 @@ h6 {
height: 92%;
z-index: -1;
content: "";
- background-color: #ebf1fa;
+ background-color: var(--white-dark3);
transition: 0.5s;
}
@@ -626,7 +685,7 @@ h6 {
height: 92%;
z-index: -1;
content: "";
- background-color: #ebf1fa;
+ background-color: var(--white-dark3);
transition: 0.5s;
}
@@ -674,7 +733,7 @@ h6 {
}
#services .title a {
- color: #111;
+ color: var(grey2);
}
#services .box:hover .title a {
@@ -704,6 +763,10 @@ h6 {
margin: 0 0 15px 0;
padding: 0;
transition: 0.3s ease-in-out;
+ -webkit-transition: 0.3s ease-in-out;
+ -moz-transition: 0.3s ease-in-out;
+ -ms-transition: 0.3s ease-in-out;
+ -o-transition: 0.3s ease-in-out;
}
#why-us .why-us-content .features i {
@@ -722,7 +785,7 @@ h6 {
#why-us .why-us-content .features p {
font-size: 16px;
margin-left: 56px;
- color: #555186;
+ color: var(--purple-dark5);
}
#why-us .counters {
@@ -742,13 +805,13 @@ h6 {
margin: 0 0 20px 0;
font-family: "Montserrat", sans-serif;
font-size: 14px;
- color: #8a87b6;
+ color: var(--purple-dark2);
}
/* Call To Action Section
--------------------------------*/
#call-to-action {
- background: #2d2b46;
+ background: var(--purple-dark4);
background-size: cover;
padding: 40px 0;
}
@@ -852,8 +915,8 @@ h6 {
right: -15px;
display: inline-block;
border-top: 15px solid transparent;
- border-left: 15px solid #ccc;
- border-right: 0 solid #ccc;
+ border-left: 15px solid var(--grey);
+ border-right: 0 solid var(--grey);
border-bottom: 15px solid transparent;
content: " ";
}
@@ -881,7 +944,7 @@ h6 {
top: 16px;
left: 50%;
margin-left: -25px;
- background-color: #999999;
+ background-color: var(--grey1);
z-index: 100;
border-top-right-radius: 50%;
border-top-left-radius: 50%;
@@ -1022,13 +1085,13 @@ h6 {
font-size: 20px;
font-weight: bold;
margin: 10px 0 5px 0;
- color: #111;
+ color: var(--grey2);
margin-left: 140px;
}
#testimonials .testimonial-item h4 {
font-size: 14px;
- color: #999;
+ color: var(--grey1);
margin: 0 0 15px 0;
margin-left: 140px;
}
@@ -1075,7 +1138,7 @@ h6 {
------------------------*/
#sponsors {
padding: 40px;
- background-color: #f5f8fd;
+ background-color: var(--white-dark2);
}
.section-header h4 {
font-weight: 500;
@@ -1189,7 +1252,7 @@ img {
}
#faq #faq-list a.collapsed {
- color: #000;
+ color: var(--black);
}
#faq #faq-list a.collapsed i::before {
@@ -1208,7 +1271,7 @@ img {
#footer .footer-top {
padding: 60px 0 30px 10px;
- background: #f5f8fd;
+ background: var(--white-dark2);
}
#footer .footer-top .footer-info {
@@ -1284,7 +1347,7 @@ img {
/* Track */
::-webkit-scrollbar-track {
- background: #f5f8fd;
+ background: var(--white-dark2);
}
/* Handle */
@@ -1295,4 +1358,65 @@ img {
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background:var(--purple-dark1);
+}
+
+
+// toggle button
+
+.theme-switch-wrapper {
+ display: flex;
+ align-items: center;
+
+ em {
+ margin-left: 10px;
+ font-size: 1rem;
+ }
+}
+.theme-switch {
+ display: inline-block;
+ height: 34px;
+ position: relative;
+ width: 60px;
+}
+
+.theme-switch input {
+ display:none;
+}
+
+.slider {
+ background-color: #ccc;
+ bottom: 0;
+ cursor: pointer;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ transition: .4s;
+}
+
+.slider:before {
+ background-color: #fff;
+ bottom: 4px;
+ content: "";
+ height: 26px;
+ left: 4px;
+ position: absolute;
+ transition: .4s;
+ width: 26px;
+}
+
+input:checked + .slider {
+ background-color: #66bb6a;
+}
+
+input:checked + .slider:before {
+ transform: translateX(26px);
+}
+
+.slider.round {
+ border-radius: 34px;
+}
+
+.slider.round:before {
+ border-radius: 50%;
}
\ No newline at end of file
diff --git a/assets/js/main.js b/assets/js/main.js
index c107485..1da34e9 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -219,3 +219,38 @@
});
});
})(jQuery);
+
+ const toggleSwitch = document.querySelector('.theme-switch input[type="checkbox"]');
+
+function switchTheme(e) {
+ if (e.target.checked) {
+ document.documentElement.setAttribute('data-theme', 'dark');
+ }
+ else {
+ document.documentElement.setAttribute('data-theme', 'light');
+ }
+}
+
+toggleSwitch.addEventListener('change', switchTheme, false);
+
+function switchTheme(e) {
+ if (e.target.checked) {
+ document.documentElement.setAttribute('data-theme', 'dark');
+ localStorage.setItem('theme', 'dark'); //add this
+ }
+ else {
+ document.documentElement.setAttribute('data-theme', 'light');
+ localStorage.setItem('theme', 'light'); //add this
+ }
+}
+
+const currentTheme = localStorage.getItem('theme') ? localStorage.getItem('theme') : null;
+
+if (currentTheme) {
+ document.documentElement.setAttribute('data-theme', currentTheme);
+
+ if (currentTheme === 'dark') {
+ toggleSwitch.checked = true;
+ }
+}
+
diff --git a/index.html b/index.html
index d3689fe..5d85e1e 100644
--- a/index.html
+++ b/index.html
@@ -65,6 +65,16 @@
</div>
</div>
+ <!-- Toggle button -->
+ <div class="theme-switch-wrapper">
+ <label class="theme-switch" for="checkbox">
+ <input type="checkbox" id="checkbox" />
+ <div class="slider round"></div>
+ </label>
+ <em>Enable Dark Mode!</em>
+ </div>
+
+
<div class="container">
<div class="logo float-left">
From 1b0c112cbb6aed170bc2ab3063c4fe03a7912b5f Mon Sep 17 00:00:00 2001
From: Mitisha Agarwal <mitisha310@gmail.com>
Date: Sat, 28 Nov 2020 22:05:55 +0530
Subject: [PATCH 5/9] --- Auto-Git Commit ---
---
assets/css/style.css | 9 +++------
index.html | 1 -
2 files changed, 3 insertions(+), 7 deletions(-)
diff --git a/assets/css/style.css b/assets/css/style.css
index 8ad7997..0df0b9f 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1366,17 +1366,14 @@ img {
.theme-switch-wrapper {
display: flex;
align-items: center;
-
- em {
- margin-left: 10px;
- font-size: 1rem;
- }
}
.theme-switch {
display: inline-block;
height: 34px;
position: relative;
width: 60px;
+ margin-left: 50px;
+ flex: right;
}
.theme-switch input {
@@ -1406,7 +1403,7 @@ img {
}
input:checked + .slider {
- background-color: #66bb6a;
+ background-color: var(--blue-dark);
}
input:checked + .slider:before {
diff --git a/index.html b/index.html
index 5d85e1e..c27a7e4 100644
--- a/index.html
+++ b/index.html
@@ -71,7 +71,6 @@
<input type="checkbox" id="checkbox" />
<div class="slider round"></div>
</label>
- <em>Enable Dark Mode!</em>
</div>
From 517ca0439361ba3a911a3a45221d86707dfe9e9b Mon Sep 17 00:00:00 2001
From: Mitisha Agarwal <mitisha310@gmail.com>
Date: Sun, 29 Nov 2020 00:09:25 +0530
Subject: [PATCH 6/9] --- Auto-Git Commit ---
---
assets/css/style.css | 3 +++
1 file changed, 3 insertions(+)
diff --git a/assets/css/style.css b/assets/css/style.css
index 0df0b9f..b8a7f85 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -20,6 +20,8 @@
}
+
+/*
[data-theme="dark"] {
--primary-color: #1bb1dc;
--secondary-color: #0a98c0;
@@ -39,6 +41,7 @@
--grey1: #ffffff;
--grey2: #ffffff;
}
+*/
body {
From 05403350c66ff18475d54dad2abb7017131ada24 Mon Sep 17 00:00:00 2001
From: Mitisha Agarwal <mitisha310@gmail.com>
Date: Mon, 30 Nov 2020 13:45:24 +0530
Subject: [PATCH 7/9] --- Auto-Git Commit ---
---
assets/css/style.css | 18 +++++++++++++-----
index.html | 21 +++++++++++----------
2 files changed, 24 insertions(+), 15 deletions(-)
diff --git a/assets/css/style.css b/assets/css/style.css
index b8a7f85..de73539 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1012,6 +1012,10 @@ h6 {
transition: all 0.2s;
background-color: transparent;
border: none;
+ -webkit-transition: all 0.2s;
+ -moz-transition: all 0.2s;
+ -ms-transition: all 0.2s;
+ -o-transition: all 0.2s;
}
.timeline-heading:hover{
@@ -1367,16 +1371,12 @@ img {
// toggle button
.theme-switch-wrapper {
- display: flex;
- align-items: center;
}
.theme-switch {
display: inline-block;
height: 34px;
position: relative;
width: 60px;
- margin-left: 50px;
- flex: right;
}
.theme-switch input {
@@ -1414,9 +1414,17 @@ input:checked + .slider:before {
}
.slider.round {
- border-radius: 34px;
+ border-radius: 25px;
+ -webkit-border-radius: 25px;
+ -moz-border-radius: 25px;
+ -ms-border-radius: 25px;
+ -o-border-radius: 25px;
}
.slider.round:before {
border-radius: 50%;
+}
+
+* {
+ box-sizing: border-box;
}
\ No newline at end of file
diff --git a/index.html b/index.html
index c27a7e4..2a9a0cd 100644
--- a/index.html
+++ b/index.html
@@ -53,7 +53,6 @@
<!-- ======= Header ======= -->
<header id="header">
-
<div id="topbar">
<div class="container">
<div class="social-links">
@@ -62,18 +61,17 @@
<a href="https://github.com/StudentCode-in" class="github"><i class="fa fa-github"></i></a>
<a href="https://t.me/scodein" class="telegram"><i class="fa fa-telegram"></i></a>
</div>
+
+ <!-- Toggle button -->
+ <div class="theme-switch-wrapper">
+ <label class="theme-switch" for="checkbox">
+ <input type="checkbox" id="checkbox" />
+ <div class="slider round"></div>
+ </label>
+ </div>
</div>
</div>
- <!-- Toggle button -->
- <div class="theme-switch-wrapper">
- <label class="theme-switch" for="checkbox">
- <input type="checkbox" id="checkbox" />
- <div class="slider round"></div>
- </label>
- </div>
-
-
<div class="container">
<div class="logo float-left">
@@ -82,6 +80,9 @@ <h1 class="text-light"><a href="#intro" class="scrollto"><span>Student Code-In</
<!-- <a href="#header" class="scrollto"><img src="assets/img/logo.png" alt="" class="img-fluid"></a> -->
</div>
+
+
+
<nav class="main-nav float-right d-none d-lg-block">
<ul>
<li class="active"><a href="#topbar">Home</a></li>
From 3dabec1d58c3570dbfa425390a13ea57c5b8e95c Mon Sep 17 00:00:00 2001
From: Mitisha Agarwal <mitisha310@gmail.com>
Date: Mon, 30 Nov 2020 14:15:41 +0530
Subject: [PATCH 8/9] --- Auto-Git Commit ---
---
assets/css/style.css | 2 ++
index.html | 18 ++++++++++--------
2 files changed, 12 insertions(+), 8 deletions(-)
diff --git a/assets/css/style.css b/assets/css/style.css
index de73539..5d429ff 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1371,12 +1371,14 @@ img {
// toggle button
.theme-switch-wrapper {
+ margin: ;
}
.theme-switch {
display: inline-block;
height: 34px;
position: relative;
width: 60px;
+ margin: 10px;
}
.theme-switch input {
diff --git a/index.html b/index.html
index 2a9a0cd..6ba050a 100644
--- a/index.html
+++ b/index.html
@@ -53,7 +53,16 @@
<!-- ======= Header ======= -->
<header id="header">
+
<div id="topbar">
+ <!-- Toggle button -->
+ <div class="theme-switch-wrapper">
+ <label class="theme-switch" for="checkbox">
+ <input type="checkbox" id="checkbox" />
+ <div class="slider round"></div>
+ </label>
+ </div>
+
<div class="container">
<div class="social-links">
<a href="https://twitter.com/studentcodein" class="twitter"><i class="fa fa-twitter"></i></a>
@@ -61,14 +70,7 @@
<a href="https://github.com/StudentCode-in" class="github"><i class="fa fa-github"></i></a>
<a href="https://t.me/scodein" class="telegram"><i class="fa fa-telegram"></i></a>
</div>
-
- <!-- Toggle button -->
- <div class="theme-switch-wrapper">
- <label class="theme-switch" for="checkbox">
- <input type="checkbox" id="checkbox" />
- <div class="slider round"></div>
- </label>
- </div>
+
</div>
</div>
From 9e5be4ea5589575e4d1ade1bf16c0681c3df28a9 Mon Sep 17 00:00:00 2001
From: Mitisha Agarwal <mitisha310@gmail.com>
Date: Mon, 30 Nov 2020 14:54:37 +0530
Subject: [PATCH 9/9] Added toggle button for theme changer
---
.github/ISSUE_TEMPLATE/bug_report.md | 38 -----------------------
.github/ISSUE_TEMPLATE/feature_request.md | 20 ------------
.github/workflows/label.md | 20 ------------
.gitignore | 1 -
assets/css/style.css | 5 +--
assets/js/main.js | 35 +--------------------
index.html | 20 ++++++------
7 files changed, 13 insertions(+), 126 deletions(-)
delete mode 100644 .github/ISSUE_TEMPLATE/bug_report.md
delete mode 100644 .github/ISSUE_TEMPLATE/feature_request.md
delete mode 100644 .github/workflows/label.md
delete mode 100644 .gitignore
diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md
deleted file mode 100644
index dd84ea7..0000000
--- a/.github/ISSUE_TEMPLATE/bug_report.md
+++ /dev/null
@@ -1,38 +0,0 @@
----
-name: Bug report
-about: Create a report to help us improve
-title: ''
-labels: ''
-assignees: ''
-
----
-
-**Describe the bug**
-A clear and concise description of what the bug is.
-
-**To Reproduce**
-Steps to reproduce the behavior:
-1. Go to '...'
-2. Click on '....'
-3. Scroll down to '....'
-4. See error
-
-**Expected behavior**
-A clear and concise description of what you expected to happen.
-
-**Screenshots**
-If applicable, add screenshots to help explain your problem.
-
-**Desktop (please complete the following information):**
- - OS: [e.g. iOS]
- - Browser [e.g. chrome, safari]
- - Version [e.g. 22]
-
-**Smartphone (please complete the following information):**
- - Device: [e.g. iPhone6]
- - OS: [e.g. iOS8.1]
- - Browser [e.g. stock browser, safari]
- - Version [e.g. 22]
-
-**Additional context**
-Add any other context about the problem here.
diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md
deleted file mode 100644
index bbcbbe7..0000000
--- a/.github/ISSUE_TEMPLATE/feature_request.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-name: Feature request
-about: Suggest an idea for this project
-title: ''
-labels: ''
-assignees: ''
-
----
-
-**Is your feature request related to a problem? Please describe.**
-A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
-
-**Describe the solution you'd like**
-A clear and concise description of what you want to happen.
-
-**Describe alternatives you've considered**
-A clear and concise description of any alternative solutions or features you've considered.
-
-**Additional context**
-Add any other context or screenshots about the feature request here.
diff --git a/.github/workflows/label.md b/.github/workflows/label.md
deleted file mode 100644
index f9e8d9e..0000000
--- a/.github/workflows/label.md
+++ /dev/null
@@ -1,20 +0,0 @@
-# This workflow will triage pull requests and apply a label based on the
-# paths that are modified in the pull request.
-#
-# To use this workflow, you will need to set up a .github/labeler.yml
-# file with configuration. For more information, see:
-# https://github.com/actions/labeler
-
-name: Labeler
-on: [pull_request]
-
-jobs:
- label:
-
- runs-on: ubuntu-latest
-
- steps:
- - uses: actions/labeler@v2
-
- with:
- repo-token: "${{ secrets.GITHUB_TOKEN }}"
diff --git a/.gitignore b/.gitignore
deleted file mode 100644
index 427ec6b..0000000
--- a/.gitignore
+++ /dev/null
@@ -1 +0,0 @@
-.autogit
\ No newline at end of file
diff --git a/assets/css/style.css b/assets/css/style.css
index 5d429ff..9c7ad99 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -170,7 +170,7 @@ h6 {
--------------------------------------------------------------*/
#topbar {
padding: 0 0 10px 0;
- font-size: 14px;
+ font-size: 1.25rem;
transition: all 0.5s;
}
@@ -1378,7 +1378,8 @@ img {
height: 34px;
position: relative;
width: 60px;
- margin: 10px;
+ margin: 0px;
+ margin-bottom: 1.5rem;
}
.theme-switch input {
diff --git a/assets/js/main.js b/assets/js/main.js
index 1da34e9..b8d5c01 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -220,37 +220,4 @@
});
})(jQuery);
- const toggleSwitch = document.querySelector('.theme-switch input[type="checkbox"]');
-
-function switchTheme(e) {
- if (e.target.checked) {
- document.documentElement.setAttribute('data-theme', 'dark');
- }
- else {
- document.documentElement.setAttribute('data-theme', 'light');
- }
-}
-
-toggleSwitch.addEventListener('change', switchTheme, false);
-
-function switchTheme(e) {
- if (e.target.checked) {
- document.documentElement.setAttribute('data-theme', 'dark');
- localStorage.setItem('theme', 'dark'); //add this
- }
- else {
- document.documentElement.setAttribute('data-theme', 'light');
- localStorage.setItem('theme', 'light'); //add this
- }
-}
-
-const currentTheme = localStorage.getItem('theme') ? localStorage.getItem('theme') : null;
-
-if (currentTheme) {
- document.documentElement.setAttribute('data-theme', currentTheme);
-
- if (currentTheme === 'dark') {
- toggleSwitch.checked = true;
- }
-}
-
+
\ No newline at end of file
diff --git a/index.html b/index.html
index 6ba050a..656d651 100644
--- a/index.html
+++ b/index.html
@@ -55,22 +55,23 @@
<header id="header">
<div id="topbar">
- <!-- Toggle button -->
- <div class="theme-switch-wrapper">
- <label class="theme-switch" for="checkbox">
- <input type="checkbox" id="checkbox" />
- <div class="slider round"></div>
- </label>
- </div>
<div class="container">
+
<div class="social-links">
+
<a href="https://twitter.com/studentcodein" class="twitter"><i class="fa fa-twitter"></i></a>
<a href="https://www.linkedin.com/company/43204229/" class="linkedin"><i class="fa fa-linkedin"></i></a>
<a href="https://github.com/StudentCode-in" class="github"><i class="fa fa-github"></i></a>
<a href="https://t.me/scodein" class="telegram"><i class="fa fa-telegram"></i></a>
</div>
-
+ <!-- Toggle button -->
+ <div class="theme-switch-wrapper">
+ <label class="theme-switch" for="checkbox">
+ <input type="checkbox" id="checkbox" />
+ <div class="slider round"></div>
+ </label>
+ </div>
</div>
</div>
@@ -82,9 +83,6 @@ <h1 class="text-light"><a href="#intro" class="scrollto"><span>Student Code-In</
<!-- <a href="#header" class="scrollto"><img src="assets/img/logo.png" alt="" class="img-fluid"></a> -->
</div>
-
-
-
<nav class="main-nav float-right d-none d-lg-block">
<ul>
<li class="active"><a href="#topbar">Home</a></li>