index.html 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <title>Pomodoro Clock</title>
  6. <link
  7. rel="stylesheet"
  8. href="./bootstrap.min.css"
  9. />
  10. <link
  11. rel="stylesheet"
  12. href="https://fonts.googleapis.com/css?family=Poiret+One"
  13. />
  14. <link
  15. rel="stylesheet"
  16. href="./font-awesome.min.css"
  17. />
  18. <link rel="stylesheet" href="./style.css" />
  19. </head>
  20. <body>
  21. <!-- partial:index.partial.html -->
  22. <div class="row">
  23. <div class="col-xs-2 col-md-2"></div>
  24. <div class="col-xs-8 col-md-8" id="main">
  25. <h1 id="header">Pomodoro Clock</h1>
  26. <div id="pomodoro-clock">
  27. <h1 id="state">Session</h1>
  28. <h1 id="timer">25:00</h1>
  29. <div class="progress" id="progress">
  30. <div
  31. class="progress-bar progress-bar-striped progress-bar-success active"
  32. id="progress-bar"
  33. style="width: 0%"
  34. ></div>
  35. </div>
  36. </div>
  37. <ul id="main-ul">
  38. <li id="session-li" class="sb-li">
  39. <ul id="session-ul" class="sb-ul">
  40. <li class="sb-li2">Session:</li>
  41. <br />
  42. <li id="session-plus" class="sb-li2 clickable">
  43. <i class="fa fa-plus"></i>
  44. </li>
  45. <li id="session-display" class="sb-li2">25:00</li>
  46. <li id="session-minus" class="sb-li2 clickable">
  47. <i class="fa fa-minus"></i>
  48. </li>
  49. </ul>
  50. </li>
  51. <li id="break-li" class="sb-li">
  52. <ul id="break-ul" class="sb-ul">
  53. <li class="sb-li2">Break:</li>
  54. <br />
  55. <li id="break-plus" class="sb-li2 clickable">
  56. <i class="fa fa-plus"></i>
  57. </li>
  58. <li id="break-display" class="sb-li2">5:00</li>
  59. <li id="break-minus" class="sb-li2 clickable">
  60. <i class="fa fa-minus"></i>
  61. </li>
  62. </ul>
  63. </li>
  64. </ul>
  65. </div>
  66. <div class="col-xs-2 col-md-2"></div>
  67. </div>
  68. <!-- partial -->
  69. <script src="./jquery.min.js"></script>
  70. <script src="./script.js"></script>
  71. </body>
  72. </html>