|
|
@@ -0,0 +1,99 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+ <head>
|
|
|
+ <title>WoW Achievement Comparator</title>
|
|
|
+ <link rel="stylesheet" href="https://use.fontawesome.com/fb25a8fad8.css">
|
|
|
+ <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
|
|
|
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/css/bootstrap-select.min.css">
|
|
|
+ <link rel="stylesheet" href="https://cdn.datatables.net/v/bs/dt-1.10.15/datatables.min.css"/>
|
|
|
+ <link rel="stylesheet" href="style.css" />
|
|
|
+ </head>
|
|
|
+ <body>
|
|
|
+ <div class="container">
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-md-4 col-md-offset-2">
|
|
|
+ <div class="panel panel-default">
|
|
|
+ <div class="panel-heading">
|
|
|
+ <h3 class="panel-title">Add character</h3>
|
|
|
+ </div>
|
|
|
+ <div class="panel-body">
|
|
|
+ <form role="form" id="character">
|
|
|
+ <fieldset>
|
|
|
+ <div class="form-group">
|
|
|
+ <select title="Select realm..." class="form-control selectpicker" data-live-search="true" name="realm">
|
|
|
+ <option value="neptulon">
|
|
|
+ Neptulon
|
|
|
+ </option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ <div class="form-group">
|
|
|
+ <input class="form-control" placeholder="Character name" name="name" autofocus="" type="text">
|
|
|
+ </div>
|
|
|
+ <button class="btn btn-block btn-primary">Add <i class="fa fa-plus"></i></button>
|
|
|
+ </fieldset>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-md-4">
|
|
|
+ <div class="panel panel-default">
|
|
|
+ <div class="panel-heading">
|
|
|
+ <h3 class="panel-title">Select achievement</h3>
|
|
|
+ </div>
|
|
|
+ <div class="panel-body">
|
|
|
+ <form role="form" id="achievement">
|
|
|
+ <fieldset>
|
|
|
+ <div class="form-group">
|
|
|
+ <select title="Search achievement..." class="form-control selectpicker" data-live-search="true" name="achievement">
|
|
|
+ <option value="achievement">
|
|
|
+ Explore...
|
|
|
+ </option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ <button class="btn btn-block btn-primary">Update</button>
|
|
|
+ </fieldset>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-md-12">
|
|
|
+ <table class="table table-striped dataTable no-footer" role="grid" cellspacing="0">
|
|
|
+ <thead>
|
|
|
+ <tr role="row">
|
|
|
+ <th>
|
|
|
+ Character
|
|
|
+ </th>
|
|
|
+ <th>
|
|
|
+ Progress
|
|
|
+ </th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody>
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ Example
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="progress-bar" role="progressbar" aria-valuenow="38"
|
|
|
+ aria-valuemin="0" aria-valuemax="57" style="width:66.7%">
|
|
|
+ <span class="sr-only">38/57 Complete</span>
|
|
|
+ 38/57
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
|
|
|
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
|
|
|
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js"></script>
|
|
|
+ <script src="https://cdn.datatables.net/v/bs/dt-1.10.15/datatables.min.js"></script>
|
|
|
+ </body>
|
|
|
+</html>
|
Tankernn