472 lines
21 KiB
HTML
472 lines
21 KiB
HTML
<!DOCTYPE html>
|
|
<head>
|
|
<title>Open Source Ecology (OSE) Germany - Entwicklungsplattform</title>
|
|
<link href="https://fonts.googleapis.com/css?family=Lora|Open+Sans:400,500,600,700,800,900" rel="stylesheet">
|
|
<link rel="stylesheet" href="style.css"/>
|
|
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
|
|
<script src="js/jquery-3.3.1.min.js"></script>
|
|
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
|
|
<script src="js/searchfield-focus-show-filter.js"></script>
|
|
<script src="js/img-svg-color.js"></script>
|
|
<script src="js/parallax.min.js"></script>
|
|
</head>
|
|
<body class="product-detail">
|
|
<div class="header">
|
|
<ul>
|
|
<li><a class="logo" href="/"><img src="img/oho-logo-header-imprint.png" width="47" height="25" /></a></li>
|
|
<li><a href="#">news</a></li>
|
|
<li><a href="#">about <i class="fas fa-caret-down"></i></a></li>
|
|
<li><a href="#">metadata repository <i class="fas fa-caret-down"></i></a></li>
|
|
<li><a href="#">list of platforms</a></li>
|
|
<li><a href="#">categories <i class="fas fa-caret-down"></i></a></li>
|
|
<li><a href="#">menupunkt <i class="fas fa-caret-down"></i></a></li>
|
|
</ul>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
<div class="searchbar">
|
|
<div class="col-1040">
|
|
<form>
|
|
<div class="searchfield">
|
|
<input type="text" name="search" placeholder="What Open Hardware are you looking for?" />
|
|
<button type="submit" value="Submit">
|
|
<i class="fa fa-search"></i>
|
|
</button>
|
|
</div>
|
|
<div class="search-filter-important">
|
|
<div class="clearer"> </div>
|
|
<select class="search-filter-licence">
|
|
<option value="licence">Licence</option>
|
|
<option value="cc-by-sa-1">CC-BY-SA-1</option>
|
|
<option value="cc-by-sa-2">CC-BY-SA-1</option>
|
|
<option value="cc-by-sa-3">CC-BY-SA-1</option>
|
|
<option value="cc-by-sa-4">CC-BY-SA-1</option>
|
|
</select>
|
|
<select class="search-filter-source">
|
|
<option value="licence">Source</option>
|
|
<option value="cc-by-sa-1">CC-BY-SA-1</option>
|
|
<option value="cc-by-sa-2">CC-BY-SA-1</option>
|
|
<option value="cc-by-sa-3">CC-BY-SA-1</option>
|
|
<option value="cc-by-sa-4">CC-BY-SA-1</option>
|
|
</select>
|
|
<select class="search-filter-language">
|
|
<option value="licence">Language</option>
|
|
<option value="cc-by-sa-1">CC-BY-SA-1</option>
|
|
<option value="cc-by-sa-2">CC-BY-SA-1</option>
|
|
<option value="cc-by-sa-3">CC-BY-SA-1</option>
|
|
<option value="cc-by-sa-4">CC-BY-SA-1</option>
|
|
</select>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<div class="row content">
|
|
<div class="col-1040">
|
|
<h1>Product title mechanical device</h1>
|
|
<div class="clearer"> </div>
|
|
<div class="col-2-3">
|
|
<img class="product-img" src="img/detail-page-example.jpg" />
|
|
<h2>Lorem ipsum dolor sit amet</h2>
|
|
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
|
|
</div>
|
|
<div class="col-1-3">
|
|
<table class="product-meta">
|
|
<tr>
|
|
<td colspan="2"><h3>Completeness of profile</h3></td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="2">
|
|
<div class="profile-completed">
|
|
<p>25%</p>
|
|
<div class="profile-completed-bar">
|
|
<span style="width:25%"></span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="2"><h3>OSH Lizenz</h3></th>
|
|
</tr>
|
|
<tr>
|
|
<td><img src="img/Icon-OSH.svg" width="20" /></td>
|
|
<td><a href="#">SSP-OSH2549</a></td>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="2"><h3>Norm Specification</h3></th>
|
|
</tr>
|
|
<tr>
|
|
<td><img src="img/Icon-DIN.svg" width="20" /></td>
|
|
<td><a href="#">DIN-SPEC Standard T302</a></td>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="2"><h3>Sources</h3></th>
|
|
</tr>
|
|
<tr>
|
|
<td><i class="fas fa-book-open"></i></td>
|
|
<td>
|
|
<ul>
|
|
<li><a href="#">Link to maker's website</a></li>
|
|
<li><a href="#">Original documents</a></li>
|
|
<li><a href="#">consetetur sadipscing elitr</a></li>
|
|
<li><a href="#">magna aliquyam erat</a></li>
|
|
<li><a href="#">sed diam voluptua</a></li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="2"><h3>Missing Infos</h3></th>
|
|
</tr>
|
|
<tr>
|
|
<td> </td>
|
|
<td><a href="#">Sources</a>, <a href="#">Norm Specifications</a></td>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="2"><h3>Status of Product Circle</h3></th>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="2" style="text-align:center;">
|
|
<svg height="240" width="240">
|
|
<circle cx="120" cy="120" r="80" stroke="#296178" stroke-width="48" fill="#fef0e4" />
|
|
</svg>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="2"><h3>User Rating</h3></th>
|
|
</tr>
|
|
<tr>
|
|
<td> </td>
|
|
<td><a href="#">Sources</a>, <a href="#">Norm Specifications</a></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
<div class="row last-results">
|
|
<div class="col-1040">
|
|
<h1>Last Search Results</h1>
|
|
<div class="search-results-grid">
|
|
<div class="col-1-4">
|
|
<div class="search-results-item">
|
|
<div class="search-results-item-img">
|
|
<a href="detail.html"><img src="img/thumb01.jpg" /></a>
|
|
</div>
|
|
<div class="search-results-item-info">
|
|
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
|
|
<p class="search-results-item-description">Lorem ipsum dolor sit amet, consetetur saidispscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore a magna aliquyam ...</p>
|
|
</div>
|
|
<div class="search-results-item-meta">
|
|
<div class="search-results-item-meta-status">
|
|
<p>Status</p>
|
|
<svg height="30" width="30">
|
|
<circle cx="15" cy="15" r="10" stroke="#296178" stroke-width="6" fill="#fff" />
|
|
</svg>
|
|
</div>
|
|
<div class="search-results-item-meta-compl">
|
|
<p>Completeness</p>
|
|
<div class="search-results-item-meta-compl-bar">
|
|
<span style="width:25%"></span>
|
|
</div>
|
|
</div>
|
|
<ul>
|
|
<li class="lang"><i class="fas fa-language"></i> DE,EN</li>
|
|
<li class="cert"><img class="svg" src="img/Icon-OSH.svg" width="16" /></li>
|
|
<li class="din"><img class="svg" style="margin-top:-2px;" src="img/Icon-DIN.svg" width="20" /></li>
|
|
<li class="doc"><i class="fas fa-book-open"></i></li>
|
|
</ul>
|
|
<div class="clearer"> </div>
|
|
<div class="search-results-item-meta-date">
|
|
<span class="updated">Updated: 03/27/19</span>
|
|
<span class="released">Released: 04/12/15</span>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-1-4">
|
|
<div class="search-results-item">
|
|
<div class="search-results-item-img">
|
|
<a href="detail.html"><img src="img/thumb02.jpg" /></a>
|
|
</div>
|
|
<div class="search-results-item-info">
|
|
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
|
|
<p class="search-results-item-description">Lorem ipsum dolor sit amet, consetetur saidispscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore a magna aliquyam ...</p>
|
|
</div>
|
|
<div class="search-results-item-meta">
|
|
<div class="search-results-item-meta-status">
|
|
<p>Status</p>
|
|
<svg height="30" width="30">
|
|
<circle cx="15" cy="15" r="10" stroke="#296178" stroke-width="6" fill="#fff" />
|
|
</svg>
|
|
</div>
|
|
<div class="search-results-item-meta-compl">
|
|
<p>Completeness</p>
|
|
<div class="search-results-item-meta-compl-bar">
|
|
<span style="width:25%"></span>
|
|
</div>
|
|
</div>
|
|
<ul>
|
|
<li class="lang"><i class="fas fa-language"></i> DE,EN</li>
|
|
<li class="cert"><img class="svg" src="img/Icon-OSH.svg" width="16" /></li>
|
|
<li class="din"><img class="svg" style="margin-top:-2px;" src="img/Icon-DIN.svg" width="20" /></li>
|
|
<li class="doc"><i class="fas fa-book-open"></i></li>
|
|
</ul>
|
|
<div class="clearer"> </div>
|
|
<div class="search-results-item-meta-date">
|
|
<span class="updated">Updated: 03/27/19</span>
|
|
<span class="released">Released: 04/12/15</span>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-1-4">
|
|
<div class="search-results-item">
|
|
<div class="search-results-item-img">
|
|
<a href="detail.html"><img src="img/thumb03.jpg" /></a>
|
|
</div>
|
|
<div class="search-results-item-info">
|
|
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
|
|
<p class="search-results-item-description">Lorem ipsum dolor sit amet, consetetur saidispscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore a magna aliquyam ...</p>
|
|
</div>
|
|
<div class="search-results-item-meta">
|
|
<div class="search-results-item-meta-status">
|
|
<p>Status</p>
|
|
<svg height="30" width="30">
|
|
<circle cx="15" cy="15" r="10" stroke="#296178" stroke-width="6" fill="#fff" />
|
|
</svg>
|
|
</div>
|
|
<div class="search-results-item-meta-compl">
|
|
<p>Completeness</p>
|
|
<div class="search-results-item-meta-compl-bar">
|
|
<span style="width:25%"></span>
|
|
</div>
|
|
</div>
|
|
<ul>
|
|
<li class="lang"><i class="fas fa-language"></i> DE,EN</li>
|
|
<li class="cert"><img class="svg" src="img/Icon-OSH.svg" width="16" /></li>
|
|
<li class="din"><img class="svg" style="margin-top:-2px;" src="img/Icon-DIN.svg" width="20" /></li>
|
|
<li class="doc"><i class="fas fa-book-open"></i></li>
|
|
</ul>
|
|
<div class="clearer"> </div>
|
|
<div class="search-results-item-meta-date">
|
|
<span class="updated">Updated: 03/27/19</span>
|
|
<span class="released">Released: 04/12/15</span>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-1-4">
|
|
<div class="search-results-item">
|
|
<div class="search-results-item-img">
|
|
<a href="detail.html"><img src="img/thumb04.jpg" /></a>
|
|
</div>
|
|
<div class="search-results-item-info">
|
|
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
|
|
<p class="search-results-item-description">Lorem ipsum dolor sit amet, consetetur saidispscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore a magna aliquyam ...</p>
|
|
</div>
|
|
<div class="search-results-item-meta">
|
|
<div class="search-results-item-meta-status">
|
|
<p>Status</p>
|
|
<svg height="30" width="30">
|
|
<circle cx="15" cy="15" r="10" stroke="#296178" stroke-width="6" fill="#fff" />
|
|
</svg>
|
|
</div>
|
|
<div class="search-results-item-meta-compl">
|
|
<p>Completeness</p>
|
|
<div class="search-results-item-meta-compl-bar">
|
|
<span style="width:25%"></span>
|
|
</div>
|
|
</div>
|
|
<ul>
|
|
<li class="lang"><i class="fas fa-language"></i> DE,EN</li>
|
|
<li class="cert"><img class="svg" src="img/Icon-OSH.svg" width="16" /></li>
|
|
<li class="din"><img class="svg" style="margin-top:-2px;" src="img/Icon-DIN.svg" width="20" /></li>
|
|
<li class="doc"><i class="fas fa-book-open"></i></li>
|
|
</ul>
|
|
<div class="clearer"> </div>
|
|
<div class="search-results-item-meta-date">
|
|
<span class="updated">Updated: 03/27/19</span>
|
|
<span class="released">Released: 04/12/15</span>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-1-4">
|
|
<div class="search-results-item">
|
|
<div class="search-results-item-img">
|
|
<a href="detail.html"><img src="img/thumb05.jpg" /></a>
|
|
</div>
|
|
<div class="search-results-item-info">
|
|
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
|
|
<p class="search-results-item-description">Lorem ipsum dolor sit amet, consetetur saidispscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore a magna aliquyam ...</p>
|
|
</div>
|
|
<div class="search-results-item-meta">
|
|
<div class="search-results-item-meta-status">
|
|
<p>Status</p>
|
|
<svg height="30" width="30">
|
|
<circle cx="15" cy="15" r="10" stroke="#296178" stroke-width="6" fill="#fff" />
|
|
</svg>
|
|
</div>
|
|
<div class="search-results-item-meta-compl">
|
|
<p>Completeness</p>
|
|
<div class="search-results-item-meta-compl-bar">
|
|
<span style="width:25%"></span>
|
|
</div>
|
|
</div>
|
|
<ul>
|
|
<li class="lang"><i class="fas fa-language"></i> DE,EN</li>
|
|
<li class="cert"><img class="svg" src="img/Icon-OSH.svg" width="16" /></li>
|
|
<li class="din"><img class="svg" style="margin-top:-2px;" src="img/Icon-DIN.svg" width="20" /></li>
|
|
<li class="doc"><i class="fas fa-book-open"></i></li>
|
|
</ul>
|
|
<div class="clearer"> </div>
|
|
<div class="search-results-item-meta-date">
|
|
<span class="updated">Updated: 03/27/19</span>
|
|
<span class="released">Released: 04/12/15</span>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-1-4">
|
|
<div class="search-results-item">
|
|
<div class="search-results-item-img">
|
|
<a href="detail.html"><img src="img/thumb06.jpg" /></a>
|
|
</div>
|
|
<div class="search-results-item-info">
|
|
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
|
|
<p class="search-results-item-description">Lorem ipsum dolor sit amet, consetetur saidispscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore a magna aliquyam ...</p>
|
|
</div>
|
|
<div class="search-results-item-meta">
|
|
<div class="search-results-item-meta-status">
|
|
<p>Status</p>
|
|
<svg height="30" width="30">
|
|
<circle cx="15" cy="15" r="10" stroke="#296178" stroke-width="6" fill="#fff" />
|
|
</svg>
|
|
</div>
|
|
<div class="search-results-item-meta-compl">
|
|
<p>Completeness</p>
|
|
<div class="search-results-item-meta-compl-bar">
|
|
<span style="width:25%"></span>
|
|
</div>
|
|
</div>
|
|
<ul>
|
|
<li class="lang"><i class="fas fa-language"></i> DE,EN</li>
|
|
<li class="cert"><img class="svg" src="img/Icon-OSH.svg" width="16" /></li>
|
|
<li class="din"><img class="svg" style="margin-top:-2px;" src="img/Icon-DIN.svg" width="20" /></li>
|
|
<li class="doc"><i class="fas fa-book-open"></i></li>
|
|
</ul>
|
|
<div class="clearer"> </div>
|
|
<div class="search-results-item-meta-date">
|
|
<span class="updated">Updated: 03/27/19</span>
|
|
<span class="released">Released: 04/12/15</span>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-1-4">
|
|
<div class="search-results-item">
|
|
<div class="search-results-item-img">
|
|
<a href="detail.html"><img src="img/thumb07.jpg" /></a>
|
|
</div>
|
|
<div class="search-results-item-info">
|
|
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
|
|
<p class="search-results-item-description">Lorem ipsum dolor sit amet, consetetur saidispscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore a magna aliquyam ...</p>
|
|
</div>
|
|
<div class="search-results-item-meta">
|
|
<div class="search-results-item-meta-status">
|
|
<p>Status</p>
|
|
<svg height="30" width="30">
|
|
<circle cx="15" cy="15" r="10" stroke="#296178" stroke-width="6" fill="#fff" />
|
|
</svg>
|
|
</div>
|
|
<div class="search-results-item-meta-compl">
|
|
<p>Completeness</p>
|
|
<div class="search-results-item-meta-compl-bar">
|
|
<span style="width:25%"></span>
|
|
</div>
|
|
</div>
|
|
<ul>
|
|
<li class="lang"><i class="fas fa-language"></i> DE,EN</li>
|
|
<li class="cert"><img class="svg" src="img/Icon-OSH.svg" width="16" /></li>
|
|
<li class="din"><img class="svg" style="margin-top:-2px;" src="img/Icon-DIN.svg" width="20" /></li>
|
|
<li class="doc"><i class="fas fa-book-open"></i></li>
|
|
</ul>
|
|
<div class="clearer"> </div>
|
|
<div class="search-results-item-meta-date">
|
|
<span class="updated">Updated: 03/27/19</span>
|
|
<span class="released">Released: 04/12/15</span>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
<div class="footer" data-parallax="scroll" data-image-src="img/backgroun03.jpg">
|
|
<div class="col-1040">
|
|
<div class="col-1-5">
|
|
<h3>Categories</h3>
|
|
<ul>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-1-5">
|
|
<h3>Categories</h3>
|
|
<ul>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-1-5">
|
|
<h3>Categories</h3>
|
|
<ul>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-1-5">
|
|
<h3>Categories</h3>
|
|
<ul>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-1-5">
|
|
<h3>Categories</h3>
|
|
<ul>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
<li><a href="#">sit amet</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="clearer"> </div>
|
|
</div>
|
|
</div>
|
|
<div class="imprint">
|
|
<p><img src="img/oho-logo-header-imprint.png" width="36" height="19" /> CC 2019 open hardware observatory | <a href="#">imprint</a> | <a href="#">legal</a></p>
|
|
</div>
|
|
</body>
|
|
</html>
|