on the skin files you just installed.

   4.   Edit the BuiltinSkin[] array near the top of the src/skins.c source
        file so that it describes and references the "newskin" skin.

   5.   Type "make" to rebuild.

See the [custom skin documentation](/doc/$CURRENT/www/customskin.md) for
more information.

Development Hints
-----------------

One way to develop a new skin is to copy the baseline files (css.txt,
details.txt, footer.txt, header.txt, and js.txt) into a working 
directory $WORKDIR then launch Fossil with a command-line option 

** Show the files and subdirectories within a single directory of the
** source tree.  Only files for a single check-in are shown if the ci=
** query parameter is present.  If ci= is missing, the union of files
** across all check-ins is shown.
**
** Query parameters:
**
**    ci=LABEL         Show only files in this check-in.  Optional.
**    name=PATH        Directory to display.  Optional.  Top-level if missing
**    re=REGEXP        Show only files matching REGEXP
**    type=TYPE        TYPE=flat: use this display
**                     TYPE=tree: use the /tree display instead
**    noreadme         Do not attempt to display the README file.
*/
void page_dir(void){
  char *zD = fossil_strdup(P("name"));
  int nD = zD ? strlen(zD)+1 : 0;

  const char *zSubdirLink;
  int linkTrunk = 1;
  int linkTip = 1;
  HQuery sURI;
  int isSymbolicCI = 0;   /* ci= is symbolic name, not a hash prefix */
  int isBranchCI = 0;     /* True if ci= refers to a branch name */
  char *zHeader = 0;
  const char *zRegexp;    /* The re= query parameter */
  char *zMatch;           /* Extra title text describing the match */

  if( zCI && strlen(zCI)==0 ){ zCI = 0; }
  if( strcmp(PD("type","flat"),"tree")==0 ){ page_tree(); return; }
  login_check_credentials();
  if( !g.perm.Read ){ login_needed(g.anon.Read); return; }
  while( nD>1 && zD[nD-2]=='/' ){ zD[(--nD)-1] = 0; }

    }
  }else{
    if( zCI ){
      zHeader = mprintf("Files in %s/ of %s", zD, zCI);
    }else{
      zHeader = mprintf("All File in %s/", zD);
    }
  }
  zRegexp = P("re");
  if( zRegexp ){
    zHeader = mprintf("%z matching \"%s\"", zHeader, zRegexp);
    zMatch = mprintf(" matching \"%h\"", zRegexp);
  }else{
    zMatch = "";
  }
  style_header("%s", zHeader);
  fossil_free(zHeader);
  style_adunit_config(ADUNIT_RIGHT_OK);
  sqlite3_create_function(g.db, "pathelement", 2, SQLITE_UTF8, 0,
                          pathelementFunc, 0, 0);
  url_initialize(&sURI, "dir");

                          url_render(&sURI, "name", 0, 0, 0));
  }else{
    @ <h2>Files in the top-level directory \
    zPrefix = "";
  }
  if( zCI ){
    if( fossil_strcmp(zCI,"tip")==0 ){
      @ from the %z(href("%R/info?name=%T",zCI))latest check-in</a>\
      @ %s(zMatch)</h2>
    }else if( isBranchCI ){
      @ from the %z(href("%R/info?name=%T",zCI))latest check-in</a> \
      @ of branch %z(href("%R/timeline?r=%T",zCI))%h(zCI)</a>\
      @ %s(zMatch)</h2>
    }else {
      @ of check-in %z(href("%R/info?name=%T",zCI))%h(zCI)</a>\
      @ %s(zMatch)</h2>
    }
    zSubdirLink = mprintf("%R/dir?ci=%T&name=%T", zCI, zPrefix);
    if( nD==0 ){
      style_submenu_element("File Ages", "%R/fileage?name=%T", zCI);
    }
  }else{
    @ in any check-in</h2>

    );
  }else{
    db_multi_exec(
      "INSERT OR IGNORE INTO localfiles"
      " SELECT pathelement(name,0), NULL FROM filename"
    );
  }

  /* If the re=REGEXP query parameter is present, filter out names that
  ** do not match the pattern */
  if( zRegexp ){
    db_multi_exec(
      "DELETE FROM localfiles WHERE x NOT REGEXP %Q", zRegexp
    );
  }

  /* Generate a multi-column table listing the contents of zD[]
  ** directory.
  */
  mxLen = db_int(12, "SELECT max(length(x)) FROM localfiles /*scan*/");
  if( mxLen<12 ) mxLen = 12;
  mxLen += (mxLen+9)/10;

     [/help?cmd=tarball|tarball],
     [/help?cmd=zip|zip], and [/help?cmd=sqlar|sqlar]
     commands.
  *  The javascript used to implement the hamburger menu on the
     default built-in skin has been made generic so that it is usable
     by a variety of skins, and promoted to an ordinary built-in
     javascript file.
  *  New TH1 commands:  
     "[/doc/trunk/www/th1.md#bireqjs|builtin_request_js]",
     "[/doc/trunk/www/th1.md#capexpr|capexpr]",
     "foreach", "lappend", and "string match"

<a name='v2_14'></a>
<h2>Changes for Version 2.14 (2021-01-20)</h2>

  *  <b>Schema Update Notice #1:</b>
     This release drops a trigger from the database schema (replacing

# Skinning the Fossil Web Interface

The Fossil web interface comes with a pre-configured look and feel.  The default
look and feel works fine in many situations.  However, you may want to change
the look and feel (the "skin") of Fossil to better suite your own individual tastes.
This document provides background information to aid you in that task.

## <a name="builtin"></a>Built-in Skins

Fossil comes with [multiple built-in skins](/skins).  If the default skin does not
suite your tastes, perhaps one of the other built-in skins will work better.
If nothing else, the built-in skins can serve as examples or templates that
you can use to develop your own custom skin.

The sources to these built-ins can
be found in the Fossil source tree under the skins/ folder.  The 
[skins/](/dir?ci=trunk&name=skins)

  *  expr EXPR
  *  for INIT-SCRIPT TEST-EXPR NEXT-SCRIPT BODY-SCRIPT
  *  foreach VARIABLE-LIST VALUE-LIST BODY-SCRIPT
  *  if EXPR SCRIPT (elseif EXPR SCRIPT)* ?else SCRIPT?
  *  info commands
  *  info exists VARNAME
  *  info vars
  *  lappend VARIABLE TERM ...
  *  lindex LIST INDEX
  *  list ARG ...
  *  llength LIST
  *  lsearch LIST STRING
  *  proc NAME ARG-LIST BODY-SCRIPT
  *  rename OLD NEW
  *  return ?-code CODE? ?VALUE?
  *  set VARNAME VALUE
  *  string compare STR1 STR2
  *  string first NEEDLE HAYSTACK ?START-INDEX?
  *  string index STRING INDEX
  *  string is CLASS STRING
  *  string last NEEDLE HAYSTACK ?START-INDEX?
  *  string match PATTERN STRING
  *  string length STRING
  *  string range STRING FIRST LAST
  *  string repeat STRING COUNT
  *  unset VARNAME
  *  uplevel ?LEVEL? SCRIPT
  *  upvar ?FRAME? OTHERVAR MYVAR ?OTHERVAR MYVAR?

There are many new commands added to TH1 and used to access the special
features of Fossil.  The following is a summary of the extended commands:

  *  [anoncap](#anoncap)
  *  [anycap](#anycap)
  *  [artifact](#artifact)
  *  [builtin_request_js](#bireqjs)
  *  [capexpr](#capexpr)
  *  [captureTh1](#captureTh1)
  *  [cgiHeaderLine](#cgiHeaderLine)
  *  [checkout](#checkout)
  *  [combobox](#combobox)
  *  [copybtn](#copybtn)
  *  [date](#date)

  *  artifact ID ?FILENAME?

Attempts to locate the specified artifact and return its contents.  An
error is generated if the repository is not open or the artifact cannot
be found.


<a id="bireqjs"></a>TH1 builtin_request_js Command
--------------------------------------------------

  *  builtin_request_js NAME

NAME must be the name of one of the 
[built-in javascript source files](/dir?ci=trunk&type=flat&name=src&re=js$).
This command causes that javascript file to be appended to the delivered
document.



<a id="capexpr"></a>TH1 capexpr Command
-----------------------------------------------------

Added in Fossil 2.15.