debugged

Arish82 · Dec 11, 2021 · 1d42790 · 1d42790
1 parent 082c6be
commit 1d42790
Show file tree

Hide file tree

Showing 5 changed files with 86 additions and 15 deletions.
diff --git a/public/css/index.css b/public/css/index.css
@@ -98,8 +98,8 @@ body{
 @media (max-width: 990px) {
 
     .wave{
-        height: 330px;
-        transform: translateX(-300px);
+        /* height: 330px; */
+        /* transform: translateX(-300px); */
 
     }
     .box{
@@ -166,11 +166,44 @@ body{
     align-items: center;
     justify-content: center;
     /* background: linear-gradient(135deg, 
-                var(--a1) 0%, 
-                var(--b1) 88%); */
+    var(--a1) 0%, 
+    var(--b1) 88%); */
+}
+.m-wave{
+    display: none;
 }
 @media (max-width: 580px) {
-    body{
+    /* body{
         position: fixed;
+    } */
+    .wup{
+        /* background-color: red !important; */
+        padding: 4px 2px !important;
+        width: 180px;
+    }
+    .m-wave{
+        display: inline-block;
+    }
+    .d-wave{
+        display: none;
+    }
+}
+
+@media (max-width: 372px){
+    .wup{
+        font-size: 12px;
+        width: 145px;
+    }
+    .f> h1{
+        font-size: 22px;
+    }
+    .navbar-brand{
+        font-size: 25px !important;
+    }
+    .navbar-brand > em{
+        font-size: 25px !important;
+    }
+    .navbar-toggler > em{
+        font-size: 25px !important;
     }
 }
diff --git a/public/index.html b/public/index.html
@@ -24,6 +24,7 @@
             position: fixed;
         } */
 
+
     </style>
 </head>
 <body>
@@ -50,7 +51,10 @@
         </div>
     </nav>
     <div class="waves">
-        <svg class="wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
+        <svg class="wave d-wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
+            <path fill="#0099ff" fill-opacity="1" d="M0,128L48,112C96,96,192,64,288,80C384,96,480,160,576,170.7C672,181,768,139,864,122.7C960,107,1056,117,1152,112C1248,107,1344,85,1392,74.7L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
+        </svg>
+        <svg class="wave m-wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 320">
             <path fill="#0099ff" fill-opacity="1" d="M0,128L48,112C96,96,192,64,288,80C384,96,480,160,576,170.7C672,181,768,139,864,122.7C960,107,1056,117,1152,112C1248,107,1344,85,1392,74.7L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
         </svg>
     </div>
@@ -62,7 +66,7 @@ <h1>
                       Welcome to Weather App
                   </h1>
                   <a href="/weather">
-                      <div class="btn btns btn-outline-primary rounded-pill">
+                      <div class="wup btn btns btn-outline-primary rounded-pill">
                         Weather Updates &#8594;
                       </div>
                   </a>

diff --git a/src/index.js b/src/index.js
@@ -22,7 +22,22 @@ app.get("/about",(req,res)=>{
 });
 
 let city="Pune";
-let datas;
+let datas={
+    name: "NA",
+    sys: {
+        country: "NA"
+    },
+    main: {
+        temp: 0
+    },
+    weather: [{
+        main: "NA",
+        id: 800
+    }],
+    wind: {
+        speed : 0
+    }
+};
 app.get("/data",(req,res)=>{
     city=req.query.city;
     res.json(datas);
@@ -64,7 +79,7 @@ const mapping=(id, time)=>{
 
 // weather 
 app.get("/weather",(req,res)=>{
-    requests(`https://api.openweathermap.org/data/2.5/weather?q=${city}&units=metric&appid=1067473358f17658b391e391d00bbd3f`)
+    requests(`https://api.openweathermap.org/data/2.5/weather?q=${city}&units=metric&appid=c54de9945100d45bfd5df7ee86a49d67`)
     .on('data', function (chunk) {
         let s=JSON.parse(chunk);
         if(s.cod === 200){

diff --git a/templates/views/about.hbs b/templates/views/about.hbs
@@ -162,7 +162,10 @@
     </div>
     </nav>
 
-    <svg class="wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
+    <svg class="wave d-wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1420 320">
+        <path fill="#0099ff" fill-opacity="1" d="M0,128L48,112C96,96,192,64,288,80C384,96,480,160,576,170.7C672,181,768,139,864,122.7C960,107,1056,117,1152,112C1248,107,1344,85,1392,74.7L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
+    </svg>
+    <svg class="wave m-wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 320">
         <path fill="#0099ff" fill-opacity="1" d="M0,128L48,112C96,96,192,64,288,80C384,96,480,160,576,170.7C672,181,768,139,864,122.7C960,107,1056,117,1152,112C1248,107,1344,85,1392,74.7L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
     </svg>
 

diff --git a/templates/views/index.hbs b/templates/views/index.hbs
@@ -227,10 +227,21 @@
         }
         @media (max-width: 420px) {
            .w-box{
-               width: 100%;
-               height: 90%;
+               /*width: 100vw;
+               height: 90vh;*/
            } 
         }
+        /*@media (max-width: 560px) {
+            .m-wave{
+                display: block;
+            }
+            .d-wave{
+                display: none;
+            }
+        }
+        .m-wave{
+            display: none;
+        }*/
         .w-wave{
             position: absolute;
             z-index: -1;
@@ -307,9 +318,14 @@
         </div>
     </div>
 
-    <svg class="w-wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
-        <path fill="#0099ff" fill-opacity="1" d="M0,128L48,112C96,96,192,64,288,80C384,96,480,160,576,170.7C672,181,768,139,864,122.7C960,107,1056,117,1152,112C1248,107,1344,85,1392,74.7L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
-    </svg>
+    <div class="waves">
+        <svg class="w-wave d-wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1420 320">
+            <path fill="#0099ff" fill-opacity="1" d="M0,128L48,112C96,96,192,64,288,80C384,96,480,160,576,170.7C672,181,768,139,864,122.7C960,107,1056,117,1152,112C1248,107,1344,85,1392,74.7L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
+        </svg>
+        <svg class="w-wave m-wave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 320">
+            <path fill="#0099ff" fill-opacity="1" d="M0,128L48,112C96,96,192,64,288,80C384,96,480,160,576,170.7C672,181,768,139,864,122.7C960,107,1056,117,1152,112C1248,107,1344,85,1392,74.7L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
+        </svg>
+    </div>
 </body>
     <script>
         let Location=document.getElementById("location");