Merge branch 'main' into Abhay

OPCODE-Open-Spring-Fest · Apr 17, 2024 · 8102246 · 8102246
2 parents 9243af5 + 50d7695
commit 8102246
Show file tree

Hide file tree

Showing 17 changed files with 630 additions and 117 deletions.
diff --git a/Unit Converter/CSS/Currency.css b/Unit Converter/CSS/Currency.css
@@ -0,0 +1,3 @@
+.cur{
+    background-color: grey;
+}
diff --git a/Unit Converter/CSS/length.css b/Unit Converter/CSS/length.css
@@ -0,0 +1,138 @@
+body{
+    font-family: Arial, sans-serif;
+    background-color: #f5f5f5;
+}
+
+.bg {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    min-height: 100vh;
+    background-image: url('../HTML/images/pexels-ave-calvar-martinez-5038394.jpg');
+    background-size: cover;
+    background-position: center; 
+}
+.len{
+    background-color: grey;
+}
+.containment {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    opacity: 95%;
+    background-color: rgba(255, 255, 255, 0.9);
+    border-radius: 15px;
+    padding: 20px;
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+    max-width: 800px;
+    width: 80%;
+    margin: 20px; 
+}
+
+.box {
+    background-color: #ffffff;
+    border-radius: 10px;
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+    padding: 20px;
+    max-width: 600px;
+    width: 100%;
+
+    animation: fadeInDown 0.5s ease-in-out;
+
+}
+
+#desc, #desc0 {
+    text-align: center;
+    margin: 0 0 20px;
+    font-weight: 850;
+}
+
+#desc {
+    font-size: 50px;
+}
+
+#desc0 {
+    font-size: 25px;
+
+}
+
+#optionfr {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 20px;
+    gap: 10px;
+}
+
+#conversion {
+    width: 50px;
+    border-radius: 50px;
+    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+}
+#conversion:hover{
+    transform: scale(1.1);
+    transition: all 0.3s ease;
+}
+
+.form-select, .form-control {
+    padding: 10px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    font-size: 15px;
+    font-weight: 700;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+}
+
+.form-select {
+    width: 50%;
+}
+
+.form-select:hover, .form-control:hover {
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
+    transform: scale(1.02);
+
+
+}
+
+#value {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 10px;
+}
+
+.form-control {
+    width: 48%;
+    margin-bottom: 20px;
+}
+
+@media screen and (max-width: 768px) {
+    .box {
+        width: 90%;
+    }
+    #desc {
+        font-size: 22px;
+    }
+
+    #desc0 {
+        font-size: 15px;
+    }
+    .form-select, .form-control {
+        font-size: 15px;
+    }
+}
+
+@keyframes fadeInDown {
+    from {
+        opacity: 0;
+        transform: translateY(-20px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
diff --git a/Unit Converter/CSS/temperature.css b/Unit Converter/CSS/temperature.css
@@ -0,0 +1,3 @@
+.temp{
+    background-color: grey;
+}
diff --git a/Unit Converter/CSS/volume.css b/Unit Converter/CSS/volume.css
@@ -0,0 +1,104 @@
+
+@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Dancing+Script:wght@400..700&family=El+Messiri:wght@400..700&display=swap');
+
+* {
+    margin: 0px;
+    padding: 0px;
+}
+
+body {
+    display: flex;
+    flex-direction: column;
+    background-image: url("https://img.pikbest.com/wp/202346/test-tube-liquid-filled-tubes-in-3d-render_9621425.jpg!sw800");
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-position: center center;
+    height: 100vh;
+    width: 100vw;
+    justify-content: center;
+    align-items: center;
+}
+
+button {
+    background: #fff;
+    color: #000;
+    font-weight: 600;
+    padding: 12px 20px;
+    cursor: pointer;
+    border-radius: 4px;
+    font-size: 18px;
+    border: 2px solid black;
+    margin-top: 30px;
+}
+
+h1 {
+    color: #fff;
+    text-decoration: underline;
+    text-align: center;
+    font-family: El Messiri;
+}
+
+select option{
+    background-color: #82caff;
+    color: black;
+}
+
+.innerbox {
+    border: 1px solid rgba(255, 255, 255, 0.5);
+    backdrop-filter: blur(7px);
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    border-radius: 15px;
+    padding: 20px;
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+}
+#desc{
+    text-align: center;
+    margin: 0 0 20px;
+}
+
+p {
+    font-size: 25px;
+    color: #fff; 
+}
+
+#optionfr {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 18px;
+    gap: 8px;
+}
+
+
+.form-select, .form-control {
+    padding: 10px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    width: 50%;
+    font-size: 15px;
+    font-weight: 700;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+}
+
+.form-select:hover, .form-control:hover {
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
+    transform: scale(1.02); 
+}
+
+#value {
+    gap: 8px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+img {
+    width: 50px;
+    border-radius: 50px;
+    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+}
diff --git a/Unit Converter/CSS/weight.css b/Unit Converter/CSS/weight.css
@@ -0,0 +1,104 @@
+
+@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Dancing+Script:wght@400..700&family=El+Messiri:wght@400..700&display=swap');
+
+* {
+    margin: 0px;
+    padding: 0px;
+}
+
+body {
+    display: flex;
+    flex-direction: column;
+    background-image: url("https://time.com/wp-content/uploads/2017/10/229-westerlund-21.jpg?w=2000");
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-position: center center;
+    height: 100vh;
+    width: 100vw;
+    justify-content: center;
+    align-items: center;
+}
+
+button {
+    background: #fff;
+    color: #000;
+    font-weight: 600;
+    padding: 12px 20px;
+    cursor: pointer;
+    border-radius: 4px;
+    font-size: 18px;
+    border: 2px solid black;
+    margin-top: 30px;
+}
+
+h1 {
+    color: #fff;
+    text-decoration: underline;
+    text-align: center;
+    font-family: El Messiri;
+}
+
+select option{
+    background-color: #82caff;
+    color: black;
+}
+
+.container-fluid {
+    border: 1px solid rgba(255, 255, 255, 0.5);
+    backdrop-filter: blur(7px);
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    border-radius: 15px;
+    padding: 20px;
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+}
+#desc{
+    text-align: center;
+    margin: 0 0 20px;
+}
+
+p {
+    font-size: 25px;
+    color: #fff; 
+}
+
+#selectfr {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 18px;
+    gap: 8px;
+}
+
+
+.form-select, .form-control {
+    padding: 10px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    width: 50%;
+    font-size: 15px;
+    font-weight: 700;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+}
+
+.form-select:hover, .form-control:hover {
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
+    transform: scale(1.02); 
+}
+
+#value {
+    gap: 8px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+img {
+    width: 50px;
+    border-radius: 50px;
+    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+}