Skip to content

Instantly share code, notes, and snippets.

@hdo

hdo/index2.html

Created September 14, 2016 11:56
Show Gist options
  • Save hdo/fea3daa6f9810c12a996d4014ad82cc5 to your computer and use it in GitHub Desktop.
Save hdo/fea3daa6f9810c12a996d4014ad82cc5 to your computer and use it in GitHub Desktop.
Download ZIP
Test Dashboard
Raw
index2.html
<!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">
<meta name="description" content="">
<meta name="author" content="">
<title>SB Admin 2 - Bootstrap Admin Theme</title>
<!-- Bootstrap Core CSS -->
<link href="./static/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="./static/css/sb-admin-2.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="./static/bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div id="wrapper">
<div id="page-wrapper">
<div class="row">
<div class="col-lg-12">
<h2 class="page-header"></h2>
</div>
<!-- /.col-lg-12 -->
</div>
<div class="row">
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<div class="panel panel-red">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-windows fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge">1</div>
<div>Fenster EG</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<div class="panel panel-yellow">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-windows fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge">2</div>
<div>Fenster DG</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<div class="panel panel-green">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-lightbulb-o fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge">0 W</div>
<div>Strombezug</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<div class="panel panel-green">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-lightbulb-o fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge" id="text4">2456 W</div>
<div>PV Strom</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<div class="panel panel-primary">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-cloud fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge">19 °C</div>
<div>Außen</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<div class="panel panel-primary">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-trash fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge">5</div>
<div>Grau/Gelb</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<div class="panel panel-primary">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-windows fa-3x"></i>
</div>
<div class="col-xs-9 text-right">
<div id="textid0" class="huge">EG</div>
</div>
</div>
</div>
<div class="panel-body">
<div class="list-group">
<a href="#" class="list-group-item">
<span class="badge">10 min</span>
Wohnz Mitte
</a>
<a href="#" class="list-group-item">
<span class="badge">1 min</span>
Wohnz Rechts
</a>
<a href="#" class="list-group-item">
<span class="badge">123 min</span>
WC
</a>
</div>
</div>
</div>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<div class="panel panel-primary">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-windows fa-3x"></i>
</div>
<div class="col-xs-9 text-right">
<div id="textid0" class="huge">DG</div>
</div>
</div>
</div>
<div class="panel-body">
<div class="list-group">
<a href="#" class="list-group-item">
<span class="badge">10 min</span>
Schlafz Mitte
</a>
<a href="#" class="list-group-item">
<span class="badge">1 min</span>
Schlafz Rechts
</a>
<a href="#" class="list-group-item">
<span class="badge">123 min</span>
Bad
</a>
<a href="#" class="list-group-item">
<span class="badge">123 min</span>
Mailin Mitte
</a>
<a href="#" class="list-group-item">
<span class="badge">123 min</span>
Liem Mitte
</a>
</div>
</div>
</div>
</div>
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<div class="panel panel-primary">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-trash fa-3x"></i>
</div>
<div class="col-xs-9 text-right">
<div id="textid0" class="huge">Müll</div>
</div>
</div>
</div>
<div class="panel-body">
<div class="list-group">
<a href="#" class="list-group-item">
<span class="badge">5</span>
Grau
</a>
<a href="#" class="list-group-item">
<span class="badge">5</span>
Gelb
</a>
<a href="#" class="list-group-item">
<span class="badge">12</span>
Grün
</a>
<a href="#" class="list-group-item">
<span class="badge">7</span>
Braun
</a>
</div>
</div>
</div>
</div>
</div>
<!-- /.row -->
</div>
<!-- /#page-wrapper -->
</div>
<!-- /#wrapper -->
<!-- jQuery -->
<script src="./static/bower_components/jquery/dist/jquery.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="./static/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- Metis Menu Plugin JavaScript -->
<script src="./static/bower_components/metisMenu/dist/metisMenu.min.js"></script>
<!-- Custom Theme JavaScript -->
<script src="./static/js/sb-admin-2.js"></script>
<script type="text/javascript" charset="utf-8">
function myFunction() {
//console.log( "document loaded" );
alert('Hello');
};
function update_data() {
console.log("update ...");
$('#text4').text(Math.floor((Math.random() * 1000) + 1) + " W");
};
$(document).ready(function() {window.setInterval(update_data, 2000);});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment