156 lines
4.6 KiB
HTML
156 lines
4.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
|
|
<title>HIPPIE Explorer Demo</title>
|
|
|
|
<meta name="author" content="Interaktionsweise">
|
|
<meta name="description" content="hippie example">
|
|
<meta name="generator" content="Notepad++, Atom">
|
|
<meta name="robots" content="noindex">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
|
|
<!-- <link href='https://fonts.googleapis.com/css?family=Roboto:400,300,400italic,500,500italic,700' rel='stylesheet' type='text/css'>-->
|
|
<link rel="stylesheet" type="text/css" media="all" href="./example.css"/>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="box__page">
|
|
<div class="flex__wrap">
|
|
<button class="demo__button_32"></button>
|
|
<button class="demo__button_32"></button>
|
|
<button class="demo__button_32"></button>
|
|
<button class="demo__button_32"></button>
|
|
<button class="demo__button_32"></button>
|
|
<button class="demo__button_32"></button>
|
|
</div>
|
|
<div class="flex">
|
|
<div class="flex__child">
|
|
<!-- (nav>ul.list__data>(li>a>img+p{Punkt $})*6)*2 -->
|
|
<nav>
|
|
<ul class="list__files">
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 1</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 2</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 3</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 4</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 5</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 6</p>
|
|
</a></li>
|
|
</ul>
|
|
</nav>
|
|
<nav>
|
|
<ul class="list__files">
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 1</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 2</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 3</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 4</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 5</p>
|
|
</a></li>
|
|
<li><a href="">
|
|
<img src="" alt="">
|
|
<p>Punkt 6</p>
|
|
</a></li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
<div class="flex__child_one flex__row">
|
|
<!-- div.flex__child.box__file_wrp>(div.box__file_tile>img[src="./art/icon_default.svg"]^+p{Dateiname $}+p{Auszeichnung $})*4^+div.flex__child>table.table__file_simple>(tr>td>img^+td{Objektname $}+td.cell__file_path{Objektpfad $})*2 -->
|
|
<div class="flex__child box__file_wrp">
|
|
<div class="flex__wrap box__file_tile">
|
|
<div class="flex__child"><img src="./art/icon_default.svg" alt=""></div>
|
|
<div class="box__flex_one">
|
|
<p>Dateiname 1</p>
|
|
<p>Auszeichnung 1</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex__wrap box__file_tile">
|
|
<div class="flex__child"><img src="./art/icon_default.svg" alt=""></div>
|
|
<div class="box__flex_one">
|
|
<p>Dateiname 2</p>
|
|
<p>Auszeichnung 2</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex__wrap box__file_tile">
|
|
<div class="flex__child"><img src="./art/icon_default.svg" alt=""></div>
|
|
<div class="box__flex_one">
|
|
<p>Dateiname 3</p>
|
|
<p>Auszeichnung 3</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex__wrap box__file_tile">
|
|
<div class="flex__child"><img src="./art/icon_default.svg" alt=""></div>
|
|
<div class="box__flex_one">
|
|
<p>Dateiname 4</p>
|
|
<p>Auszeichnung 4</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex__child_one">
|
|
<table class="table__file_simple">
|
|
<tr>
|
|
<td><img src="" alt=""></td>
|
|
<td>Objektname 1</td>
|
|
<td class="cell__file_path">Objektpfad 1</td>
|
|
</tr>
|
|
<tr>
|
|
<td><img src="" alt=""></td>
|
|
<td>Objektname 2</td>
|
|
<td class="cell__file_path">Objektpfad 2</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<div class="flex__child">
|
|
<p>Status</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script
|
|
src="https://code.jquery.com/jquery-3.2.1.min.js"
|
|
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
|
|
crossorigin="anonymous"></script>
|
|
<script src="./code/vendor/jq-sticky-anything.min.js" type="text/javascript"></script>
|
|
<script src="./code/variables.js" type="text/javascript"></script>
|
|
<script src="./code/functions.js" type="text/javascript"></script>
|
|
<script src="./code/global.js" type="text/javascript"></script>
|
|
<script type="text/javascript">
|
|
// Page specific
|
|
// ------------------------------------------------------------------------------
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|