reactlogic
/
blitz


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
							<!doctype html>
<html ng-app="720kb">
<head>
  <link rel="stylesheet" type="text/css" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.min.css">
  <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/1.5.2/semantic.min.css">
  <link rel="stylesheet" type="text/css" href="src/css/angular-tooltips.css">
  <title>Semantic-UI Tooltips</title>
</head>
<body class="center-content" style="margin:50px auto; float:none; max-width:200px;">
  <div class="ui divider"></div>
  <div class="col6 offset-left2">
    <div class="ui button" tooltips tooltip-content="Yeo man!" tooltip-size="small" tooltip-side="left">
        Small left
    </div>
    <div class="ui divider"></div>

    <div class="ui teal button" tooltips tooltip-content="Yeo man!" tooltip-size="medium" tooltip-side="left">
        Medium left
    </div>

    <div class="ui divider"></div>
    <div class="ui green button" tooltips tooltip-content="Yeo man!" tooltip-size="large" tooltip-side="left">
        Large left
    </div>

    <div class="ui divider"></div>
    <div class="ui button" tooltips tooltip-content="Yeo man!" tooltip-size="small" tooltip-side="right">
        Small right
    </div>
    <div class="ui divider"></div>

    <div class="ui teal button" tooltips tooltip-content="Yeo man!" tooltip-size="medium" tooltip-side="right">
        Medium right
    </div>

    <div class="ui divider"></div>

    <div class="ui green button" tooltips tooltip-content="Yeo man!" tooltip-size="large" tooltip-side="right">
        Large right
    </div>

    

    <div class="ui divider"></div>
    <div class="ui button" tooltips tooltip-content="Yeo man!" tooltip-size="small" tooltip-side="top">
        Small top
    </div>
    <div class="ui divider"></div>

    <div class="ui teal button" tooltips tooltip-content="Yeo man!" tooltip-size="medium" tooltip-side="top">
        Medium top
    </div>

    <div class="ui divider"></div>
    <div class="ui green button" tooltips tooltip-content="Yeo man!" tooltip-size="large" tooltip-side="top">
        Large top
    </div>

    <div class="ui divider"></div>
    <div class="ui button" tooltips tooltip-content="Yeo man!" tooltip-size="small" tooltip-side="bottom">
        Small bottom
    </div>
    <div class="ui divider"></div>

    <div class="ui teal button" tooltips tooltip-content="Yeo man!" tooltip-size="medium" tooltip-side="bottom">
        Medium bottom
    </div>

    <div class="ui divider"></div>
    <div class="ui green button" tooltips tooltip-content="Yeo man!" tooltip-size="large" tooltip-side="bottom">
        Large bottom
    </div>
    <div class="ui divider"></div>
  </div>

  <table class="ui small sortable padded table segment">
    <thead>
      <tr>
        <th class="two wide">pos</th>
        <th class="three wide">val1</th>
        <th class="one wide">val2</th>
        <th class="five wide">val3</th>
      </tr>
      </thead>
      <tbody>
        <tr>
          <td><a tooltips tooltip-content="Yeo man!" tooltip-side="top">top</a></td>
          <td>111</td>
          <td>222</td>
          <td>333</td>
        </tr>
        <tr>
          <td><a tooltips tooltip-content="Yeo man!" tooltip-side="bottom">bottom</a></td>
          <td>111</td>
          <td>222</td>
          <td>333</td>
        </tr>
        <tr>
          <td><a tooltips tooltip-content="Yeo man!" tooltip-side="left">left</a></td>
          <td>111</td>
          <td>222</td>
          <td>333</td>
        </tr>
        <tr>
          <td><a tooltips tooltip-content="Yeo man!" tooltip-side="right">right</a></td>
          <td>111</td>
          <td>222</td>
          <td>333</td>
        </tr>
      </tbody>
    </table>

  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular-route.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/1.5.2/semantic.min.js"></script>
  <script type="text/javascript" src="src/js/angular-tooltips.js"></script>
  <script type="text/javascript" src="assets/js/index.js"></script>
</body>
</html>