make all web pages smartphone compatible

author Guillaume Cottenceau <gcottenc@gmail.com>

Sun, 20 May 2012 20:01:08 +0000 (22:01 +0200)

committer Guillaume Cottenceau <gcottenc@gmail.com>

Sun, 20 May 2012 20:01:08 +0000 (22:01 +0200)
author Guillaume Cottenceau <gcottenc@gmail.com>
Sun, 20 May 2012 20:01:08 +0000 (22:01 +0200)
committer Guillaume Cottenceau <gcottenc@gmail.com>
Sun, 20 May 2012 20:01:08 +0000 (22:01 +0200)
diff --git a/www/advanced.fr.html b/www/advanced.fr.html

index 8287d9f..6c256b7 100644 (file)
--- a/www/advanced.fr.html
+++ b/www/advanced.fr.html
@@ -4,28 +4,24 @@
  <head>
    <title>Booh - Le Web-Album de choix pour les utilisateurs de Linux distingués</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - Le Web-Album de choix pour les utilisateurs de Linux distingués</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-  <style type="text/css" media="screen"
-         <!--
-             pre { background-color: #e0e0e0; }
-             tt { background-color: #e0e0e0; }
-           -->
-  </style>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+pre { background-color: #e0e0e0; }
+tt { background-color: #e0e0e0; }
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
@@ -36,8 +32,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-         <a href="advanced.html"><img src="images/en.png" alt="this page in english"/></a>
-                                  <img src="images/fr.png" alt="cette page est en français"/>
+        <div style="display:inline-block; margin-bottom:0.2em"><a href="advanced.html"><img src="images/en.png" alt="this page in english"/></a></div>
+        <div style="display:inline-block"><img src="images/fr.png" alt="cette page est en français"/></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
@@ -61,18 +57,17 @@
     </p>
  
     <p>
     </p>
  
     <p>
-     Les valeurs suivantes ont été obtenues sur un Pentium-4 avec
-     hyperthreading à 2.8 GHz, avec Linux 2.6.6 SMP 4G (notez que ce
-     n'est en aucune manière une vraie machine multi-processeurs) avec
+     Les valeurs suivantes ont été obtenues sur un P4 HT à 2.8 GHz, avec Linux 2.6.6 SMP 4G (notez que ce
+     n'est pas une vraie machine SMP) avec
       la même série de vignettes à créer :</p>
  
  <pre>
      Normal     durée : 2:10.81
       la même série de vignettes à créer :</p>
  
  <pre>
      Normal     durée : 2:10.81
-    --mproc 2  durée : 2:01.44
+    --mproc 2  durée : 2:01.44  (0.928 Normal)
  </pre>
  
     <p>
  </pre>
  
     <p>
-     Ce n'est pas si mal, mais montre clairement qu'un ordinateur
+     Ce n'est pas si mal, mais montre clairement qu'un P4
       hyperthreading n'est de loin pas une vraie machine SMP !
       Maintenant, regardons le résultat avec un Pentium-3 Cascades 700
       MHz avec 6 processeurs :</p>
       hyperthreading n'est de loin pas une vraie machine SMP !
       Maintenant, regardons le résultat avec un Pentium-3 Cascades 700
       MHz avec 6 processeurs :</p>
@@ -83,7 +78,7 @@
      --mproc 3  durée : 1:03.34 
      --mproc 4  durée : 0:49.12 
      --mproc 5  durée : 0:40.86 
      --mproc 3  durée : 1:03.34 
      --mproc 4  durée : 0:49.12 
      --mproc 5  durée : 0:40.86 
-    --mproc 6  durée : 0:39.03   (j'aurais du tuer ces processus apache inutiles !)
+    --mproc 6  durée : 0:39.03 elapsed  (0.219 Normal)
  </pre>
  
     <p>On voit bien ici que le support multi-processeurs de Booh n'est
  </pre>
  
     <p>On voit bien ici que le support multi-processeurs de Booh n'est
@@ -96,7 +91,22 @@
      Normal     durée : 0:48.79
      --mproc 2  durée : 0:27.87
      --mproc 3  durée : 0:20.38
      Normal     durée : 0:48.79
      --mproc 2  durée : 0:27.87
      --mproc 3  durée : 0:20.38
-    --mproc 4  durée : 0:16.96
+    --mproc 4  durée : 0:16.96  (0.347 Normal)
+</pre>
+
+   <p>Des tests plus récents (pas les mêmes photos), sur un Core i7
+   3770 (quad core HT) 3.4 GHz avec Linux 3.3.4 x86_64 :</p>
+
+<pre>
+    Normal     durée : 1:18.21
+    --mproc 2  durée : 0:39.82
+    --mproc 3  durée : 0:27.49
+    --mproc 4  durée : 0:20.95
+    --mproc 5  durée : 0:17.88
+    --mproc 6  durée : 0:15.77
+    --mproc 7  durée : 0:13.93
+    --mproc 8  durée : 0:12.70  (0.162 Normal)
+    --mproc 9  durée : 0:12.66
  </pre>
  
  
  </pre>
  
  
diff --git a/www/advanced.html b/www/advanced.html

index 0afbd54..5d72d8d 100644 (file)
--- a/www/advanced.html
+++ b/www/advanced.html
@@ -4,28 +4,24 @@
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-  <style type="text/css" media="screen"
-         <!--
-             pre { background-color: #e0e0e0; }
-             tt { background-color: #e0e0e0; }
-           -->
-  </style>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+pre { background-color: #e0e0e0; }
+tt { background-color: #e0e0e0; }
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
@@ -36,8 +32,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-                                     <img src="images/en.png" alt="this page is in english"/>
-         <a href="advanced.fr.html"><img src="images/fr.png" alt="cette page en français"/></a>
+        <div style="display:inline-block; margin-bottom:0.2em"><img src="images/en.png" alt="this page is in english"/></div>
+        <div style="display:inline-block"><a href="advanced.fr.html"><img src="images/fr.png" alt="cette page en français"/></a></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
@@ -58,19 +54,18 @@
     painful step when creating web-albums - Booh takes advantage of
     multi-processor machines.</p>
  
     painful step when creating web-albums - Booh takes advantage of
     multi-processor machines.</p>
  
-   <p>The following figures were obtained on a Pentium-4
-   hyperthreading 2.8 GHz with Linux 2.6.6 SMP 4G (note that this
-   is by no mean a real multi-processor machine) with the same
-   bunch of thumbnails to create:</p>
+   <p>The following figures were obtained on a P4 HT 2.8 GHz with
+   Linux 2.6.6 SMP 4G (note that this is not a real SMP machine) with
+   the same bunch of thumbnails to create:</p>
  
  <pre>
      Regular    2:10.81 elapsed
  
  <pre>
      Regular    2:10.81 elapsed
-    --mproc 2  2:01.44 elapsed
+    --mproc 2  2:01.44 elapsed  (0.928 Regular)
  </pre>
  
     <p>This is not bad, but clearly shows that an hyperthreading
  </pre>
  
     <p>This is not bad, but clearly shows that an hyperthreading
-   machine is not a real SMP machine by far! Now let's try with a
-   6-way Pentium-3 Cascades 700 MHz:</p>
+   P4 is not a real SMP machine by far! Now let's try with a
+   6-CPUs Pentium-3 Cascades 700 MHz:</p>
  
  <pre>
      Regular    2:58.07 elapsed
  
  <pre>
      Regular    2:58.07 elapsed
@@ -78,7 +73,7 @@
      --mproc 3  1:03.34 elapsed
      --mproc 4  0:49.12 elapsed
      --mproc 5  0:40.86 elapsed
      --mproc 3  1:03.34 elapsed
      --mproc 4  0:49.12 elapsed
      --mproc 5  0:40.86 elapsed
-    --mproc 6  0:39.03 elapsed  (I should have killed those useless apache processes!)
+    --mproc 6  0:39.03 elapsed  (0.219 Regular)
  </pre>
  
     <p>Now this multi-processor support Booh has is not a toy
  </pre>
  
     <p>Now this multi-processor support Booh has is not a toy
@@ -91,10 +86,23 @@
      Regular    0:48.79 elapsed
      --mproc 2  0:27.87 elapsed
      --mproc 3  0:20.38 elapsed
      Regular    0:48.79 elapsed
      --mproc 2  0:27.87 elapsed
      --mproc 3  0:20.38 elapsed
-    --mproc 4  0:16.96 elapsed
+    --mproc 4  0:16.96 elapsed  (0.347 Regular)
  </pre>
  
  </pre>
  
+   <p>More recent tests (not the same photos), on a Core i7
+   3770 (quad core HT) 3.4 GHz with Linux 3.3.4 x86_64:</p>
  
  
+<pre>
+    Regular    1:18.21 elapsed
+    --mproc 2  0:39.82 elapsed
+    --mproc 3  0:27.49 elapsed
+    --mproc 4  0:20.95 elapsed
+    --mproc 5  0:17.88 elapsed
+    --mproc 6  0:15.77 elapsed
+    --mproc 7  0:13.93 elapsed
+    --mproc 8  0:12.70 elapsed  (0.162 Regular)
+    --mproc 9  0:12.66 elapsed
+</pre>
  
     <a name="classifierperformance"><h2>Performance - <i>booh-classifier</i></h2></a>
  
  
     <a name="classifierperformance"><h2>Performance - <i>booh-classifier</i></h2></a>
  
diff --git a/www/discuss.fr.html b/www/discuss.fr.html

index 2339a9a..5800105 100644 (file)
--- a/www/discuss.fr.html
+++ b/www/discuss.fr.html
@@ -2,24 +2,26 @@
  <html xmlns="http://www.w3.org/1999/xhtml">
  
  <head>
  <html xmlns="http://www.w3.org/1999/xhtml">
  
  <head>
-  <title>Booh - The Web-Album of choice for discriminating Linux users</title>
+  <title>Booh - Le Web-Album de choix pour les utilisateurs de Linux distingués</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+pre { background-color: #e0e0e0; }
+tt { background-color: #e0e0e0; }
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
@@ -30,8 +32,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-         <a href="discuss.html"><img src="images/en.png" alt="this page in english"/></a>
-         <img src="images/fr.png" alt="cette page est en français"/>
+        <div style="display:inline-block; margin-bottom:0.2em"><a href="discuss.html"><img src="images/en.png" alt="this page in english"/></a></div>
+        <div style="display:inline-block"><img src="images/fr.png" alt="cette page est en français"/></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
diff --git a/www/discuss.html b/www/discuss.html

index 70793c3..d40e2c6 100644 (file)
--- a/www/discuss.html
+++ b/www/discuss.html
@@ -4,22 +4,22 @@
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
@@ -30,8 +30,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-                                     <img src="images/en.png" alt="this page is in english"/>
-         <a href="discuss.fr.html"><img src="images/fr.png" alt="cette page en français"/></a>
+        <div style="display:inline-block; margin-bottom:0.2em"><img src="images/en.png" alt="this page is in english"/></div>
+        <div style="display:inline-block"><a href="discuss.fr.html"><img src="images/fr.png" alt="cette page en français"/></a></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
diff --git a/www/download.fr.html b/www/download.fr.html

index 3d69997..eca4bbe 100644 (file)
--- a/www/download.fr.html
+++ b/www/download.fr.html
@@ -4,28 +4,24 @@
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-  <style type="text/css" media="screen"
-         <!--
-             pre { background-color: #e0e0e0; }
-             tt { background-color: #e0e0e0; }
-           -->
-  </style>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+pre { background-color: #e0e0e0; }
+tt { background-color: #e0e0e0; }
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
@@ -36,8 +32,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-         <a href="download.html"><img src="images/en.png" alt="this page in english"/></a>
-         <img src="images/fr.png" alt="cette page est en français"/>
+        <div style="display:inline-block; margin-bottom:0.2em"><a href="download.html"><img src="images/en.png" alt="this page in english"/></a></div>
+        <div style="display:inline-block"><img src="images/fr.png" alt="cette page est en français"/></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
diff --git a/www/download.html b/www/download.html

index 06f3722..23b3ab1 100644 (file)
--- a/www/download.html
+++ b/www/download.html
@@ -4,28 +4,24 @@
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-  <style type="text/css" media="screen"
-         <!--
-             pre { background-color: #e0e0e0; }
-             tt { background-color: #e0e0e0; }
-           -->
-  </style>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+pre { background-color: #e0e0e0; }
+tt { background-color: #e0e0e0; }
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
@@ -36,8 +32,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-                                     <img src="images/en.png" alt="this page is in english"/>
-         <a href="download.fr.html"><img src="images/fr.png" alt="cette page en français"/></a>
+        <div style="display:inline-block; margin-bottom:0.2em"><img src="images/en.png" alt="this page is in english"/></div>
+        <div style="display:inline-block"><a href="download.fr.html"><img src="images/fr.png" alt="cette page en français"/></a></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
diff --git a/www/index.fr.html b/www/index.fr.html

index da77d34..0f0e6bc 100644 (file)
--- a/www/index.fr.html
+++ b/www/index.fr.html
@@ -4,34 +4,34 @@
  <head>
    <title>Booh - Le Web-Album de choix pour les utilisateurs de Linux distingués</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - Le Web-Album de choix pour les utilisateurs de Linux distingués</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
-       <td width="25%" align="left" valign="top">
+       <td width="10%" align="left" valign="top">
           <a class="FlattrButton" style="display:none;" rev="flattr;button:compact;" href="http://booh.org/"></a>
         </td>
         <td width="50%" align="center">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
           <a class="FlattrButton" style="display:none;" rev="flattr;button:compact;" href="http://booh.org/"></a>
         </td>
         <td width="50%" align="center">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
-       <td width="25%" align="right" valign="top">
-         <a href="index.html"><img src="images/en.png" alt="this page in english"/></a>
-         <img src="images/fr.png" alt="cette page est en français"/>
+       <td width="10%" align="right" valign="top">
+        <div style="display:inline-block; margin-bottom:0.2em"><a href="index.html"><img src="images/en.png" alt="this page in english"/></a></div>
+        <div style="display:inline-block"><img src="images/fr.png" alt="cette page est en français"/></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
@@ -52,28 +52,28 @@
     <a href="themes/cardu/">regardez le résultat</a>.
     </p>
  
     <a href="themes/cardu/">regardez le résultat</a>.
     </p>
  
-   <p align="center">
-     <table width="1%" align="center" style="border-style:solid;border-color:#C0C0C0;border-width:1px 1px 1px 1px;padding:5px" cellspacing="0" cellpadding="0">
-            <tr>
-                    <td align="center"><a href="http://booh.org/images/tutorial-classifier-2.fr.png"><img src="images/scenario_1.fr.jpg" alt="scenario #1" border="0"/></a></td>
-                    <td><img src="images/scenario_arrow.jpg" alt="scenario arrow"/></td>
-                    <td align="center"><a href="http://booh.org/images/tutorial-classifier-5.fr.png"><img src="images/scenario_2.jpg" alt="scenario #2" border="0"/></a></td>
-                    <td><img src="images/scenario_arrow.jpg" alt="scenario arrow"/></td>
-                    <td align="center"><a href="http://booh.org/images/tutorial-starting-up-4.fr.png"><img src="images/scenario_3.jpg" alt="scenario #3" border="0"/></a></td>
-                    <td><img src="images/scenario_arrow.jpg" alt="scenario arrow"/></td>                   
-                    <td align="center"><a href="http://booh.org/themes/cardu/Home/"><img src="images/scenario_4.jpg" alt="scenario #4" border="0"/></a></td>
-            </tr>
-            <tr>
-                    <td align="center"><nobr><font color="#0018ad"><b>#1:</b></font> triez vos photos</nobr></td>
-                    <td>&nbsp;</td>
-                    <td align="center"><nobr><font color="#0018ad"><b>#2:</b></font> classez-les</nobr></td>
-                    <td>&nbsp;</td>
-                    <td align="center"><nobr><font color="#0018ad"><b>#3:</b></font> entrez les légendes</nobr></td>
-                    <td>&nbsp;</td>
-                    <td align="center"><nobr><font color="#0018ad"><b>#4:</b></font> album terminé</nobr></td>
-            </tr>
-     </table>
-   </p>
+   <div align="center">
+     <div style="display:inline-block; margin-right:2em; margin-bottom:1em">
+       <div align="center"><nobr><font color="#0018ad"><b>#1:</b></font> triez vos photos</nobr></div>
+       <br/>
+       <a href="http://booh.org/images/tutorial-classifier-2.png"><img src="images/scenario_1.jpg" alt="scenario #1" border="0"/></a>
+     </div>
+     <div style="display:inline-block; margin-right:2em; margin-bottom:1em">
+       <div align="center"><nobr><font color="#0018ad"><b>#2:</b></font> classez-les</nobr></div>
+       <br/>
+       <a href="http://booh.org/images/tutorial-classifier-5.png"><img src="images/scenario_2.jpg" alt="scenario #2" border="0"/></a>
+     </div>
+     <div style="display:inline-block; margin-right:2em; margin-bottom:1em">
+       <div align="center"><nobr><font color="#0018ad"><b>#3:</b></font> entrez les légendes</nobr></div>
+       <br/>
+       <a href="http://booh.org/images/tutorial-starting-up-4.png"><img src="images/scenario_3.jpg" alt="scenario #3" border="0"/></a>
+     </div>
+     <div style="display:inline-block; margin-bottom:1em">
+       <div align="center"><nobr><font color="#0018ad"><b>#4:</b></font> album terminé</nobr></div>
+       <br/>
+       <a href="http://booh.org/themes/gradient/Home/"><img src="images/scenario_4.jpg" alt="scenario #4" border="0"/></a>
+     </div>
+   </div>
  
     <p>Il y a déjà un grand nombre de générateurs de web-album
       disponibles sous Linux ; Booh se distingue par sa liste unique de
  
     <p>Il y a déjà un grand nombre de générateurs de web-album
       disponibles sous Linux ; Booh se distingue par sa liste unique de
@@ -92,7 +92,7 @@
           au contraire, d'utiliser seulement 1/4 de l'espace disponible quand on
           visualise une image paysage)</li>
         <li>thèmes (voir : <a href="themes/simple/">simple</a> -
           au contraire, d'utiliser seulement 1/4 de l'espace disponible quand on
           visualise une image paysage)</li>
         <li>thèmes (voir : <a href="themes/simple/">simple</a> -
-                          <a href="themes/cardu/">cardu</a> -
+cardu</a> -
                            <a href="themes/dark/">dark</a> -
                            <a href="themes/sbs/">sbs</a>)</li>
         <li>support des sous-albums</li>
                            <a href="themes/dark/">dark</a> -
                            <a href="themes/sbs/">sbs</a>)</li>
         <li>support des sous-albums</li>
diff --git a/www/tutorial.fr.html b/www/tutorial.fr.html

index 1f0411f..8d48a09 100644 (file)
--- a/www/tutorial.fr.html
+++ b/www/tutorial.fr.html
@@ -4,28 +4,24 @@
  <head>
    <title>Booh - Le Web-Album de choix pour les utilisateurs de Linux distingués</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - Le Web-Album de choix pour les utilisateurs de Linux distingués</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-  <style type="text/css" media="screen"
-         <!--
-             pre { background-color: #e0e0e0; }
-             tt { background-color: #e0e0e0; }
-           -->
-  </style>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+pre { background-color: #e0e0e0; }
+tt { background-color: #e0e0e0; }
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
@@ -36,8 +32,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-         <a href="tutorial.html"><img src="images/en.png" alt="this page in english"/></a>
-         <img src="images/fr.png" alt="cette page est en français"/>
+        <div style="display:inline-block; margin-bottom:0.2em"><a href="tutorial.html"><img src="images/en.png" alt="this page in english"/></a></div>
+        <div style="display:inline-block"><img src="images/fr.png" alt="cette page est en français"/></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
diff --git a/www/tutorial.html b/www/tutorial.html

index 5bcc8e2..647cfee 100644 (file)
--- a/www/tutorial.html
+++ b/www/tutorial.html
@@ -4,28 +4,24 @@
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-  <style type="text/css" media="screen"
-         <!--
-             pre { background-color: #e0e0e0; }
-             tt { background-color: #e0e0e0; }
-           -->
-  </style>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+pre { background-color: #e0e0e0; }
+tt { background-color: #e0e0e0; }
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
@@ -36,8 +32,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-                                     <img src="images/en.png" alt="this page is in english"/>
-         <a href="tutorial.fr.html"><img src="images/fr.png" alt="cette page en français"/></a>
+        <div style="display:inline-block; margin-bottom:0.2em"><img src="images/en.png" alt="this page is in english"/></div>
+        <div style="display:inline-block"><a href="tutorial.fr.html"><img src="images/fr.png" alt="cette page en français"/></a></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
diff --git a/www/video-demo.fr.html b/www/video-demo.fr.html

index 931d1e7..6003fc5 100644 (file)
--- a/www/video-demo.fr.html
+++ b/www/video-demo.fr.html
@@ -4,22 +4,24 @@
  <head>
    <title>Booh - Le Web-Album de choix pour les utilisateurs de Linux distingués</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - Le Web-Album de choix pour les utilisateurs de Linux distingués</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+pre { background-color: #e0e0e0; }
+tt { background-color: #e0e0e0; }
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%">
       <tr>
  
     <table width="100%">
       <tr>
@@ -30,8 +32,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-         <a href="video-demo.html"><img src="images/en.png" alt="this page in english"/></a>
-         <img src="images/fr.png" alt="cette page est en français"/>
+        <div style="display:inline-block; margin-bottom:0.2em"><a href="video-demo.html"><img src="images/en.png" alt="this page in english"/></a></div>
+        <div style="display:inline-block"><img src="images/fr.png" alt="cette page est en français"/></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
diff --git a/www/video-demo.html b/www/video-demo.html

index a42c8f8..71d8c0d 100644 (file)
--- a/www/video-demo.html
+++ b/www/video-demo.html
@@ -4,22 +4,22 @@
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <head>
    <title>Booh - The Web-Album of choice for discriminating Linux users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-<script type="text/javascript">
-/* <![CDATA[ */
-    (function() {
-        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
-        
-        s.type = 'text/javascript';
-        s.async = true;
-        s.src = 'http://api.flattr.com/js/0.5.0/load.js?mode=auto';
-        
-        t.parentNode.insertBefore(s, t);
-    })();
-/* ]]> */
-</script>
+  <meta name="viewport" content="width=device-width"/>  
+<style type="text/css">
+body {
+        font-family: Verdana, Arial, Helvetica, sans-serif, monospace;
+       text-align: justify;
+}
+@media all and (orientation: landscape) {  
+    body {
+        margin-left: 15%;
+       margin-right: 15%;
+    }
+}
+</style>
  </head>
  
  </head>
  
-<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b" style="padding: 0em 3em; text-align: justify">
+<body bgcolor="#FFFFFF" text="#000000" link="#0000ee" vlink="#551a8b">
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
  
     <table width="100%" cellspacing="0" cellpadding="0">
       <tr>
@@ -30,8 +30,8 @@
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
           <img src="images/logo.png" alt="booh logo"/>
         </td>
         <td width="25%" align="right" valign="top">
-                                     <img src="images/en.png" alt="this page is in english"/>
-         <a href="video-demo.fr.html"><img src="images/fr.png" alt="cette page en français"/></a>
+        <div style="display:inline-block; margin-bottom:0.2em"><img src="images/en.png" alt="this page is in english"/></div>
+        <div style="display:inline-block"><a href="video-demo.fr.html"><img src="images/fr.png" alt="cette page en français"/></a></div>
         </td>
       </tr>
     </table>
         </td>
       </tr>
     </table>
author	Guillaume Cottenceau <gcottenc@gmail.com>
	Sun, 20 May 2012 20:01:08 +0000 (22:01 +0200)
committer	Guillaume Cottenceau <gcottenc@gmail.com>
	Sun, 20 May 2012 20:01:08 +0000 (22:01 +0200)
www/advanced.fr.html		patch \| blob \| history
www/advanced.html		patch \| blob \| history
www/discuss.fr.html		patch \| blob \| history
www/discuss.html		patch \| blob \| history
www/download.fr.html		patch \| blob \| history
www/download.html		patch \| blob \| history
www/index.fr.html		patch \| blob \| history
www/tutorial.fr.html		patch \| blob \| history
www/tutorial.html		patch \| blob \| history
www/video-demo.fr.html		patch \| blob \| history
www/video-demo.html		patch \| blob \| history