interaktionsweise/hippie
1
1
Fork 0
Code Issues Pull requests Releases 3 Activity Actions

10 years later #1

Merged
sthag merged 374 commits from development into main 2026-03-07 00:18:59 +01:00
Conversation 0 Commits 374 Files changed 135 +18 -14
2 changed files with 18 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit 41c5757790 - Show all commits

30
source/screens/demo/layouts.njk
View file

@ -22,7 +22,7 @@ tags:
<p>Die Elemente werden fortlaufend komplexer</p>
</header>
<article>
<h2>Bereiche</h2>
<h2>Bereiche (sections)</h2>
<h3>section</h3>
<pre class="pre_code"><code>section.overflow>div.float_space_left>img^p+p>br+a.lineLink</code></pre>
<section class="overflow">
@ -30,12 +30,7 @@ tags:
<p>{{ ph.name() }}<br>{{ ph.address() }}</p>
<p>{{ ph.phone() }}<br>{{ ph.email('lineLink') }}</p>
</section>
<pre class="pre_code"><code>div.space_left_fourth>(hr+p+hr)</code></pre>
<div class="space_left_fourth">
<hr/>
<p>Eingerückter Inhalt</p>
<hr/>
</div>
<h3>nav</h3>
<pre class="pre_code"><code>div.overflow>(nav.float_space_left>ul>(li>a.a_button{punkt $})*4+nav>ul>(li>a.a_button_border{stufe $})*4)</code></pre>
<div class="overflow">
<nav class="float_space_left">
@ -107,6 +102,7 @@ tags:
</ul>
</nav>
</div>
<h3>header</h3>
<pre class="pre_code"><code>header.header_page>h1+p+nav.nav_separate_right>ul>(li>a.a_button{nav $})*4^+nav.nav_right>ul>(li>a.a_button{nav $})*4</code></pre>
<header class="header_page demo__header header_fancy">
<h1>Aufmacher</h1>
@ -175,6 +171,9 @@ tags:
</footer>
</div>
</div>
<h2>Interaktiv (interactive)</h2>
<h3>input</h3>
<div class="flex inline">
<input value="Undefiniert"/>
<input type="text" size="8" value="Text"/>
@ -182,10 +181,9 @@ tags:
<input type="button" value="Auswählen">
<input type="submit" value="Senden" disabled="disabled"/>
</div>
<h3>form</h3>
<form method="get">
<p class="label">
Show me a
<p>Show me a
<select name="F">
<option value="0">Plain list</option>
<option value="1" selected="selected">Fancy list</option>
@ -212,7 +210,7 @@ tags:
</p>
</form>
<h2>Gruppierung</h2>
<h2>Gruppierung (grouping)</h2>
<h3>p</h3>
<pre class="pre_code"><code>p.txt_right+p.txt_center+p.txt_left</code></pre>
<p class="txt_right">Rechts</p>
@ -230,14 +228,13 @@ tags:
<h1>Kann mehrmals, ohne großen Abstand oberhalb, untereinander stehen.</h1>
<h2>Überschrift 2</h2>
<h2>kann das ebenso.</h2>
<h3>hr</h3>
<pre class="pre_code"><code>hr.space_even_half</code></pre>
<hr class="space_even_half">
<pre class="pre_code"><code>hr.hr_dotted.space_even_fourth</code></pre>
<hr class="hr_dotted space_even_fourth">
<h3>ul</h3>
<pre class="pre_code"><code>ul.list_link>(li>a)+li>a>img+span</code></pre>
<pre class="pre_code"><code>nav>ul.list_link>(li>a)+li>a>img+span</code></pre>
<nav>
<ul class="list_link">
<li>{{ ph.email('', '📧 name@domain.tld') }}</li>
@ -246,6 +243,13 @@ tags:
</li>
</ul>
</nav>
<h3>div</h3>
<pre class="pre_code"><code>div.space_left_fourth>(hr+p+hr)</code></pre>
<div class="space_left_fourth">
<hr/>
<p>Eingerückter Inhalt</p>
<hr/>
</div>
<h2>Tabellen</h2>
<pre class="pre_code"><code>table.table_link>thead>tr>th{&amp;nbsp;}+th{ab / zy}+th{neu / alt}^^(tbody>tr>td.cell_icon[rowspan="2"]>img[width=16 height=16]^+td.cell_link>a[target=_blank]{name}+a[target=_blank]{url}^+td.cell_date[rowspan="2"]{yyy-mm-dd}^tr>td.cell_text>div.shorten{beschreibung})*2</code></pre>

2
source/style/hippie-style

@ -1 +1 @@
Subproject commit 54f1de579c3709db1f785997884a2e3e9861e0bc
Subproject commit cf8fc6bd5dcb24ad654ca6093e6e47520b8b0093