Datasets
Models
Downloads: 2
Diff of
/templates/breast.html
[000000]
..
[b018ba]
Switch to side-by-side view
--- a +++ b/templates/breast.html @@ -0,0 +1,192 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>Breast Cancer Predictor</title> + <!-- Bootstrap CSS link --> + <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" + integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" + crossorigin="anonymous"> + <!-- Your custom CSS --> + <style> + body { + font-family: Cambria; + background-image: linear-gradient(#68e9f0, #93bbec); + height: 100%; + } + + .container { + max-width: 800px; + margin: 0 auto; + padding-top: 50px; + } + + .input-box { + margin-bottom: 15px; + border: 2px solid #000000; + background-color: #aae0ea; + width: 100%; + padding: 10px; + font-size: 18px; + border-radius: 5px; + } + + .logo { + display: block; + margin: 0 auto; + width: 200px; + height: auto; + margin-bottom: 20px; + } + + .btn-predict { + background-color: #4de0dd; + color: #fff; + margin-top: 20px; + padding: 15px 30px; + font-size: 20px; + border-radius: 5px; + width: 100%; + } + + + + .btn-home { + background-color: #000000; /* Black color */ + color: white; + height: 50px; + width: 100px; + padding: 4px 4px; /* Smaller padding */ + font-size: 26px; /* Smaller font size */ + border-radius: 5px; + margin-top: -12px; + margin-bottom: -32px; + display: block; + margin-left: auto; + margin-right: auto; + text-decoration: none; /* Remove underline */ + text-align: center; +} + +.btn-home:hover { + background-color: #333333; /* Darker shade of black on hover */ + color: white; /* Keep text white on hover */ + text-decoration: none; /* Remove underline on hover */ +} + + + + </style> +</head> + +<body> + <!-- Header --> + <header> + <img src="/static/NEWLOGO.png" alt="Logo" class="logo"> + </header> + <br> + + <!-- Home Button --> + <div> + <a href="/" class="btn-home">Home</a> <!-- Link to the home page --> + </div> + + <!-- Main Content --> + <div class="container"> + <h1 class="text-center mb-4">Breast Cancer Predictor</h1> + <div class="card mb-4"> + <div class="card-body"> + <form action="/predictb/" method="POST"> + {% csrf_token %} + <div class="form-group"> + <input class="form-control input-box" type="text" name="texture_mean" placeholder="Texture Mean"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="smoothness_mean" + placeholder="Smoothness Mean"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="compactness_mean" + placeholder="Compactness Mean"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="concave_points_mean" + placeholder="Concave Points Mean"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="symmetry_mean" + placeholder="Symmetry Mean"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="fractal_dimension_mean" + placeholder="Fractal Dimension Mean"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="texture_se" + placeholder="Texture Standard Error"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="area_se" placeholder="Area Standard Error"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="smoothness_se" + placeholder="Smoothness Standard Error"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="compactness_se" + placeholder="Compactness Standard Error"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="concavity_se" + placeholder="Concavity Standard Error"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="concave_points_se" + placeholder="Concave Points Standard Error"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="symmetry_se" + placeholder="Symmetry Standard Error"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="fractal_dimension_se" + placeholder="Fractal Dimension Standard Error"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="texture_worst" placeholder="Texture Worst"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="area_worst" placeholder="Area Worst"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="smoothness_worst" + placeholder="Smoothness Worst"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="compactness_worst" + placeholder="Compactness Worst"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="concavity_worst" placeholder="Concavity Worst"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="concave_points_worst" placeholder="Concave Points Worst"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="symmetry_worst" placeholder="Symmetry Worst"> + </div> + <div class="form-group"> + <input class="form-control input-box" type="text" name="fractal_dimension_worst" placeholder="Fractal Dimension Worst"> + </div> + + <!-- Predict button --> + <button type="submit" class="btn btn-primary btn-predict">Predict</button> + </form> + </div> + </div> + </div> + </body> + + </html>