Browse Source

Centrage des elements, pas la meilleure solution.

Outi Munter 10 years ago
parent
commit
bafaceef04
3 changed files with 46 additions and 4 deletions
  1. 19 1
      css/theme/osi.css
  2. 19 0
      css/theme/source/osi.scss
  3. 8 3
      index.html

+ 19 - 1
css/theme/osi.css

@@ -562,10 +562,26 @@ p.caption {
 #page.main {
   font-family: 'lato', sans-serif;
   font-size: 1.4em;
+  height: 100%;
   line-height: 1.2;
   margin-left: auto;
   margin-right: auto;
-  max-width: 960px; }
+  max-width: 960px;
+  position: relative;
+  text-align: center; }
+  #page.main div.content-wrapper {
+    bottom: 0;
+    left: 0;
+    margin: auto;
+    max-height: 80%;
+    max-width: 80%;
+    min-height: 20%;
+    min-width: 20%;
+    overflow: auto;
+    position: absolute;
+    right: 0;
+    resize: both;
+    top: 0; }
   #page.main a {
     color: #ff8a00;
     text-decoration: none;
@@ -579,8 +595,10 @@ p.caption {
   #page.main h1, #page.main h2, #page.main h3 {
     color: #647a8e;
     font-family: "League Gothic", Impact, sans-serif;
+    margin-bottom: 20px;
     text-transform: uppercase; }
   #page.main #header {
+    padding-bottom: 15px;
     padding-top: 10px; }
   #page.main #footer {
     bottom: 0;

+ 19 - 0
css/theme/source/osi.scss

@@ -585,10 +585,27 @@ p.caption {
 #page.main {
   font-family: 'lato', sans-serif;
   font-size: 1.4em;
+  height: 100%;
   line-height: 1.2;
   margin-left: auto;
   margin-right: auto;
   max-width: 960px;
+  position: relative;
+  text-align: center;
+  div.content-wrapper {
+    bottom: 0;
+    left: 0;
+    margin: auto;
+    max-height: 80%;
+    max-width: 80%;
+    min-height: 20%;
+    min-width: 20%;
+    overflow: auto;
+    position: absolute;
+    right: 0;
+    resize: both;
+    top: 0;
+  }
   a {
     color: #ff8a00;
     text-decoration: none;
@@ -604,9 +621,11 @@ p.caption {
   h1, h2, h3 {
     color: #647a8e;
     font-family: "League Gothic", Impact, sans-serif;
+    margin-bottom: 20px;
     text-transform: uppercase;
   }
   #header {
+    padding-bottom: 15px;
     padding-top: 10px;
   }
   #footer {

+ 8 - 3
index.html

@@ -3,11 +3,14 @@
   <head>
     <title>Présentations OSInet pour Drupal Global Training Day</title>
     <link rel="stylesheet" media="screen" type="text/css" href="css/theme/osi.css" />
+		<link rel="stylesheet" href="css/reveal.min.css">
     <meta charset="UTF-8">
   </head>
 
-  <body>
-  <div id="page" class="main">
+  <body class="main">
+  <div id="page" class="main reveal">
+  
+    <div class="content-wrapper">
   
     <div id="header">
       <div id="header-title">
@@ -26,8 +29,10 @@
       <p><a href="04-en-production.html">Drupal en production</a></p>
     </div>
     
+    </div>
+    
     <div id="footer">
-      <p>© OSInet 2013</p>
+      <p>DGTD / © 2013 OSInet / Licence CC-BY-SA 2.0 France</p>
     </div>
   
   </div>