145 lines
5.1 KiB
HTML
145 lines
5.1 KiB
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">
|
|
<link rel="stylesheet" href="//cdn.linearicons.com/free/1.0.0/icon-font.min.css">
|
|
<link href="//cdn.muicss.com/mui-0.4.6/css/mui.min.css" rel="stylesheet" type="text/css" />
|
|
<!-- build:css -->
|
|
|
|
|
|
<!-- endbuild -->
|
|
<script src="libs/microevent.js"></script>
|
|
<script src="//cdn.muicss.com/mui-0.4.6/js/mui.min.js"></script>
|
|
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
|
|
<!-- build:vendor -->
|
|
<script src="libs/ejs.js"></script>
|
|
<script src="libs/view.js"></script>
|
|
<!-- endbuild -->
|
|
|
|
<link rel="apple-touch-icon" sizes="57x57" href="fav/apple-touch-icon-57x57.png">
|
|
<link rel="apple-touch-icon" sizes="60x60" href="fav/apple-touch-icon-60x60.png">
|
|
<link rel="apple-touch-icon" sizes="72x72" href="fav/apple-touch-icon-72x72.png">
|
|
<link rel="apple-touch-icon" sizes="76x76" href="fav/apple-touch-icon-76x76.png">
|
|
<link rel="apple-touch-icon" sizes="114x114" href="fav/apple-touch-icon-114x114.png">
|
|
<link rel="apple-touch-icon" sizes="120x120" href="fav/apple-touch-icon-120x120.png">
|
|
<link rel="apple-touch-icon" sizes="144x144" href="fav/apple-touch-icon-144x144.png">
|
|
<link rel="apple-touch-icon" sizes="152x152" href="fav/apple-touch-icon-152x152.png">
|
|
<link rel="apple-touch-icon" sizes="180x180" href="fav/apple-touch-icon-180x180.png">
|
|
<link rel="icon" type="image/png" href="fav/favicon-32x32.png" sizes="32x32">
|
|
<link rel="icon" type="image/png" href="fav/favicon-194x194.png" sizes="194x194">
|
|
<link rel="icon" type="image/png" href="fav/favicon-96x96.png" sizes="96x96">
|
|
<link rel="icon" type="image/png" href="fav/android-chrome-192x192.png" sizes="192x192">
|
|
<link rel="icon" type="image/png" href="fav/favicon-16x16.png" sizes="16x16">
|
|
<link rel="manifest" href="fav/manifest.json">
|
|
<link rel="mask-icon" href="fav/safari-pinned-tab.svg" color="#5bbad5">
|
|
<meta name="msapplication-TileColor" content="#ffc40d">
|
|
<meta name="msapplication-TileImage" content="fav/mstile-144x144.png">
|
|
<meta name="theme-color" content="#ffc40d">
|
|
<title>Keeper Silvtree</title>
|
|
<style>
|
|
.item_content {
|
|
height:80px;
|
|
border:1px solid grey;
|
|
display:block;
|
|
height:auto;
|
|
max-width:74em;
|
|
margin-left:auto;
|
|
margin-right:auto;
|
|
min-height:80px;
|
|
overflow:hidden;
|
|
position:relative;
|
|
padding:0;
|
|
|
|
}
|
|
|
|
.item_content .thumbnail {
|
|
position:absolute;
|
|
left:0;
|
|
top:0;
|
|
|
|
width:100px; height:80px;background-size: cover, auto;background-position:50% 50%, 50% 50%;
|
|
}
|
|
|
|
.item_content a.title {
|
|
padding:1em 11em 0.1em 7.35em;
|
|
font-size: 1.38em;
|
|
overflow:hidden;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap;
|
|
|
|
display:block;
|
|
color:#313131;
|
|
font-weight:600;
|
|
line-height: 1.2;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="content" class="mui-container">
|
|
<div class="mui-row">
|
|
<p>Image is 100 x 80</p>
|
|
<ul>
|
|
<li>
|
|
<div class="item_content">
|
|
<a href="link" class="title">I am the title</a>
|
|
<span class='thumbnail' style="background-image:url('http://image.silvrtree.co.uk/100x80/http://pipes.silvrtree.co.uk/assets/fm.png');"></span>
|
|
<ul><li>I'm tags</li></ul>
|
|
<ul><li>I'm buttons</li></ul>
|
|
</div>
|
|
|
|
</li>
|
|
<li>
|
|
<div class="item_content">
|
|
<a href="link" class="title">I am the title</a>
|
|
<span class='thumbnail' style="background-image:url('http://image.silvrtree.co.uk/100x80/http://pipes.silvrtree.co.uk/assets/fm.png');"></span>
|
|
<ul><li>I'm tags</li></ul>
|
|
<ul><li>I'm buttons</li></ul>
|
|
</div>
|
|
|
|
</li>
|
|
<li>
|
|
<div class="item_content">
|
|
<a href="link" class="title">I am the title</a>
|
|
<span class='thumbnail' style="background-image:url('http://image.silvrtree.co.uk/100x80/http://pipes.silvrtree.co.uk/assets/fm.png');"></span>
|
|
<ul><li>I'm tags</li></ul>
|
|
<ul><li>I'm buttons</li></ul>
|
|
</div>
|
|
|
|
</li>
|
|
<li>
|
|
<div class="item_content">
|
|
<a href="link" class="title">I am the title</a>
|
|
<span class='thumbnail' style="background-image:url('http://image.silvrtree.co.uk/100x80/http://pipes.silvrtree.co.uk/assets/fm.png');"></span>
|
|
<ul><li>I'm tags</li></ul>
|
|
<ul><li>I'm buttons</li></ul>
|
|
</div>
|
|
|
|
</li>
|
|
<li>
|
|
<div class="item_content">
|
|
<a href="link" class="title">I am the title</a>
|
|
<span class='thumbnail' style="background-image:url('http://image.silvrtree.co.uk/100x80/http://pipes.silvrtree.co.uk/assets/fm.png');"></span>
|
|
<ul><li>I'm tags</li></ul>
|
|
<ul><li>I'm buttons</li></ul>
|
|
</div>
|
|
|
|
</li>
|
|
<li>
|
|
<div class="item_content">
|
|
<a href="link" class="title">I am the title</a>
|
|
<span class='thumbnail' style="background-image:url('http://image.silvrtree.co.uk/100x80/http://pipes.silvrtree.co.uk/assets/fm.png');"></span>
|
|
<ul><li>I'm tags</li></ul>
|
|
<ul><li>I'm buttons</li></ul>
|
|
</div>
|
|
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|