Commit 24d20a791763a3a1210531f530a6ce847669e0d8

Authored by Rémi Emonet
1 parent 9ac948f81d
Exists in master

uni style

Showing 1 changed file with 45 additions and 30 deletions

... ... @@ -4,25 +4,37 @@
4 4 <meta name="year" content="2016"/>
5 5 <meta content="text/html; charset=UTF-8" http-equiv="content-type"/>
6 6 <style type="text/css">
7   - html, body {margin:0; padding:0;}
8   - html {text-align: center; background: white; font-family: Arial;}
9   - h1,h2,h3,a {margin: 6px 0;}
10   - h1,h2,h3 {clear: both;}
11   - body {width: 800px;}
12   - h1,h2 {width:760px; padding: 20px;}
13   - body {display: inline-block;}
14   - h1 {color: gray; margin-bottom: 2em;}
15   - h2 {color: white; background: black; margin:0; margin-top: 120px;}
16   - a {display:inline-block; width: 160px; padding: 15px; vertical-align: top; margin-left: 6px; text-align: center;}
17   - body>div {text-align: left;}
18   - a:nth-child(4n+1) {margin-left:0;}
19   - a {background: rgb(225, 73, 56); color: white; text-decoration: none; font-weight: bold;}
20   - a.proj {min-height: 65px;}
21   - a:hover {background: rgb(255, 127, 0);}
22   - .outlined {outline: 1px solid black;}
23   - .vil {
24   - outline: 2px solid black;
25   - }
  7 + html, body {margin:0; padding:0;}
  8 + html {text-align: center; background: white; font-family: Arial;}
  9 + h1,h2,h3,a {margin: 6px 0;}
  10 + h1,h2,h3 {clear: both;}
  11 + body {width: 800px;}
  12 + h1,h2 {box-sizing: border-box; width:800px; padding: 20px 0;}
  13 + body {display: inline-block;}
  14 + h1 {color: gray; margin-bottom: 2em;}
  15 + h2 {color: white; background: black; margin:0; margin-top: 120px;}
  16 + body>div {text-align: left;}
  17 + body>div>* {text-align: center; vertical-align: middle;}
  18 +
  19 +
  20 + .tile {margin-top: 5px; min-height: 2.3em;}
  21 + .tile>a {flex: 1 1 auto; }
  22 + .tile>a {margin: 2px; }
  23 + a[href$=".pdf"] { box-shadow: black 2px 2px 2px; }
  24 + a[href$=".zip"] { box-shadow: darkred 2px 2px 2px; }
  25 + a, .tile {background: rgb(225, 73, 56); color: white; text-decoration: none; font-weight: bold;}
  26 +
  27 + .tile {display:inline-flex; box-sizing: border-box; width: 194px; padding: 15px; margin-bottom: 7px;}
  28 + a.tile {display: inline-block;}
  29 + .tile {margin-left: 4px; }
  30 + .tile:nth-child(4n+1) {margin-left:0;}
  31 + .tile.proj {min-height: 65px;}
  32 + .tile:hover {background: rgb(255, 127, 0);}
  33 + .outlined {outline: 1px solid black;}
  34 + .vil {
  35 + outline: 2px solid black;
  36 + }
  37 +
26 38 </style>
27 39 </head>
28 40  
29 41  
... ... @@ -30,15 +42,18 @@
30 42 <h1><span class="var-title"></span></h1>
31 43 <h2>Slides et Cours</h2>
32 44 <div>
33   - <a class="outlined" href="more-aide-transparents.html">Voir les slides?</a>
34   - <a href="cours-01.html">Slides 1 <br/> introduction</a>
35   - <a href="cours-02.html">Slides 2 <br/> HTML+CSS</a>
36   - <a href="cours-03.html" style="font-size:80%;">Slides 3 <br/> MVC, Spring+Thymeleaf</a>
37   - <a href="cours-04.html">Slides 4 <br/> Projet, TP1</a>
38   - <a href="cours-05.html">Slides 5 <br/> Thymeleaf, DI</a>
  45 + <a class="outlined tile" href="more-aide-transparents.html">Voir les slides?</a>
  46 + <a class="tile" href="cours-01.html">Slides 1 <br/> introduction</a>
  47 + <a class="tile" href="cours-02.html">Slides 2 <br/> HTML+CSS</a>
  48 + <a class="tile" href="cours-03.html" style="font-size:80%;">Slides 3 <br/> MVC, Spring+Thymeleaf</a>
  49 + <a class="tile" href="cours-04.html">Slides 4 <br/> Projet, TP1</a>
  50 + <a class="tile" href="cours-05.html">Slides 5 <br/> Thymeleaf, DI</a>
  51 + </div>
39 52  
40 53 <h2>Code des séances</h2>
41   - <a data-code-date="09-13"></a>
  54 + <div>
  55 + <a class="tile" data-code-date="09-13"></a>
  56 + </div>
42 57 <!--
43 58 <a href="raw/cours-2.zip">Fichiers HTML et CSS du cours</a>
44 59 <a href="cours-03.html">Slides 3 <br/> Spring+Thymeleaf</a>
45 60  
... ... @@ -65,11 +80,11 @@
65 80 </div>
66 81 <h2>Other Resources</h2>
67 82 <div>
68   - <a href="tp1.pdf">TP 1 (HTML+CSS) <br/>Sujet</a>
69   - <a href="raw/tp1-base.txt">Le fichier <br/>du TP1</a>
70   - <a href="raw/test.mp4">A test video to download¹</a>
  83 + <a class="tile" href="tp1.pdf">TP 1 (HTML+CSS) <br/>Sujet</a>
  84 + <a class="tile" href="raw/tp1-base.txt">Le fichier <br/>du TP1</a>
  85 + <a class="tile" href="raw/test.mp4">A test video to download¹</a>
71 86  
72   - <a href="more-installation.html">Installation <br/>sur votre laptop</a>
  87 + <a class="tile" href="more-installation.html">Installation <br/>sur votre laptop</a>
73 88 <!--
74 89 <a href="tp2.pdf">TP 2 (SPRING) <br/>Sujet</a>
75 90 <a href="tp3.pdf">TP 3 (REST+React) <br/>Sujet</a>