picto and deco class

master
km0 3 years ago
parent 241058b44f
commit d9ee2a78bd

@ -10,7 +10,14 @@
<script src="sticker.js" defer></script>
</head>
<body>
<div id="sticker-container"></div>
<div id="sticker-container">
<li
class="sticker info"
style="left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(5deg)"
>
Tap anywhere to start
</li>
</div>
<ul class="informations-list" id="information-list">
<li class="info bold">Learning How To Walk While Catwalking</li>
@ -18,26 +25,26 @@
<li class="info bold">XPUB1</li>
<li class="info bold">Special Issue 16</li>
<li class="info bold">Vernacular language processing</li>
<li class="deco"><img src="./static/svg/home.svg" /></li>
<li class="picto"><img src="./static/svg/home.svg" /></li>
<li class="info">Welcome</li>
<li class="info">Dear friend</li>
<li class="info">Online scroller</li>
<li class="info">Be confident</li>
<li class="info">Be ambitious</li>
<li class="info">Be ready to fail a lot</li>
<li class="deco"><img src="./static/svg/etc.svg" /></li>
<li class="picto"><img src="./static/svg/etc.svg" /></li>
<li class="info">Toolkit</li>
<li class="info">Tools</li>
<li class="info">Vernacular toolkit</li>
<li class="info">Try-out online</li>
<li class="deco"><img src="./static/svg/map.svg" /></li>
<li class="picto"><img src="./static/svg/map.svg" /></li>
<li class="info">Language</li>
<li class="info">Tags</li>
<li class="deco"><img src="./static/svg/function.svg" /></li>
<li class="picto"><img src="./static/svg/function.svg" /></li>
<li class="info">Legitimize failures</li>
<li class="info">Amatorial practices</li>
<li class="info">Vernacular understanding</li>
<li class="deco"><img src="./static/svg/rep.svg" /></li>
<li class="picto"><img src="./static/svg/rep.svg" /></li>
<li class="info">API</li>
<li class="info">Critical API</li>
<li class="info">Vernacular API</li>

@ -67,11 +67,18 @@ body {
display: none;
}
.sticker.deco {
.sticker.picto {
background-color: white;
min-width: 64px;
min-height: 64px;
padding: 8px;
}
.sticker.deco {
background: none;
min-width: 48px;
min-height: 48px;
padding: 16px;
padding: 0;
}
li {

Loading…
Cancel
Save