Commit 24d20a791763a3a1210531f530a6ce847669e0d8
1 parent
9ac948f81d
Exists in
master
uni style
Showing 1 changed file with 45 additions and 30 deletions
index.html
View file @
24d20a7
... | ... | @@ -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> |