Pomodoro Timer Template

Bootstrap template para criar um pomodoro

by Tiago Sousa

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<div class="jumbotron text-center">
  <div class="container-fluid">

    <h1>
    Pomodoro Timer
    </h1>
    <button type="button" class="btn btn-md btn-success">Pomodoro</button>
    <button type="button" class="btn btn-md btn-default">Short Break</button>
    <button type="button" class="btn btn-md btn-default">Long Break</button>
    <hr/>
    <div class="panel panel-default">
      <h1>
  00:50:00
  </h1>
      <div class="panel-body">
        <button type="button" class="btn btn-lg btn-warning">
          <i class="fa fa-step-backward"></i>
          Reset
        </button>
        <button type="button" class="btn btn-lg btn-primary">
          <i class="fa fa-play"></i>
          Start
        </button>
        <button type="button" class="btn btn-lg btn-danger">
          <i class="fa fa-stop"></i>
          Stop
        </button>
      </div>
    </div>
  </div>
</div>