Merge pull request #4 from sahil-chaudhary/Shishir1729-patch-1

accept sir

Event detail Template/src/event.css

@@ -0,0 +1,374 @@
+/* styles.css */
+
+/* Navbar Styles */
+body {
+    margin: 0;
+    padding: 0;
+    font-family: Libre Baskerville;
+    background:linear-gradient(to bottom,black,#0f0e0e,#2b2323,#0e0b0b,#070101,#070101);
+    min-height: 100vh;
+  }
+
+  .navbar {
+    position: absolute;
+    top: 0;
+    width: 100%;
+    background-color: black;
+    z-index: 1;
+    display: flex;
+    align-items: center;
+    border-radius: -2vw;
+  }
+
+  .logo{
+    width: 10vw;
+    height: 10vh;
+  }
+
+  .logo img{
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+  }
+
+  .navbar ul {
+    list-style-type: none;
+    margin-left: 30%;
+    padding: 0;
+    overflow: hidden;
+    background-color: transparent;
+    display: flex;
+    justify-content: center;
+    font-size: 1.3vw;
+  }
+
+  .navbar li {
+    display: inline-block;
+  }
+
+  .navbar li a {
+    display: block;
+    color: white;
+    text-align: right;
+    padding: 0.5vw 2vh;
+    text-decoration: none;
+  }
+
+  .navbar li a:hover {
+    background-color:#47c7f5;
+    transition: background-color 0.3s ease-in-out;
+    color: white;
+    border-radius: 1vw;
+  }
+
+  /* Second Navbar Styles */
+  .navbar2 {
+    background-color: transparent;
+    color: white;
+    padding: 3vh;
+    margin-top: 12vh;
+    text-align: center;
+  }
+  .head{
+    padding-left: 0vh;
+    display: flex;
+    justify-content: center;
+  }
+  .head .img{
+    background-image: url(../img/try.jpg);
+    background-size: cover;
+    width: 77vw;
+    height: 40vw;
+    text-align: center;
+    border-radius: 2vw;
+  }
+  .image .tatt{
+    background-image: url(../img/try.jpg);
+    background-size: cover;
+    width: 40vw;
+    height: 25vw;
+    border-radius: 2vw;
+    position: relative;
+    display: block;
+    justify-content: center;
+    margin-right: 11vw;
+    margin-top: 7.5vw;
+  }
+  .tatt{
+    padding-right: 3vw;
+  }
+  .title{
+    font-size: 8vw;
+    color: yellow;
+    z-index: 1;
+    font-style: bold;
+    display: block;
+    position: relative;
+    padding-top: 25vw;
+    font-family: "Papyrus";
+  }
+
+  .txt{
+    position: relative;
+    display: block;
+    color: #f1f1f1;
+    font-size: 1.4vw;
+    padding-bottom: 3vw;
+    padding-left: 3vw;
+    padding-right: 3vw;
+    font-family: "Papyrus";
+  }
+  .time{
+    justify-content: center;
+    display: block;
+    padding-left: 15vw;
+    padding-top: 5vw;  
+  }
+
+  .timeline{
+    font-size: 3vw;
+    color: rgb(255, 255, 255);
+    z-index: 1;
+    font-style: bold;
+    display: block;
+    justify-content: center;
+    font-family: "Garamond";
+  }
+  .line{
+    display: block;
+    font-size: large;
+    font-family: "Papyrus";
+    font-size: 1.5vw;
+    color: white;
+  }
+  .line ul li{
+    list-style: none;
+    display: block;
+    position: relative;
+  }
+
+  .eli{
+    justify-content: center;
+    display: block;
+    padding-left: 15vw;
+    padding-top: 5vw;  
+    font-family: "Garamond";
+  }
+
+  .eligi{
+    font-size: 3vw;
+    color: rgb(255, 255, 255);
+    z-index: 1;
+    font-style: bold;
+    display: block;
+    justify-content: center;
+  }
+
+  .register{
+    background-color: transparent;
+    color: white;
+    text-align: center;
+    padding: 5vh;
+  }
+
+  .register-button {
+    position: relative;
+    justify-content: center;
+    display: inline-block;
+    text-decoration: none;
+    color: white;
+    background-color: #0c033b; /* Gray color for the button */
+    width: 10vw;
+    height: 3vw;
+    text-align: center;
+    border-radius: 5px;
+    font-size: 2.5vw;
+    font-style: bold;
+    padding: 1vw;
+    font-family: "Garamond";
+  }
+
+  .register-button:hover {
+    background-color: #0c033b; /* Slightly darker shade of gray on hover */
+    transform: scale(1.1);
+  }
+
+  .link{
+    position: relative;
+    font-size: 3vw;
+    font-display: block;
+    color:white;
+    justify-content: center;
+
+  }
+  .socials {
+    background-color:#070101; 
+    padding: 5vh 0;
+    text-align: center;
+    bottom: 0;
+    width: 100%;
+    z-index: 1;
+  }
+
+  .socials ul {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin: 0;
+    padding: 0;
+  }
+
+  .socials ul li {
+    list-style-type: none;
+    margin: 0 10vh;
+  }
+
+  .socials img {
+    width: 5vw;
+    height: 5vw;
+  }
+
+  .socials img:hover {
+    transform: translate(0, -3vh);
+  }
+
+  .socials h2{
+    font-family:libre franklin;
+    color: rgb(238, 222, 222);
+
+  }
+
+
+  /* Dropdown Styles */
+  .dropdown {
+    display: none;
+  }
+
+  .dropdown-toggle {
+    display: none;
+    color: white;
+    padding: 10px;
+    cursor: pointer;
+  }
+
+  .dropdown-content {
+    display: none;
+    position: absolute;
+    top: 100%;
+    background-color: #f9f9f9;
+    min-width: 160px;
+    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
+    z-index: 2;
+  }
+
+  .dropdown-content a {
+    display: block;
+    padding: 10px;
+    color: black;
+    text-decoration: none;
+  }
+
+  .dropdown-content a:hover {
+    background-color: #f1f1f1;
+  }
+
+
+  .socials {
+    background: color #070101;; 
+    padding: 5vh 0;
+    text-align: center;
+    bottom: 0;
+    width: 100%;
+    z-index: 1;
+  }
+
+  .socials ul {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin: 0;
+    padding: 0;
+  }
+
+  .socials ul li {
+    list-style-type: none;
+    margin: 0 10vh;
+  }
+
+  .socials img {
+    width: 5vw;
+    height: 5vw;
+  }
+
+  .socials img:hover {
+    transform: translate(0, -3vh);
+  }
+
+  .socials h2{
+    font-family:libre franklin;
+    color: rgb(238, 222, 222);
+    font-size: 1.7vw;
+
+  }
+
+  /* Styles for portrait mode */
+  @media screen and (orientation: portrait) {
+    .navbar ul {
+      display: none;
+    }
+
+    .dropdown-content {
+      display: none;
+      position: fixed;
+      top: 100%;
+      left: 0;
+      width: 100%;
+    }
+
+    .dropdown.show .dropdown-content {
+      display: block;
+    }
+
+    .dropdown-toggle{
+      display: block;
+      background-color: transparent;
+      color: white;
+      padding: 1vw;
+      cursor: pointer;
+      border: none;
+    }
+
+    .dropdown {
+      display: none;
+      margin-right: 0;
+      margin-left: auto;
+    }
+
+    .dropdown-content {
+      display: none;
+      position: absolute;
+      background-color: black;
+      min-width: 20vw;
+      box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+      z-index: 1;
+    }
+
+    .dropdown-content a {
+      display: block;
+      background-color: transparent;
+      color: white;
+      padding: 1vw 1vh;
+      text-decoration: none;
+      text-align: center;
+      font-size: 20px;
+    }
+
+    .dropdown-content a:hover {background-color: #ddd;}
+
+    .dropdown:hover .dropdown-content {display: block;}
+
+    .dropdown-toggle:hover, .dropdown-toggle:focus {
+      background-color: transparent;
+    }
+  }
+