Spaces:
Runtime error
Runtime error
| <!-- saved from url=(0022)http://127.0.0.1:8080/ --> | |
| <html lang="en" class="fontawesome-i2svg-active fontawesome-i2svg-complete"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | |
| <meta name="description" content=""> | |
| <meta name="author" content=""> | |
| <title>Web App</title> | |
| <style type="text/css">svg:not(:root).svg-inline--fa{overflow:visible}.svg-inline--fa{display:inline-block;font-size:inherit;height:1em;overflow:visible;vertical-align:-.125em}.svg-inline--fa.fa-lg{vertical-align:-.225em}.svg-inline--fa.fa-w-1{width:.0625em}.svg-inline--fa.fa-w-2{width:.125em}.svg-inline--fa.fa-w-3{width:.1875em}.svg-inline--fa.fa-w-4{width:.25em}.svg-inline--fa.fa-w-5{width:.3125em}.svg-inline--fa.fa-w-6{width:.375em}.svg-inline--fa.fa-w-7{width:.4375em}.svg-inline--fa.fa-w-8{width:.5em}.svg-inline--fa.fa-w-9{width:.5625em}.svg-inline--fa.fa-w-10{width:.625em}.svg-inline--fa.fa-w-11{width:.6875em}.svg-inline--fa.fa-w-12{width:.75em}.svg-inline--fa.fa-w-13{width:.8125em}.svg-inline--fa.fa-w-14{width:.875em}.svg-inline--fa.fa-w-15{width:.9375em}.svg-inline--fa.fa-w-16{width:1em}.svg-inline--fa.fa-w-17{width:1.0625em}.svg-inline--fa.fa-w-18{width:1.125em}.svg-inline--fa.fa-w-19{width:1.1875em}.svg-inline--fa.fa-w-20{width:1.25em}.svg-inline--fa.fa-pull-left{margin-right:.3em;width:auto}.svg-inline--fa.fa-pull-right{margin-left:.3em;width:auto}.svg-inline--fa.fa-border{height:1.5em}.svg-inline--fa.fa-li{width:2em}.svg-inline--fa.fa-fw{width:1.25em}.fa-layers svg.svg-inline--fa{bottom:0;left:0;margin:auto;position:absolute;right:0;top:0}.fa-layers{display:inline-block;height:1em;position:relative;text-align:center;vertical-align:-.125em;width:1em}.fa-layers svg.svg-inline--fa{-webkit-transform-origin:center center;transform-origin:center center}.fa-layers-counter,.fa-layers-text{display:inline-block;position:absolute;text-align:center}.fa-layers-text{left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transform-origin:center center;transform-origin:center center}.fa-layers-counter{background-color:#ff253a;border-radius:1em;-webkit-box-sizing:border-box;box-sizing:border-box;color:#fff;height:1.5em;line-height:1;max-width:5em;min-width:1.5em;overflow:hidden;padding:.25em;right:0;text-overflow:ellipsis;top:0;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:top right;transform-origin:top right}.fa-layers-bottom-right{bottom:0;right:0;top:auto;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:bottom right;transform-origin:bottom right}.fa-layers-bottom-left{bottom:0;left:0;right:auto;top:auto;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:bottom left;transform-origin:bottom left}.fa-layers-top-right{right:0;top:0;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:top right;transform-origin:top right}.fa-layers-top-left{left:0;right:auto;top:0;-webkit-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:top left;transform-origin:top left}.fa-lg{font-size:1.3333333333em;line-height:.75em;vertical-align:-.0667em}.fa-xs{font-size:.75em}.fa-sm{font-size:.875em}.fa-1x{font-size:1em}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-6x{font-size:6em}.fa-7x{font-size:7em}.fa-8x{font-size:8em}.fa-9x{font-size:9em}.fa-10x{font-size:10em}.fa-fw{text-align:center;width:1.25em}.fa-ul{list-style-type:none;margin-left:2.5em;padding-left:0}.fa-ul>li{position:relative}.fa-li{left:-2em;position:absolute;text-align:center;width:2em;line-height:inherit}.fa-border{border:solid .08em #eee;border-radius:.1em;padding:.2em .25em .15em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left,.fab.fa-pull-left,.fal.fa-pull-left,.far.fa-pull-left,.fas.fa-pull-left{margin-right:.3em}.fa.fa-pull-right,.fab.fa-pull-right,.fal.fa-pull-right,.far.fa-pull-right,.fas.fa-pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.fa-rotate-90{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{-webkit-transform:scale(-1,1);transform:scale(-1,1)}.fa-flip-vertical{-webkit-transform:scale(1,-1);transform:scale(1,-1)}.fa-flip-both,.fa-flip-horizontal.fa-flip-vertical{-webkit-transform:scale(-1,-1);transform:scale(-1,-1)}:root .fa-flip-both,:root .fa-flip-horizontal,:root .fa-flip-vertical,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-rotate-90{-webkit-filter:none;filter:none}.fa-stack{display:inline-block;height:2em;position:relative;width:2.5em}.fa-stack-1x,.fa-stack-2x{bottom:0;left:0;margin:auto;position:absolute;right:0;top:0}.svg-inline--fa.fa-stack-1x{height:1em;width:1.25em}.svg-inline--fa.fa-stack-2x{height:2em;width:2.5em}.fa-inverse{color:#fff}.sr-only{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.sr-only-focusable:active,.sr-only-focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}.svg-inline--fa .fa-primary{fill:var(--fa-primary-color,currentColor);opacity:1;opacity:var(--fa-primary-opacity,1)}.svg-inline--fa .fa-secondary{fill:var(--fa-secondary-color,currentColor);opacity:.4;opacity:var(--fa-secondary-opacity,.4)}.svg-inline--fa.fa-swap-opacity .fa-primary{opacity:.4;opacity:var(--fa-secondary-opacity,.4)}.svg-inline--fa.fa-swap-opacity .fa-secondary{opacity:1;opacity:var(--fa-primary-opacity,1)}.svg-inline--fa mask .fa-primary,.svg-inline--fa mask .fa-secondary{fill:#000}.fad.fa-inverse{color:#fff}</style><link rel="icon" type="image/x-icon" href="http://127.0.0.1:8080/static/assets/favicon.ico"> | |
| <!-- Font Awesome icons (free version)--> | |
| <script src="./Web App_files/all.js.download" crossorigin="anonymous"></script> | |
| <!-- Google fonts--> | |
| <link href="./Web App_files/css" rel="stylesheet" type="text/css"> | |
| <link href="./Web App_files/css(1)" rel="stylesheet" type="text/css"> | |
| <!-- Core theme CSS (includes Bootstrap)--> | |
| <link href="./Web App_files/styles.css" rel="stylesheet"> | |
| </head> | |
| <body class="form-v9" data-new-gr-c-s-check-loaded="14.1218.0" data-gr-ext-installed=""> | |
| <!-- Page Header --> | |
| <header class="masthead" style="background-image: url('static/assets/img/wine.jpg')"> | |
| <div class="container position-relative px-4 px-lg-5"> | |
| <div class="row gx-4 gx-lg-5 justify-content-center"> | |
| <div class="col-md-10 col-lg-8 col-xl-7"> | |
| <div class="site-heading"> | |
| <h1>Wine Quality Prediction</h1> | |
| <span class="subheading">A Wine Quality Checking Web App</span> | |
| <span class="subheading">For predictions, please input numerical values as shown in the table below.</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Table for Examples --> | |
| <div class="container mt-5"> | |
| <div class="row justify-content-center"> | |
| <div class="col-md-10"> | |
| <table class="table table-striped table-bordered text-center" style="font-size: 0.85rem;"> | |
| <thead> | |
| <tr> | |
| <th>Fixed Acidity</th> | |
| <th>Volatile Acidity</th> | |
| <th>Citric Acid</th> | |
| <th>Residual Sugar</th> | |
| <th>Chlorides</th> | |
| <th>Free Sulfur Dioxide</th> | |
| <th>Total Sulfur Dioxide</th> | |
| <th>Density</th> | |
| <th>pH</th> | |
| <th>Sulphates</th> | |
| <th>Alcohol</th> | |
| <th>Quality</th> | |
| </tr> | |
| </thead> | |
| <tbody> | |
| <tr> | |
| <td>7.4</td> | |
| <td>0.7</td> | |
| <td>0</td> | |
| <td>1.9</td> | |
| <td>0.076</td> | |
| <td>11</td> | |
| <td>34</td> | |
| <td>0.9978</td> | |
| <td>3.51</td> | |
| <td>0.56</td> | |
| <td>9.4</td> | |
| <td>5</td> | |
| </tr> | |
| <tr> | |
| <td>7.8</td> | |
| <td>0.88</td> | |
| <td>0</td> | |
| <td>2.6</td> | |
| <td>0.098</td> | |
| <td>25</td> | |
| <td>67</td> | |
| <td>0.9968</td> | |
| <td>3.2</td> | |
| <td>0.68</td> | |
| <td>9.8</td> | |
| <td>5</td> | |
| </tr> | |
| <tr> | |
| <td>7.8</td> | |
| <td>0.76</td> | |
| <td>0.04</td> | |
| <td>2.3</td> | |
| <td>0.092</td> | |
| <td>15</td> | |
| <td>54</td> | |
| <td>0.997</td> | |
| <td>3.26</td> | |
| <td>0.65</td> | |
| <td>9.8</td> | |
| <td>5</td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Main Content--> | |
| <div class="container px-4 px-lg-5"> | |
| <title>Form-v9 by Colorlib</title> | |
| <!-- Mobile Specific Metas --> | |
| <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> | |
| <!-- Font--> | |
| <link rel="stylesheet" type="text/css" href="./Web App_files/nunito-font.css"> | |
| <!-- Main Style Css --> | |
| <link rel="stylesheet" href="./Web App_files/style.css"> | |
| <div class="page-content"> | |
| <div class="form-v9-content" style="background-image: url('static/assets/img/form-v9.jpg')"> | |
| <form class="form-detail" action="http://127.0.0.1:8080/predict" method="post"> | |
| <h2>Please Fill The Information</h2> | |
| <div class="form-row-total"> | |
| <div class="form-row"> | |
| <label for="fixed_acidity"> Fixed Acidity:</label> | |
| <input type="text" name="fixed_acidity" id="fixed_acidity" class="input-text" placeholder="fixed_acidity" required=""> | |
| </div> | |
| <div class="form-row"> | |
| <label for="volatile_acidity"> Volatile Acidity:</label> | |
| <input type="text" name="volatile_acidity" id="volatile_acidity" class="input-text" placeholder="volatile_acidity" required=""> | |
| </div> | |
| </div> | |
| <div class="form-row-total"> | |
| <div class="form-row"> | |
| <label for="citric_acid"> Citric Acid:</label> | |
| <input type="text" name="citric_acid" id="citric_acid" class="input-text" placeholder="citric_acid" required=""> | |
| </div> | |
| <div class="form-row"> | |
| <label for="residual_sugar"> Residual Sugar:</label> | |
| <input type="text" name="residual_sugar" id="residual_sugar" class="input-text" placeholder="residual_sugar" required=""> | |
| </div> | |
| </div> | |
| <div class="form-row-total"> | |
| <div class="form-row"> | |
| <label for="chlorides"> Chlorides:</label> | |
| <input type="text" name="chlorides" id="chlorides" class="input-text" placeholder="chlorides" required=""> | |
| </div> | |
| <div class="form-row"> | |
| <label for="free_sulfur_dioxide"> Free Sulfur Dioxide:</label> | |
| <input type="text" name="free_sulfur_dioxide" id="free_sulfur_dioxide" class="input-text" placeholder="free_sulfur_dioxide" required=""> | |
| </div> | |
| </div> | |
| <div class="form-row-total"> | |
| <div class="form-row"> | |
| <label for="total_sulfur_dioxide"> Total Sulfur Dioxide:</label> | |
| <input type="text" name="total_sulfur_dioxide" id="total_sulfur_dioxide" class="input-text" placeholder="total_sulfur_dioxide" required=""> | |
| </div> | |
| <div class="form-row"> | |
| <label for="density"> Density:</label> | |
| <input type="text" name="density" id="density" class="input-text" placeholder="density" required=""> | |
| </div> | |
| </div> | |
| <div class="form-row-total"> | |
| <div class="form-row"> | |
| <label for="pH"> pH:</label> | |
| <input type="text" name="pH" id="pH" class="input-text" placeholder="pH" required=""> | |
| </div> | |
| <div class="form-row"> | |
| <label for="sulphates"> Sulphates:</label> | |
| <input type="text" name="sulphates" id="sulphates" class="input-text" placeholder="sulphates" required=""> | |
| </div> | |
| </div> | |
| <div class="form-row-total"> | |
| <div class="form-row"> | |
| <label for="alcohol"> Alcohol:</label> | |
| <input type="text" name="alcohol" id="alcohol" class="input-text" placeholder="alcohol" required=""> | |
| </div> | |
| </div> | |
| <div class="form-row-last"> | |
| <input type="submit" name="register" class="register" value="Predict"> | |
| </div> | |
| </form> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Footer--> | |
| <footer class="border-top"> | |
| <div class="container px-4 px-lg-5"> | |
| <div class="row gx-4 gx-lg-5 justify-content-center"> | |
| <div class="col-md-10 col-lg-8 col-xl-7"> | |
| <ul class="list-inline text-center"> | |
| <li class="list-inline-item"> | |
| <a href="http://www.linkedin.com/in/muhammad-rasoul-sahibzadah-b97a47218/"> | |
| <span class="fa-stack fa-lg"> | |
| <svg class="svg-inline--fa fa-circle fa-w-16 fa-stack-2x" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="circle" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8z"></path></svg><!-- <i class="fas fa-circle fa-stack-2x"></i> Font Awesome fontawesome.com --> | |
| <svg class="svg-inline--fa fa-linkedin fa-w-14 fa-stack-1x fa-inverse" aria-hidden="true" focusable="false" data-prefix="fab" data-icon="linkedin" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"></path></svg><!-- <i class="fab fa-linkedin fa-stack-1x fa-inverse"></i> Font Awesome fontawesome.com --> | |
| </span> | |
| </a> | |
| </li> | |
| <li class="list-inline-item"> | |
| <a href="https://github.com/rasoul1234"> | |
| <span class="fa-stack fa-lg"> | |
| <svg class="svg-inline--fa fa-circle fa-w-16 fa-stack-2x" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="circle" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8z"></path></svg><!-- <i class="fas fa-circle fa-stack-2x"></i> Font Awesome fontawesome.com --> | |
| <svg class="svg-inline--fa fa-github fa-w-16 fa-stack-1x fa-inverse" aria-hidden="true" focusable="false" data-prefix="fab" data-icon="github" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512" data-fa-i2svg=""><path fill="currentColor" d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"></path></svg><!-- <i class="fab fa-github fa-stack-1x fa-inverse"></i> Font Awesome fontawesome.com --> | |
| </span> | |
| </a> | |
| </li> | |
| </ul> | |
| <div class="small text-center text-muted fst-italic"></div> | |
| <div class="small text-center text-muted fst-italic"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- Bootstrap core JS--> | |
| <script src="./Web App_files/bootstrap.bundle.min.js.download"></script> | |
| <!-- Core theme JS--> | |
| <script src="./Web App_files/scripts.js.download"></script> | |
| </body><!-- This templates was made by Colorlib (https://colorlib.com) --><grammarly-desktop-integration data-grammarly-shadow-root="true"><template shadowrootmode="open"><style> | |
| div.grammarly-desktop-integration { | |
| position: absolute; | |
| width: 1px; | |
| height: 1px; | |
| padding: 0; | |
| margin: -1px; | |
| overflow: hidden; | |
| clip: rect(0, 0, 0, 0); | |
| white-space: nowrap; | |
| border: 0; | |
| -moz-user-select: none; | |
| -webkit-user-select: none; | |
| -ms-user-select:none; | |
| user-select:none; | |
| } | |
| div.grammarly-desktop-integration:before { | |
| content: attr(data-content); | |
| } | |
| </style><div aria-label="grammarly-integration" role="group" tabindex="-1" class="grammarly-desktop-integration" data-content="{"mode":"full","isActive":true,"isUserDisabled":false}"></div></template></grammarly-desktop-integration></html> |