dodex-vertx

<!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <meta http-equiv=X-UA-Compatible content="IE=edge"> <meta name=viewport content="width=device-width,initial-scale=1"> <title>Golf Handicap Index</title> <link rel=icon href=./favicon.ico> <script defer=defer src=./dist/main.js></script><link href=./dist/main.css rel=stylesheet></head> <body> <div class="container mt-5 w-7-c fs-15"> <div class=nav-item> <span class=dodex--open> <img src=./dodex_g.ico> </span> </div> <ul class="m-0 nav nav-fill nav-justified nav-tabs" id=myTab role=tablist> <li class=nav-item role=presentation> <button class="active nav-link" id=handicap-tab data-bs-toggle=tab data-bs-target=#handicap-page type=button role=tab aria-controls=handicap-page aria-selected=true> <i class="fa-solid fa-golf-ball-tee"></i> Handicap </button> </li> <li class=nav-item role=presentation> <button class=nav-link id=scores-tab data-bs-toggle=tab data-bs-target=#scores type=button role=tab aria-controls=scores aria-selected=false> <i class="fa-solid fa-list"></i> Scores </button> </li> <li class=nav-item role=presentation> <button class=nav-link id=weather-tab data-bs-toggle=tab data-bs-target=#weather type=button role=tab aria-controls=weather aria-selected=false> <i class="fa-solid fa-bolt"></i> Weather </button> </li> <li class=nav-item role=presentation> <button class=nav-link id=settings-tab data-bs-toggle=tab data-bs-target=#settings type=button role=tab aria-controls=settings aria-selected=false> <i class="fa fa-music" aria-hidden=true></i> Music </button> </li> </ul> <div class="border-grey page-bg-c tab-content"> <div class="tab-pane active hrem-40" id=handicap-page role=tabpanel aria-labelledby=hanicap-tab> <div class=container> <div class="container-flex form-bg-c"> <div class=messagePopup id=popupMessage> <div id=message class="alert alert-dismissible messageBorder" role=alert hidden> <span class=replace></span> </div> </div> <form class=""> <div class="row d-flex justify-content-center ms-6-c pt-4"> <div class="col-md-10 text-center stay"> <p>CALCULATE GOLF HANDICAP INDEX</p> </div> </div> <div class="row gx-2 d-flex justify-content-center pt-2"> <div class=col-md-2> <label for=pin class=form-label>Pin</label> <input type=password class="form-control form-control-c h-40" id=pin pattern=^[A-Za-z]{2}.{4,6}> </div> <div class=col-md-2> <label for=fname class=form-label>First Name</label> <input type=text class="form-control form-control-c form-control-md h-40" id=fname pattern=^.{3,20}$> </div> <div class=col-md-4> <label for=lname class=form-label>Last Name</label> <input type=text class="form-control form-control-c h-40" id=lname pattern=^.{5,40}$> </div> <div class=col-md-2> <label for=login id=lfor><i class="" id=ggc></i></label> <button type=text class="form-control h-40 btn btn-c mt-2 btn-dark shadow-none" id=login>Login</button> </div> </div> <div class="row gx-2 d-flex justify-content-center ms-6-c"> <div class=col-md-6> <label for=course class=form-label>Course</label> <input list=courses id=course class="form-control form-control-c h-rem" placeholder="Add or Select Course" pattern=^.{8,80}$> <datalist id=courses> <option value=""></option> </datalist> <div class="col-md-12 my-2"> <label for=country class=form-label>Country</label> <select id=country class="form-select form-select-c shadow-none h-rem"> <option>select country</option> </select> </div> <div class="col-md-12 mb-2"> <label for=state class=form-label>State</label> <span id=state-code></span> </div> </div> <div class="col-md-2 ps-4 stay"> <label for=tees>Change</label> <input type=color class="form-control form-control-color shadow-none py-1" value=#ffffff id=tees> Colors </div> <div class=col-md-2> <row-fluid> <div class=form-check> <input class="form-check-input bg-secondary shadow-none" type=radio name=radio-color id=radio-color1 value=0> <label class="form-check-label text-white text-center w-100" for=radio-color1 style=background-color:#000000>   </label> </div> <div class=form-check> <input class="form-check-input bg-secondary shadow-none" type=radio name=radio-color id=radio-color2 value=1> <label class="form-check-label text-white text-center w-100" for=radio-color2 style=background-color:#0000ff>   </label> </div> <div class=form-check> <input class="form-check-input bg-secondary shadow-none" type=radio name=radio-color id=radio-color3 value=2 checked=checked> <label class="form-check-label text-black text-center w-100" for=radio-color3 style=background-color:#ffffff>   </label> </div> <div class=form-check> <input class="form-check-input bg-secondary shadow-none" type=radio name=radio-color id=radio-color4 value=3> <label class="form-check-label text-black text-center w-100" style=background-color:#ffc107 for=radio-color4>   </label> </div> <div class=form-check> <input class="form-check-input bg-secondary shadow-none" type=radio name=radio-color id=radio-color5 value=4> <label class="form-check-label text-black text-center w-100" for=radio-color5 style=background-color:#dc3545>   </label> </div> </row-fluid></div> </div> <div class="row gx-2 d-flex justify-content-center ms-6-c"> <div class=col-md-3> <label for=rating class=form-label>Course Rating</label> <input type=text class="form-control form-control-c h-40" id=rating pattern=^[3-7][0-9]\.[0-9]$ autocomplete=off> </div> <div class=col-md-3> <label for=slope class=form-label>Course Slope</label> <input type=text class="form-control form-control-c h-40" id=slope pattern=^[1-9]\d{1,2}$ autocomplete=off> </div> <div class=col-md-2> <label for=par class=form-label>Par</label> <input type=text class="form-control form-control-c h-40" id=par pattern=^[2-7]\d$ autocomplete=off> </div> <div class=col-md-2> <label for=add-course></label> <button type=text class="form-control h-40 btn btn-c btn-dark shadow-none mt-2" id=add-course> Add Tee </button> </div> </div> <div class="row gx-2 d-flex justify-content-center ms-6-c"> <div class=col-md-2> <label for=total-score class=form-label>Gross Score</label> <input type=text class="form-control form-control-c h-40" id=total-score autocomplete=off pattern=\d{2,3}> </div> <div class=col-md-2> <label for=net-score class=form-label>Net Score</label> <input type=text class="form-control form-control-c h-40" id=net-score disabled=disabled> </div> <div class=col-md-3> <label for=adjusted-score class=form-label>Adjusted Score</label> <input type=text class="form-control form-control-c h-40" id=adjusted-score autocomplete=off pattern=\d{2,3}> </div> <div class=col-md-1></div> <div class=col-md-2> <label for=handicap class=form-label>Handicap</label> <input type=text class="form-control form-control-c h-40" id=handicap disabled=disabled> </div> </div> <div class="row gx-2 d-flex justify-content-center ms-6-c"> <div class=col-md-3> <label for=teetime class=form-label>Tee Time</label> <input name=tee_time type=text class="p1-c form-control form-control-c h-40" id=teetime placeholder="Click for Calendar" autocomplete=off pattern="^\d{4}-\d{2}-\d{2}, \d{2}:\d{2}$"> </div> <div class=col-md-1></div> <ul class="col-md-4 ul-style-c"> <li> <div class="form-check mt-md-3"> <input class="form-check-input shadow-none check-box-c" type=checkbox id=overlap> <label class=form-check-label for=overlap> Overlap Years </label> </div> </li> <li> <div class="form-check mt-2"> <input class="form-check-input shadow-none check-box-c" type=checkbox id=public> <label class=form-check-label for=public> Public </label> </div> </li> </ul> <div class=col-md-2> <label for=course-handicap class=form-label>Course</label> <input type=text class="p1-c form-control form-control-c h-10" id=course-handicap disabled=disabled> Handicap </div> </div> <div class="row gx-2 d-flex justify-content-center ms-6-c pb-3"> <div class=col-md-2> <button type=text class="form-control btn btn-c btn-dark shadow-none p-1" id=add-score> Add Score </button> </div> <div class=col-md-2> <button type=text class="form-control btn btn-c btn-dark shadow-none p-1" id=cancel> Cancel </button> </div> <div class=col-md-4> <button type=text class="form-control btn btn-c btn-dark shadow-none p-1" id=remove-last> Remove Last Score </button> </div> </div> </form> </div> </div> </div> <div class=tab-pane id=weather role=tabpanel aria-labelledby=weather-tab> <pre> </pre> <p> </p><div class=center> <div id=weather-conditions></div> </div> <p></p> </div> <div class=tab-pane id=scores role=tabpanel aria-labelledby=scores-tab> <label class="mt-md-3 mb-md-3 ms-md-3 me-md-2 font-weight-bold handicap-blue" for=golfers>Golfers:</label> <select id=golfers class="w-25 h-rem"> <option></option> </select> <table id=table data-pagination=true data-page-size=10 data-page-list="[5, 10, 20]" data-show-footer=true data-side-pagination=client> <thead> <tr> <th data-field=COURSE_NAME>COURSE_NAME</th> <th data-field=GROSS_SCORE>GROSS_SCORE</th> <th data-field=NET_SCORE>NET_SCORE</th> <th data-field=ADJUSTED_SCORE>ADJUSTED_SCORE</th> <th data-field=HANDICAP>HANDICAP</th> <th data-field=COURSE_TEES>COURSE_TEES</th> <th data-field=TEE_TIME> TEE_TIME  </th> <th data-field=USED>USED</th> </tr> </thead> </table> </div> <div class=tab-pane id=settings role=tabpanel aria-labelledby=settings-tab> <pre> </pre> <iframe width=100% height=450 src=https://jazzdeville.com></iframe> <pre> </pre> </div> </div> </div> <div id=jsoneditor class=editor style="z-index: -1"></div> </body> </html>