Merge branch 'main' of https://github.com/Its-Aman-Yadav/Community-Site…

… into contact_us
sau-mili · Jul 21, 2024 · af75e1f · af75e1f
2 parents 86f3385 + 0599507
commit af75e1f
Show file tree

Hide file tree

Showing 27 changed files with 3,013 additions and 620 deletions.
diff --git a/about us.html b/about us.html
@@ -171,7 +171,7 @@
 <!-- Navbar -->
 <div class="navbar">
   <nav>
-    <a class="logo-link" href="./index.html#home">
+    <a class="logo-link" href="#home">
       <div class="logo-title">
                   <img  class="logo" src="images/logo2.jpeg" alt="logo">
 
@@ -184,10 +184,11 @@
 
     </a>
     <ul>
-      <li><i class="fa-solid fa-house"></i><a class="nav-link" href="./index.html" onclick="window.location.href='index.html'; return false;">Home</a></li>
-      <li><i class="fa-solid fa-address-card"></i><a class="nav-link" href="#introduction">About</a></li>
-      <li><i class="fa-solid fa-pen-to-square"></i><a class="nav-link" href="#Timeline">Join Us</a></li>
-      <li><i class="fa-solid fa-address-book"></i><a class="nav-link" href="#projects">Projects</a></li>
+      <li><i class="fa-solid fa-house"></i><a class="nav-link" href="index.html">Home</a></li>
+      <li><i class="fa-solid fa-address-card"></i><a class="nav-link" href="about us.html">About</a></li>
+      <li><i class="fa-solid fa-screwdriver-wrench"></i><a class="nav-link" href="index.html#services">Services</a></li>
+      <li><i class="fa-solid fa-pen-to-square"></i><a class="nav-link" href="index.html#testimonials">Reviews</a></li>
+      <li><i class="fa-solid fa-address-book"></i><a class="nav-link" href="contact us.html">Contact</a></li>
       <li><i class="fa-solid fa-right-to-bracket"></i><a href="login.html">Login/Register</a></li>
     </ul>
 
@@ -286,6 +287,144 @@
         /* background-color: #34495e; */
       }
 
+
+      .benefit-container{
+        margin: 10px auto;
+        display: grid;
+        grid-auto-flow: column;
+        grid-template-columns: repeat(4, 1fr);
+        grid-auto-rows: 1fr !important;
+        /* size-adjust: auto; */
+        /* grid-template-columns: min-content; */
+      }
+
+      .benefit-card{
+        align-items: center;
+        text-align: center;
+        height: 100%;
+        width: 80%;
+        padding: 15px;
+        border: 1.5px solid #e66f00;
+        margin: auto 20px;
+        background:#f39c12;
+        border-radius: 10px;
+        transition: all 0.6s linear;
+      }
+      .benefit-card:hover{
+        border-color: #ff3907;
+        scale:1.02;
+      }
+      .benefit-card p{
+        margin-top:auto;
+        padding-bottom: none;
+        margin-bottom:auto;
+        color:white;
+        font-weight: 600;
+        text-shadow: 0px 2px #e66f00;
+      }
+
+      .learning-container{
+        display: grid;
+        grid-auto-flow: row;
+        grid-template-rows: repeat(4,1fr);
+        grid-template-columns: 1fr;
+      }
+
+      .learning-card{
+        align-items: center;
+        text-align: center;
+        height: 68%;
+        width: 70%;
+        padding: 10px;
+        border: 1.5px solid #e66f00;
+        margin:  20px auto;
+        background:#ffffff;
+        border-radius: 10px;
+        display: grid;
+        grid-auto-flow: column;
+        /* grid-template-columns: repeat(2,1fr); */
+        /* grid-template-rows: 1fr; */
+        transition: all 0.4s linear;
+      }
+      .learning-card:hover{
+        background: linear-gradient(to right, white, #f5d244);
+      }
+
+      .learning-card img{
+        width: 60px;
+        height: 60px;
+        margin-left:auto;
+        margin-right: auto;
+
+      }
+
+      .learning-card p{
+        align-items: center;
+        text-align: left;
+        margin-top:auto !important;
+        margin-bottom:auto !important;
+        /* line-height: 1px; */
+        padding-bottom: 0px;
+
+        color:#e66f00;
+        font-weight: 600;
+        text-shadow: 0px 1px #6e0404;
+      }
+
+      .community-container{
+        display: grid;
+        grid-auto-flow: column;
+        grid-template-rows: repeat(2,1fr);
+        grid-template-columns: 1fr;
+
+      }
+      .community-card:nth-child(1){
+        border-top-left-radius: 15px;
+        border-bottom-right-radius: 15px;
+
+      }
+      .community-card:nth-child(2){
+        border-top-left-radius: 15px;
+        border-bottom-right-radius: 15px;
+
+      }
+
+      .community-card:nth-child(3){
+        border-top-right-radius: 15px;
+        border-bottom-left-radius: 15px;
+
+      }
+      .community-card:nth-child(4){
+        border-top-right-radius: 15px;
+        border-bottom-left-radius: 15px;
+
+      }
+      .community-card{
+        background-color: #ffffff55;
+        margin: 10px auto;
+        max-width:90%;
+        padding:2%;
+
+        border:1.5px solid rgb(255, 64, 0);
+
+        font-weight: 600;
+      }
+      .improve-card{
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        /* justify-content: space-between; */
+      }
+      .improve-card p{
+        margin: 10px 20px;
+        font-weight: bold;
+      }
+      .improve-card i{
+        width: 20px;
+        /* margin: auto; */
+        font-size: 22px;
+        color: #e66f00;
+      }
     </style>
 
     <!-- <img id="image" src="path/to/profile/image.jpg" onclick="ProfileClicked()" alt="Profile"> -->

diff --git a/back5.mp4 b/back5.mp4
diff --git a/contact.css b/contact.css
@@ -0,0 +1,103 @@
+
+
+  /* Toggle button styles */
+  .toggle-container {
+    position: absolute;
+    display: inline-block;
+    width: 60px;
+    height: 34px;
+    right: 40px;
+    top: 10px;
+  }
+
+  .toggle-button {
+    position: absolute;
+    cursor: pointer;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: #ccc;
+    transition: .4s;
+    border-radius: 34px;
+  }
+
+  .toggle-button:before {
+    position: absolute;
+    content: "";
+    height: 26px;
+    width: 26px;
+    left: 4px;
+    bottom: 4px;
+    background-color: white;
+    transition: .4s;
+    border-radius: 50%;
+  }
+
+  body.dark-mode .toggle-button {
+    background-color: #2196F3;
+  }
+
+  body.dark-mode .toggle-button:before {
+    transform: translateX(26px);
+  }
+
+  .light-mode-icon, .dark-mode-icon {
+    position: absolute;
+    top: 50%;
+    transform: translateY(-50%);
+    width: 20px;
+    height: 20px;
+  }
+
+  .light-mode-icon {
+    left: 5px;
+  }
+
+  .dark-mode-icon {
+    right: 5px;
+  }
+
+  body:not(.dark-mode) .dark-mode-icon,
+  body.dark-mode .light-mode-icon {
+    display: none;
+  }
+
+
+  /* Dark mode styles */
+  body.dark-mode {
+    background: #1a1a1a;
+  }
+
+  body.dark-mode .card {
+    background: #333;
+    box-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
+    color: #ffffff;
+  }
+
+  body.dark-mode .back-button,
+  body.dark-mode .back-button i{
+    color: #f1c11a !important;
+  }
+
+  body.dark-mode .usersubmit input{
+    background-color: #f1c11a;
+    color: black;
+  }
+
+  body.dark-mode .form input::placeholder{
+    color: #ccc;
+  }
+
+  body.dark-mode .form textarea::placeholder{
+    color: #ccc;
+  }
+
+  body.dark-mode .address p,
+  body.dark-mode .social i{
+    color: #f1c11a !important;
+  }
+
+  body.dark-mode .social i:hover{
+    color: #eedd9f !important;
+  }