css/style.css

@@ -89,4 +89,5 @@ body {
 
 .car-image img {
     width: 150px;
-}
+}
+

css/style2.css

@@ -1,96 +0,0 @@
-body {
-    font-family: Arial, sans-serif;
-    background-color: #f8f8f8;
-    margin: 0;
-    padding: 0;
-}
-
-.header {
-    background-color: #800040;
-    color: #ffffff;
-    padding: 20px;
-    text-align: center;
-    font-size: 2em;
-}
-
-.nav {
-    display: flex;
-    justify-content: center;
-    background-color: #d40054;
-    padding: 10px;
-}
-
-.nav img {
-    width: 50px;
-    height: 50px;
-    margin: 0 20px;
-    cursor: pointer;
-}
-
-.main-content {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    padding: 40px;
-    background-color: #fff1f4;
-}
-
-.form-container {
-    text-align: center;
-    padding: 20px;
-    background-color: #ffffff;
-    border-radius: 8px;
-    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
-    width: 300px;
-}
-
-.form-container h2 {
-    color: #6b8e23;
-    font-size: 1.5em;
-}
-
-.form-container label {
-    display: block;
-    margin: 10px 0 5px;
-    color: #333;
-}
-
-.form-container input[type="text"] {
-    width: 100%;
-    padding: 8px;
-    margin-bottom: 10px;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-}
-
-.form-container input[type="submit"] {
-    background-color: #800040;
-    color: white;
-    padding: 10px;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    width: 100%;
-}
-
-.footer {
-    background-color: #800040;
-    color: white;
-    text-align: center;
-    padding: 10px;
-    position: fixed;
-    bottom: 0;
-    width: 100%;
-}
-
-.car-image {
-    margin-left: 30px;
-}
-
-.car-image img {
-    width: 150px;
-}
-
-.post {
-    text-align: center;
-}

index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Całodobowa stacja paliw</title>
-    <link rel="stylesheet" href="css/style2.css">
+    <link rel="stylesheet" href="css/style.css">
     
     <script type="module" src="js/script.js"></script>
 
@@ -31,11 +31,10 @@
                     
                     <label id="cena">Calculate ...</label>
 
-                    Ile litrow?</br>
+                    <label for="liters">Ile litrów?</label>
-                    <input id = "ile_litrow"></input></br>
+                    <input type="text" id="liters" name="liters">
-                    <input id = "oblicz" type="button" value="OBLICZ">
+                    
-
+                    <input type="submit" value="OBLICZ">
-                    <p id="wynik"></p>
                 </form>
 
         </div>
@@ -44,20 +43,9 @@
         </div>
     </div>
 
-    <div class="post">
-        <h2>Dodaj rodzaj paliwa</h2>
-        Nazwa:</br>
-        <input id="name" type="text" placeholder="nazwa"></br></br>
-        Cena:</br>
-        <input id="price" type="number" placeholder = "cena"></br></br>
-        <button id = "button_dodaj">Dodaj</button>
-    </div>
-
     <div class="footer">
         Stronę opracował: 000000000000
     </div>
-
-    <script src="js/post.js"></script>
 </body>
 </html>
 

js/post.js

@@ -1,26 +0,0 @@
-document.addEventListener('DOMContentLoaded', () => {
-
-    button_dodaj = document.getElementById("button_dodaj")
-    
-    button_dodaj.addEventListener("click", () => {
-
-        data = {
-            nazwa: document.getElementById("name").value,
-            cena: document.getElementById("price").value
-        }
-        fetch("php/post.php", {
-            method: "POST",
-            headers: {
-                "Content-Type":"application/json",
-            }, 
-            body: JSON.stringify(data)
-        })
-        .then(response => response.json)
-        .then(data => {
-            console.log("Succes", data)
-            window.location.reload()
-        })
-        
-    })
-
-})

js/script.js

@@ -4,7 +4,6 @@ const cena = document.getElementById("cena");
 
 let usersData = [];
 
-
 document.addEventListener('DOMContentLoaded', function() {
     fetch('php/gget.php')
         .then(response => response.json())
@@ -41,15 +40,3 @@ fuelType.addEventListener('change', function() {
     }
 });
 
-document.getElementById("oblicz").addEventListener("click", () => {
-    const ile_litrow = document.getElementById("ile_litrow").value
-    const cena_paliwa = document.getElementById("cena").innerHTML
-    console.log(ile_litrow)
-    console.log(cena_paliwa)
-
-    const wynik = ile_litrow * cena_paliwa
-
-    console.log(wynik)
-
-    document.getElementById("wynik").innerHTML = wynik
-})

php/gget.php

@@ -1,6 +1,6 @@
 <?php
 
-$polaczenie = mysqli_connect("localhost", "root", "", "db");
+$polaczenie = mysqli_connect("172.19.0.2", "root", "secret", "db");
 
 $kwerenda = mysqli_query($polaczenie, "SELECT * FROM paliwa ORDER BY id DESC LIMIT 3;");
 

php/post.php

@@ -1,20 +0,0 @@
-<?php
-
-$dbhost = "localhost";
-$dbuser = "root";
-$dbpass = "";
-$dbname = "db";
-
-$con = mysqli_connect($dbhost, $dbuser, $dbpass, $dbname);
-
-$rawData = file_get_contents('php://input');
-
-$data = json_decode($rawData, true);
-
-$kw = "INSERT INTO paliwa (nazwa, cena) VALUES ('{$data['nazwa']}', {$data['cena']} );";
-
-echo json_encode($kw);
-
-$ans = mysqli_query($con, $kw);
-
-?>

token.txt

@@ -1 +0,0 @@
-03abdf5412e60673d79cd8929fdd18a8bbb631b3