====== Wiki customizations ======

In addition to the many [[..:wiki:plugins:]] that have been employed, several changes have been made to the wiki itself. These are mostly cosmetic CSS tweaks, but there are a couple other hacks as well.

===== Template =====

==== Bootstrap3 ====

The template in use is based on the [[doku>template:bootstrap3|Bootstrap3 template]] by Giuseppe Di Terlizzi. The entirety of that template has been copied into another folder to which additions have been made in two stages.

This template in turn implements [[https://getbootstrap.com/docs/3.4/|Bootstrap version 3.4.1]], which is a framework for web page development. This is not the most recent version, but it's enough to keep us busy for the nonce. Many of the cosmetic tweaks that have been made are really to values provided here rather than by the template.

The Bootstrap3 template does add an unofficial bootswatch theme that is not present in the bootstrap framework: Solar. A fork to that theme's assets [[git>bootstrapstudio/bootstrap3-solar|is available here]].

==== Schmootstrap3 ====

This is the first layer of customization, and it provides the bulk of the changes. For the most part, these are CSS adjustments to make the dark themes look better and work better with several of the plugins. It has been done separately in order to support more general use and leave Hârn-specific elements to a subsequent template.

=== Colors ===

The general approach has been to make a file of color constants for each theme to be modified. The colors have been derived from each theme's Default, Danger, Info, Primary, Success, and Warning colors along with various panels, borders, and other page elements. To these have been added Light, Lighter, and sometimes Lightest shades for optional use.

General code highlighting tweaks were added for several languages. This cleaned up the light themes that hadn't gotten the more extensive attention
devoted to rendering the dark ones in theme colors.

At this time, the following themes have been adjusted.

  * Cyborg
  * Darkly
  * Slate
  * Solar
  * Superhero
  * Yeti (wiki default)

These constants are then used in the other CSS files for each theme. There was a thought of making these other files more general to avoid duplicating them, but this required that all of the unaddressed themes be dealt with first. The present editor put that off to another day.

Why would this have to be done? Well, certain elements in the dark themes looked pretty bad. For instance, ''monospace text'' is rendered in the same red-on-pale-pink in every single theme. That came straight from the framework. Also, many plugins, like the Media Managers, change the text to white but keep their white backgrounds.

=== Other adjustments ===

  * The Yeti theme didn't need any of the color tweaks. It did, however insert quite a bit of space between the items in the navbar dropdown menus. These often plunged straight through the browser window.
  * The Template Style Settings pages had squished buttons for opening up the color selectors that were too thin to display the current values.
  * The [[navigation_plugin]] needed a fix applied to closed nodes in the right sidebars. The text appeared too big and bold.
  * Several classes were added for use with the [[wrap_plugin]].
  * One PHP bug was addressed: where the bootswatch themes were listed, Solar had been inserted before Slate rather than after. The relevant files are:
    * ''/lib/tpl/schmootstrap3/conf/metadata.php''
    * ''/lib/tpl/schmootstrap3/tpl/css.php''
  * Other template files were edited to reflect the additions: ''style.ini'', ''style.ini.default'', and ''template.info.txt''.

==== Harnstrap3 ====

As Schmootstrap3 is built on Bootstrap3, Harnstrap3 is built on Schmootstrap3. It supplies the following additional changes.

  * The Hârn-specific navbar dropdown menus in the ''works:'' namespace are rendered in two columns for length. The present editor didn't want to split them into even more menus in order to avoid making the entire navbar too wide for narrow browser windows.
  * More CSS classes for use with the Wrap plugin were added. These are for formatting the cover-and-credits block on ''works:'' pages, the triple border around top-level headings in the ''harn:'' and other HârnWorld namespaces, and several color classes handling many of the realms.
  * Other template files were edited to reflect the additions: ''style.ini'', ''style.ini.default'', and ''template.info.txt''.

===== Extra adjustments =====

Updates to the template properly confine themselves to the template's directory under''/lib/tpl'' in the wiki. HârnWiki, however, has other additions as well. These are contained in separate zip files.

If updating the files present in the wiki, care should be taken not to overwrite any changes made by admins, particularly in Configuration Settings held in ''local.php''. Even without access to the wiki back end, the [[advanced_plugin#configurations|Advanced plugin]] can allow for editing and creating the ''.local.conf'' files as well.

==== Schmootstrap3 extras ====

  * The ''svg'' files referred to in the CSS for interwiki links are provided here. Not all may be needed for Hârn, but the bloat is minor for now.
  * ''interwiki.local.conf'' handles the url format for those interwiki links.
  * ''local.php'' holds template default settings normally controlled via ''Configuration Settings'' on the Admin page. It's probably best not to overwrite the live wiki with the file here, but it is provided as a backup.
  * ''userscript.js'' contains the replacement code to fix the [[image_map_plugin#plugin_modifications|Image Map plugin]]. Another file, ''/lib/plugins/imagemapping/script.js.dist'' contains the current plugin version's text of ''script.js''. This last file needs to be deleted, if still present, to complete the fix.

==== Harnstrap3 extras ====

  * Images for additional smileys are provided. Now that DokuWiki has gone to the ''svg'' format for these, perhaps our flumph should be redone. :FLUMPH:
  * ''acronyms.local.conf'' gives definitions for Hârnic terms, like Rekela, Reblena, and Reslava.
  * ''smileys.local.conf'' puts our flumph into action.
  * ''local.php'' holds template default settings normally controlled via ''Configuration Settings'' on the Admin page. It's probably best not to overwrite the live wiki with the file here, but it is provided as a backup.

===== Archive files =====

One of these days, the present editor will have to learn how to properly use [[git>|GitHub]] to fork Bootstrap3 and store current versions of these templates and extras. Until then, copies (possibly current) are linked below. These are not the complete templates but rather just the additions and overwrites, which makes it simpler to incorporate them into updated versions of Bootstrap3.

To assemble a fresh template, well, the present editor runs a Python script in the text editor with which he edits these things. Barring that, a procedure like the following should work.

  - Create a directory to stand in for the wiki root directory.
  - Obtain a copy of the latest Bootstrap3 template and put its contents in ''/lib/tpl/bootstrap3''.
  - Copy that directory to ''/lib/tpl/schmootstrap3''
  - Unzip ''schmootstrap3.zip'' to the root directory.
  - If desired, unzip ''schmootstrap3_extras.zip'' to the root directory. This likely won't need to be done for an existing instance of HârnWiki that presumably has all this already, but there may be occasional additions here.
  - Copy or rename ''/lib/tpl/schmootstrap3'' to ''/lib/tpl/harnstrap3''
  - Unzip ''harnstrap3.zip'' to the root directory.
  - If desired, unzip ''harnstrap3_extras'' to the root directory.

==== Downloads ====

  * {{ wiki:schmootstrap3.zip |}}
  * {{ wiki:schmootstrap3_extras.zip |}}
  * {{ wiki:harnstrap3.zip |}}
  * {{ wiki:harnstrap3_extras.zip |}}