Mercurial > sat_docs
view printable_cards/xhtml/souliane.html @ 131:8b4c3ff88985
screenshort (0.7): added file language filtering animation
author | Goffi <goffi@goffi.org> |
---|---|
date | Thu, 05 Jul 2018 14:24:20 +0200 |
parents | 2b82a4eb40a6 |
children |
line wrap: on
line source
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta name="author" content="Adrien Cossa" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="cmc/stylesheet.css" type="text/css" charset="utf-8" media="all" /> <style type="text/css"> body { background-color: #fffbe7; margin: 0px; } div.page { display: inline-block; background-color: white; width: 21cm; height: 29.7cm; } div.printable-area { display: flex; flex-wrap: wrap; margin-left: 0.5cm; margin-top: 1.35cm; } div.card { width: 8.5cm; height: 5.4cm; box-shadow: 0px 0px 5px 0px black; background-color: white; font-family: 'CMUConcreteRoman'; font-weight: normal; font-style: normal; font-size: 0.36cm; margin-top: 0cm; margin-left: 1cm; } div.spacer { height: 0.3cm; } div.main { margin: 0.5cm 0.8cm 0.5cm 0.8cm; } div.header { display: flex; justify-content: space-around; align-items: center; } div.title { font-size: 0.8cm; #font-style: italic; text-shadow: 1px 1px 1px grey; } div.abstract { font-size: 0.3cm; font-style: italic; text-shadow: 1px 1px 1px grey; text-align: center; } div.photo img { width: 2.0cm; } div.columns { display: flex; justify-content: space-between; } div.sides { display: flex; flex-direction: column; justify-content: space-around; } div.sides img { width: 0.6cm; } div.central { text-align: center; } div.name { font-weight: bold; text-align: center; } a:link{ color: black; text-decoration: none; } a:visited{ color: black; text-decoration: none; } @page { size: A4; margin: 0; } @media print { div.page { margin: 0px; } } </style> </head> <body onload="javascript:duplicate();"> <script type="text/javascript"> function duplicate() { var div = document.getElementsByClassName("card")[0]; for (var i=0; i<9; ++i) { clone = div.cloneNode(true); div.parentElement.appendChild(clone); }; }; </script> <div class="page"> <div class="printable-area"> <div class="card"> <div class="main"> <div class="header"> <div> <div class="spacer"></div> <div class="name">Adrien</div> <div><a href="mailto:souliane@mailoo.org">souliane@mailoo.org</a></div> </div> <div class="photo"> <img src="sat.svg" alt="image"/> </div> </div> <div class="spacer"></div> <div class="central"> <div class="spacer"></div> <div class="title">Salut à Toi</div> <div><a href="http://salut-a-toi.org">http://salut-a-toi.org</a></div> </div> </div> </div> </div> </div> </body> </html>