From cc0a590ec6eeec86f54958f1d41f08dfdfe390a7 Mon Sep 17 00:00:00 2001
From: Matthias Mees <mm@yellowled.de>
Date: Sun, 9 Mar 2014 17:17:44 +0100
Subject: [PATCH] Fix installer and updater for use with backend JS

- include Modernizr in the installer as well (needed for no-js/js)
- reference backend JS before body instead of in head
- added container markup for installer error msgs
- some styling for tables in the installer
- remove obsolete no-js/js styles for JS-less installer
- compensate for the lack of iconfonts (due to the style.css not
  being piped through serendipity.css.php in the installer) by
  using different markup which works with system fonts
---
 templates/2k11/admin/config_template.tpl |  6 ++--
 templates/2k11/admin/installer.inc.tpl   |  8 +++--
 templates/2k11/admin/style.css           | 39 ++++++++++++++++++------
 3 files changed, 38 insertions(+), 15 deletions(-)

diff --git a/templates/2k11/admin/config_template.tpl b/templates/2k11/admin/config_template.tpl
index 83a3b5e0..eaf9a7e5 100644
--- a/templates/2k11/admin/config_template.tpl
+++ b/templates/2k11/admin/config_template.tpl
@@ -20,14 +20,14 @@
             {/if}
             
         {/if}
-            <fieldset id="el{$category@index}" class="config_optiongroup{if $config_groupkeys@last} config_optiongroup_last{/if} additional_info option_list">
+            <fieldset id="el{$category@index}" class="config_optiongroup{if $config_groupkeys@last} config_optiongroup_last{/if}{if $admin_vars.admin_installed} additional_info{/if} option_list">
                 <legend class="visuallyhidden">{$category.description}</legend>
         {foreach $category.items as $item}
             {cycle assign='zebra_class' values='odd,even'}
             {if $item.guessedInput}
                 {if $item.type == 'bool'}
                 <fieldset class="clearfix {$zebra_class}">
-                    <span class="wrap_legend"><legend>{$item.title}{if $item.description != ''} <button class="toggle_info button_link" type="button" data-href="#{$item.var}_info"><span class="icon-info-circled"></span><span class="visuallyhidden"> {$CONST.MORE}</span></button>{/if}</legend></span>
+                    <span class="wrap_legend"><legend>{$item.title}{if $item.description != ''} <button class="toggle_info button_link" type="button" data-href="#{$item.var}_info">{if $admin_vars.admin_installed} <span class="icon-info-circled"></span>{else}<b>i</b>{/if}<span class="visuallyhidden"> {$CONST.MORE}</span></button>{/if}</legend></span>
                     <div class="clearfix grouped">
                     {$item.guessedInput}
                     </div>
@@ -37,7 +37,7 @@
                 </fieldset>
                 {else}
                 <div class="clearfix {$zebra_class} form_{if $item.type == 'list'}select{elseif $item.type == 'multilist'}multiselect{elseif $item.type == 'textarea'}area{else}field{/if}">
-                    <label for="{$item.var}">{$item.title}{if $item.description != ''} <button class="toggle_info button_link" type="button" data-href="#{$item.var}_info"><span class="icon-info-circled"></span><span class="visuallyhidden"> {$CONST.MORE}</span></button>{/if}</label>
+                    <label for="{$item.var}">{$item.title}{if $item.description != ''} <button class="toggle_info button_link" type="button" data-href="#{$item.var}_info">{if $admin_vars.admin_installed} <span class="icon-info-circled"></span>{else}<b>i</b>{/if}<span class="visuallyhidden"> {$CONST.MORE}</span></button>{/if}</label>
                     {$item.guessedInput}
                     {if $item.description != ''}
                     <span id="{$item.var}_info" class="field_info additional_info">{$item.description}</span>
diff --git a/templates/2k11/admin/installer.inc.tpl b/templates/2k11/admin/installer.inc.tpl
index 1cfcce12..66eeafaf 100644
--- a/templates/2k11/admin/installer.inc.tpl
+++ b/templates/2k11/admin/installer.inc.tpl
@@ -6,8 +6,8 @@
     <title>{$CONST.SERENDIPITY_ADMIN_SUITE}</title>
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="{serendipity_getFile file='admin/style.css'}">
+    <script src="{serendipity_getFile file='admin/js/modernizr-2.7.1.min.js'}"></script>
     <script src="{serendipity_getFile file='jquery.js'}"></script>
-    <script src="{serendipity_getFile file='admin/serendipity_editor.js'}"></script>
 </head>
 <body id="serendipity_admin_page">
     <header id="top">
@@ -21,9 +21,11 @@
     <main class="clearfix serendipityAdminContent installer">
         <div id="content" class="clearfix">
         {if $is_errors && is_array($errors)}
+            <ul class="plainList">
             {foreach $errors AS $error}
-            <span class="msg_error">{$error}</span>
+                <li><span class="msg_error">{$error}</span></li>
             {/foreach}
+            </ul>
         {/if}
         {if $getstepint0}
             <h2>{$CONST.WELCOME_TO_INSTALLATION}</h2>
@@ -290,5 +292,7 @@
     <footer id="meta">
         <p>{$ADMIN_FOOTER_POWERED_BY|sprintf:$versionInstalled:$phpversion}</p>
     </footer>
+
+    <script src="{serendipity_getFile file='admin/serendipity_editor.js'}"></script>
 </body>
 </html>
diff --git a/templates/2k11/admin/style.css b/templates/2k11/admin/style.css
index 0019ade1..889f4581 100644
--- a/templates/2k11/admin/style.css
+++ b/templates/2k11/admin/style.css
@@ -1021,6 +1021,18 @@ h4,
     margin: 1.3125em 0;
 }
 
+#diagnose caption {
+    margin-top: 0;
+}
+
+#diagnose tr {
+    border-bottom: 1px solid #aaa;
+}
+
+#diagnose td h5 {
+    margin: .5em 0;
+}
+
 .toggle_headline,
 #category_list h3,
 h5,
@@ -1048,15 +1060,8 @@ summary {
 .installer .msg_notice,
 .installer .msg_hint {
     display: inline-block;
-    margin: 0 0 .5em;
-    padding: 0 .5em;
-}
-
-.installer dd .msg_error,
-.installer dd .msg_success,
-.installer dd .msg_notice,
-.installer dd .msg_hint {
     margin: .5em 0;
+    padding: 0 .5em;
 }
 
 .msg_error {
@@ -1823,6 +1828,22 @@ form > .button_link:first-of-type,
     margin: .75em 0 0;
 }
 
+.installer .toggle_info {
+    padding: 1px 2px;
+    position: relative;
+    top: -1px;
+}
+
+.installer .toggle_info b {
+    display: inline-block;
+    font-family: Georgia, 'Times New Roman', serif;
+    font-size: .875em;
+    line-height: 1;
+    width: 1em;
+    speak: none;
+    text-align: center;
+}
+
 .installer .field_info a,
 .installer .field_info a:visited {
     color: #444;
@@ -2112,7 +2133,6 @@ label .perm_name,
 .no-js .toggle_info,
 .no-js #category_list,
 .js .additional_info,
-.installer .toggle_info,
 .hidden,
 .msg_error > br,
 .msg_success > br,
@@ -2122,7 +2142,6 @@ label .perm_name,
     visibility: hidden;
 }
 
-.js .installer .additional_info,
 .no-js .mfp-hide {
     display: block !important;
     visibility: visible;