commit 029518a050f75fee246d4fa88be4cfda132046aa Author: xfnw Date: Tue Jun 1 09:16:58 2021 -0400 init diff --git a/README b/README new file mode 100644 index 0000000..c64c1ca --- /dev/null +++ b/README @@ -0,0 +1,28 @@ +This directory contains the files to display pages in PmWiki according +to the default "responsive" layout, adaptive for large and small screens. + +Note that currently this layout is "beta". It requires relatively recent +mobile and desktop browsers (post-2010). + +==>Don't edit these files directly, as you may lose your edits the +next time you upgrade PmWiki! + +Instead, copy the files to another directory in pub/skins/ and edit +them there. You can then configure PmWiki to use your modified layout +files by setting the $Skin variable in your local/config.php. For +example, if you copy your custom skin to pub/skins/custom, then you +would set + $Skin = 'custom'; +in local/config.php. + +The files in this directory: + skin.tmpl -- the default template for page layouts + skin.css -- PmWiki's default css + skin.php -- some template functions + skin.js -- some template functions (browser) + *.svg -- icons + +Note, the default PmWiki logo is in the "pmwiki" template directory. +If you just want to change the logo, you can do it by setting $PageLogoUrl +to the url location of your logo. + diff --git a/skin.css b/skin.css new file mode 100644 index 0000000..1da8437 --- /dev/null +++ b/skin.css @@ -0,0 +1,564 @@ +/*********************************************************************** +** skin.css +** Copyright 2016-2020 Petko Yotov www.pmwiki.org/petko +** +** Partially based on pmwiki.css: +** Copyright 2004-2006 Patrick R. Michaud pmichaud@pobox.com +** Copyright 2006 Hagan Fox +** +** This file is part of PmWiki; you can redistribute it and/or modify +** it under the terms of the GNU General Public License as published +** by the Free Software Foundation; either version 2 of the License, or +** (at your option) any later version. See pmwiki.php for full details. +** +** This skin was implemented with a mobile-first approach. +** It should work reasonably well with browsers released since 2009. +** This CSS uses relative "Reference pixel" dimensions. +***********************************************************************/ + +html, body, #bodywrap { + padding: 0; + margin: 0 auto; + max-width: 50em; + font-family: 'Arial', 'Helvetica', Sans-serif; + font-size:15px; + line-height: 25px; + color: black; + min-height: 100%; + position: relative; +} + +#wikibody { + position: relative; + background-color: white; + padding: 3px; + margin: 0; +} + +#wikileft, #wikihead-searchform, #wikicmds { + opacity: 0.1; + display: none; + position: absolute; + border: 1px solid #ccc; + max-width: 90%; + max-width: 90vw; + height: auto; + overflow: auto; + top: 8px; + -webkit-box-shadow: 2px 2px 8px 0px rgba(0,0,0,0.75); + -moz-box-shadow: 2px 2px 8px 0px rgba(0,0,0,0.75); + box-shadow: 2px 2px 8px 0px rgba(0,0,0,0.75); +} + +#wikihead { + border-bottom:1px solid #ccc; + padding: 0; + margin: 0; + line-height: 13px; + min-height: 33px; +} + +#wikihead-searchform { + text-align: center; + padding: 10px; + z-index: 5; + right: 30px; + width: 16em; + max-width: 80%; + line-height: 167%; +} +#wikihead-searchquery { + max-width: 12em; +} +#wikimid { + margin: 0; + padding: 0; + max-width: 100%; +} + +#wikileft { + left: 30px; + padding: 6px; + z-index: 4; +} + +#wikicmds { + padding:0px; + z-index: 6; + white-space:nowrap; + right: 30px; +} + +#wikitext { + margin-top: 12px; +} + +#wikifoot { + border-top: 1px solid #ccc; + padding: 3px; + font-size: 13.5px; +} + +#wikifoot.nosidebar { + padding-left:3px; +} + +#wikihead-search-toggle, #wikileft-toggle, #wikicmds-toggle { + display: none; +} + +#wikihead-search-toggle-label { background-image: url(xsearch.svg); } +#wikileft-toggle-label { background-image: url(xmenu.svg); } +#wikicmds-toggle-label { background-image: url(xwrench.svg); } + +#wikihead-search-toggle-label, #wikileft-toggle-label, #wikicmds-toggle-label { + position: relative; + display: block; + width: 1.8em; + height: 1.8em; + background-size: cover; + background-repeat: no-repeat; + float:right; + margin: 6px 6px 0 6px; + z-index: 3; +} + +#wikileft-toggle-label { + float: left; +} +#wikicmds-toggle-label { + margin: 3px; +} + +#wikihead-search-toggle:checked + label, +#wikileft-toggle:checked + label, +#wikicmds-toggle:checked ~ #wikimid #wikicmds-toggle-label { + background-image: url(xclose.svg); +} + +#wikileft-toggle:checked ~ * #wikileft, +#wikihead-search-toggle:checked ~ * #wikihead-searchform, +#wikicmds-toggle:checked ~ * #wikicmds { + display: block; + opacity: 1; + background-color: white; + +-webkit-animation: fadein 1s; + -moz-animation: fadein 1s; + -ms-animation: fadein 1s; + -o-animation: fadein 1s; + animation: fadein 1s; +} + +#wikioverlay { + position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + width: 100%; + height: 100%; + overflow: hidden; + background-color: rgba(0, 0, 0, .2); + z-index: 2; + display: none; +} +#wikileft-toggle:checked ~ #wikioverlay, +#wikihead-search-toggle:checked ~ #wikioverlay, +#wikicmds-toggle:checked ~ #wikioverlay { + display: block; +} + + + +/* These are for the left-sidebar. */ +#wikileft .vspace { margin-top:20px; } +#wikileft ul { list-style:none; padding:0px; margin:0px; } +#wikileft li { margin:8px 0px; padding-left: 6px; } +.sidehead { + margin:0px; padding:4px 2px 2px 2px; + font-weight:bold; font-style:normal; +} +.sidehead a + { color:#505050; font-weight:bold; font-style:normal; } +#wikileft a { text-decoration:none; color:black; padding: 8px 0; } +#wikileft a:hover { text-decoration:underline; color:blue; } + +#wikicmds ul { list-style:none; margin:0px; padding:0px; } +#wikicmds li { padding: 8px; border-top:1px solid #ccc;} +#wikicmds li:first-child {border-top:none;} +#wikicmds li a { text-decoration:none; color:black; border: none; } +#wikicmds li a.createlink { display:none; } +#wikicmds li a:hover { text-decoration:underline; color:blue; } + + +/* These primarily adjust the size and spacing of heading elements, +** most browsers have atrocious defaults for these. */ +h1, h2, h3, h4, h5, h6 { margin-top:15px; margin-bottom:9px; } +h1, h2, h3, h6 { font-weight:normal; } +h4, h5 { font-weight:bold; } +h1 code, h2 code, h3 code, h4 code { font-size:15px; } +h1 { font-size:27px; } +h2 { font-size:22px; } +h3 { font-size:18px; } +h4 { font-size:16px; } +h5 { font-size:15px; } +h6 { font-size:15px; } + +.pagegroup { line-height:30px; } +.pagegroup a { color: black; text-decoration: none } +.pagegroup a:hover { text-decoration: underline; color: blue } +.pagetitle { line-height:24px; margin:0px; font-size:24px; font-weight:normal; } +.wikiaction { margin-top:4px; margin-bottom:4px; } + +/* These control the fixed-width text elements of the page */ +pre, code { font-size:14px; } +pre, code, .diffmarkup { font-family:'Lucida Console','Andale Mono','Courier New',Courier,monospace; } +pre { line-height: 18px; } +pre code, code code, pre pre { font-size:100%; } +pre, code.escaped { max-width: 100%; overflow: auto; } + +/* Large tables can scroll */ +div.scrollable { max-width: 100%; overflow: auto; border: 1px dotted red;} + +#wikiedit form { margin:0px; width:100%; max-width:100%; } +#wikiedit textarea { width:99.5%; max-width:99.5%; max-height: 60vh; } +#wikiedit input { max-width:99.5%; } +.wikimessage { margin-top:4px; margin-bottom:4px; font-style:italic; } + +input, img, iframe { + max-width: 100%; +} +dd { + margin-left: 15px; +} +ul, ol { + margin: 0; +} + +select, textarea, input { + font-size: 16px; /*disable zoom-in on some phones*/ +} + +/* xlpage-utf-8.php */ +.rtl, .rtl * {direction:rtl; unicode-bidi:bidi-override;} +.ltr, .ltr * {direction:ltr; unicode-bidi:bidi-override;} +.rtl .indent, .rtl.indent, .rtl .outdent, .rtl.outdent { + margin-left:0; margin-right: 15px; +} + +/* pmwiki.php */ +ul, ol, pre, dl, p { margin-top:0px; margin-bottom:0px; } +code.escaped { + white-space: pre; + display: inline-block; + vertical-align: bottom; + text-indent: 0; +} +.vspace { margin-top:25px; } +.indent { margin-left:15px; } +.outdent { margin-left:15px; text-indent:-15px; } +a.createlinktext { text-decoration:none; border-bottom:1px dotted gray; } +a.createlink { text-decoration:none; position:relative; top:-7px; + font-weight:bold; font-size:smaller; border-bottom:none; } +img { border:0px; } + +/* Prevent white space below vertically stacked images */ +div.imgonly img, div.imgcaption img:first-child { vertical-align: bottom; } + +/* wikistyles.php */ +.frame { border:1px solid #cccccc; padding:4px; background-color:#f9f9f9; } +.lfloat { float:left; margin-right:7px; } +.rfloat { float:right; margin-left:7px; } + +/* stdmarkup.php */ +table.markup { border:2px dotted #ccf; width:100%; } +/* td.markup1, td.markup2 { padding-left:0px; padding-right:0px; } */ +table.horiz td.markup1, table.vert td.markup1 { + border-bottom:1px solid #ccf; border-right: none; width: auto; } +table.horiz td.markup1, table.horiz td.markup2 { + /* horizontal markup tables to vertical */ + display: block; } +table.markup caption { text-align:left; } +div.faq p, div.faq pre { margin-left:15px; } +div.faq p.question { margin: 0; font-weight:bold; } +div.faqtoc div.faq * { display:none; } +div.faqtoc div.faq p.question + { display:block; font-weight:normal; margin:7px 0 7px 15px; line-height:normal; } +div.faqtoc div.faq p.question * { display:inline; } + +/* simuledit.php */ +.editconflict { color:green; + font-style:italic; margin-top:20px; margin-bottom:20px; } + +/* pagerev.php */ +.diffbox { border-left:1px #999 solid; margin-top:20px; font-size:12px; } +.diffauthor { font-weight:bold; } +.diffchangesum { font-weight:bold; } +.difftime { background-color:#ddd; } +.difftype { font-weight:bold; } +.diffadd { border-left:5px #9f9 solid; padding-left:5px; } +.diffdel { border-left:5px #ff9 solid; padding-left:5px; } +.diffrestore { margin:20px 0px; } +.diffmarkup { font-size:14px; } +.diffmarkup del { background:#ff9; text-decoration: none; } +.diffmarkup ins { background:#9f9; text-decoration: none; } + +/* urlapprove.php */ +.apprlink { font-size:smaller; } + +/* vardoc.php */ +a.varlink { text-decoration:none; } + +#wikiedit-minoredit { + white-space: nowrap; +} + +/* In HTML5 only styles are valid for alignment */ +td.left, th.left { text-align: left;} +td.center, th.center { text-align: center;} +td.right, th.right { text-align: right;} +td.top, th.top { vertical-align: top;} +td.bottom, th.bottom { vertical-align: bottom;} +td.middle, th.middle { vertical-align: middle;} + +.noPmTOC {display:none;} +.PmTOCdiv { display: inline-block; font-size: 13px; overflow: auto; max-height: 500px;} +.PmTOCdiv a { text-decoration: none;} +.back-arrow {font-size: .9em; text-decoration: none;} +#PmTOCchk + label {cursor: pointer;} +#PmTOCchk {display: none;} +#PmTOCchk:not(:checked) + label > .pmtoc-show {display: none;} +#PmTOCchk:checked + label > .pmtoc-hide {display: none;} +#PmTOCchk:checked + label + div {display: none;} + +table.simpletable { + border-collapse: collapse; +} +table.simpletable tr:nth-child(odd) { + background-color: #eee; +} +table.simpletable th { + background-color: #ccc; +} +table.simpletable th, table.simpletable td { + border: 1px solid #888; +} + +table.sortable th { + cursor: pointer; +} + +table.sortable th:hover::after { + color: inherit; + content: "\00A0\025B8"; +} + +table.sortable th::after { + color: transparent; + content: "\00A0\025B8"; +} + +table.sortable th.dir-u::after { + color: inherit; + content: "\00A0\025BE"; +} + +table.sortable th.dir-d::after { + color: inherit; + content: "\00A0\025B4"; +} + +*[data-pmtoggle], .pmtoggleall { + cursor: pointer; + font-weight: bold; +} +*[data-pmtoggle]::before { + content: "\025BE\00A0"; + float: left; +} +*[data-pmtoggle="closed"]::before { + content: "\025B8\00A0"; +} + +*[data-pmtoggle] + * { + margin-left: .8em; +} +*[data-pmtoggle="closed"] + * { + display: none; +} + #wikilogo { + display: inline-block; + margin-top: 4px; + padding: 10px; + } + #wikilogo a { + color: black; + text-decoration: none; + font-size: 1.8em; + } + #wikilogo a:hover { + color: blue; + text-decoration: underline; + } + +@media screen and (min-width:50em) { + html, body, #bodywrap { + line-height: 20px; + width: 100%; + margin: 0 auto; + } + + #wikileft, #wikihead-searchform, #wikicmds { + opacity: 1; + display: block; + position: relative; + border: none; + max-width: none; + height: auto; + max-height: none; + overflow: auto; + top: 0px; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + } + #wikicmds-toggle-label, #wikileft-toggle-label, #wikihead-search-toggle-label { + display: none; + } + #wikihead-searchform { + background-color: transparent; + float: right; + padding: 4px; + right: 6px; + top: 6px; + width: auto; + max-width: none; + line-height: inherit; + overflow: hidden; + } + #wikihead, #wikihead input { + font-size: 85%; + } + + #wikihead-recent-changes-link, #wikihead-searchlink{ + display: inline; + } + + #wikimid { + display: table; + table-layout:fixed; + width: 100%; + } + #wikisidebar, #wikibody { + display: table-cell; + } + + #wikisidebar { + position: relative; + border-right:1px solid #ccc; + width:167px; + vertical-align: top; + padding: 0; margin: 0; + overflow: auto; + } + #wikileft { + padding:6px; + left: 0; + margin: 0 1px 0 0; + background: transparent; + font-size: 13px; + line-height: 17px; + } + #wikileft a { padding: 0px; } + #wikileft li {margin:0px; } + + #wikibody { + padding-left: 10px; + vertical-align: top; + } + + #wikicmds { + right: 0px; + background-color: transparent; + float:right; + white-space:nowrap; + font-size:13px; + } + #wikicmds li { display:inline; margin:0px 5px; padding: 0; border: none; } + + #wikifoot { + padding-left:178px; + } + + #wikifoot.nosidebar { + padding-left:10px; + } + .vspace { margin-top: 20px; } + .indent { margin-left:40px; } + .outdent { margin-left:40px; text-indent:-40px; } + + .rtl .indent, .rtl.indent, .rtl .outdent, .rtl.outdent { + margin-left:0; margin-right: 40px; + } + + dd { margin-left: 40px; } + + table.horiz td.markup1, table.horiz td.markup2 { + display: table-cell; } + + td.markup1, td.markup2 { padding-left:10px; padding-right:10px; } + table.vert td.markup1 { border-bottom:1px solid #ccf; } + table.horiz td.markup1 { width:23em; border-right:1px solid #ccf; border-bottom:none; } + td.markup1 pre { white-space: pre-wrap; } + + div.faq p, div.faq pre { margin-left:40px; } + div.faq p.question { margin:15px 0 12px 0; } + div.faqtoc div.faq p.question + { margin:8px 0 8px 20px; } + + + select, textarea, input { + font-size: 14px; + } + + #wikileft-toggle:checked ~ #wikioverlay, + #wikihead-search-toggle:checked ~ #wikioverlay, + #wikicmds-toggle:checked ~ #wikioverlay { + display: none; + } + +} + +/* These affect the printed appearance of the web view (not the separate +** print view) of pages. The sidebar and action links aren't printed. */ +@media print { + body { width:auto; margin:0px; padding:8px; } + #wikihead, #wikileft, #wikicmds, .footnav { display:none; } + #wikifoot { padding:2px; } + *[data-pmtoggle="closed"] + * { display: inherit; } + *[data-pmtoggle="closed"]::before { content: "\025BE\00A0"; } +} + +/* Fade-in animation */ +@keyframes fadein { + from { opacity: 0; } + to { opacity: 1; } +} +@-moz-keyframes fadein { + from { opacity: 0; } + to { opacity: 1; } +} +@-webkit-keyframes fadein { + from { opacity: 0; } + to { opacity: 1; } +} +@-ms-keyframes fadein { + from { opacity: 0; } + to { opacity: 1; } +} +@-o-keyframes fadein { + from { opacity: 0; } + to { opacity: 1; } +} + diff --git a/skin.js b/skin.js new file mode 100644 index 0000000..53d2d3f --- /dev/null +++ b/skin.js @@ -0,0 +1,78 @@ +/*********************************************************************** +** skin.js +** Copyright 2016-2017 Petko Yotov www.pmwiki.org/petko +** +** This file is part of PmWiki; you can redistribute it and/or modify +** it under the terms of the GNU General Public License as published +** by the Free Software Foundation; either version 2 of the License, or +** (at your option) any later version. See pmwiki.php for full details. +** +** This script fixes the styles of some elements when some directives +** like (:noleft:) are used in a page. +***********************************************************************/ +(function(){ + var W = window, D = document; + function $(x) { // returns element from id + return D.getElementById(x); + } + function hide(id) { // hides element + var el = $(id); + if(el) el.style.display = 'none'; + } + function cname(id, c) { // set element className + var el = $(id); + if(el) el.className = c; + } + var wsb = $('wikisidebar'); + if(! wsb) { // (:noleft:) + hide('wikileft-toggle-label') + cname('wikifoot', 'nosidebar'); + } + else { + var sbcontent = wsb.textContent || wsb.innerText; + if(! sbcontent.replace(/\s+/, '').length) // empty sidebar, eg. protected + hide('wikileft-toggle-label'); + } + var wcmd = $('wikicmds'); + if(wcmd) { // page actions + var pacontent = wcmd.textContent || wcmd.innerText; + if(! pacontent.replace(/\s+/, '').length) // empty, eg. protected + hide('wikicmds-toggle-label'); + } + if(! $('wikihead-searchform')) // no search form, eg. custom header + hide('wikihead-search-toggle-label'); + var overlay = $('wikioverlay'); + if(overlay) { + overlay.addEventListener('click', function(){ + $('wikicmds-toggle').checked = false; + $('wikihead-search-toggle').checked = false; + $('wikileft-toggle').checked = false; + }); + } + var scrolltables = function() { + // This function "wraps" large tables in a scrollable div + // and "unwraps" narrow tables from the scrollable div + // allowing table alignement + var tables = D.getElementsByTagName('table'); + for(var i=0; i pn.offsetWidth) { + var nn = D.createElement('div'); + pn.insertBefore(nn, t).className = 'scrollable'; + nn.appendChild(t); + } + } + } + } + W.addEventListener('resize', scrolltables, false); + D.addEventListener('DOMContentLoaded', scrolltables, false); +})(); diff --git a/skin.php b/skin.php new file mode 100644 index 0000000..bdb388b --- /dev/null +++ b/skin.php @@ -0,0 +1,89 @@ +\\[\\[#([A-Za-z][-.:\\w]*))\\]\\]/e', + "Keep(TrackAnchors('$1') ? '' : \"\", 'L')"); +} +else { + Markup('[[#','<[[','/(?>\\[\\[#([A-Za-z][-.:\\w]*))\\]\\]/', + "MarkupKeepTrackAnchors"); +} +function MarkupKeepTrackAnchors($m) { + return Keep(TrackAnchors($m[1]) ? '' : "", 'L'); +} + +# in HTML5 "clear" is a style not an attribute +Markup('[[<<]]','inline','/\\[\\[<<\\]\\]/',"
"); + +# Allow skin header and footer to be written +# in a wiki page, and use defaults otherwise +SDVA($WrapSkinSections, array( + '#skinheader' => '
+
+ %s +
+
', + '#skinfooter' => '
+ %s +
', +)); +SDVA($HideTemplateSections, array( + '#skinheader' => 'PageHeaderFmt', + '#skinfooter' => 'PageFooterFmt', +)); + +# This function prints a skin element which is written +# inside a [[#header]]...[[#headerend]] section in Site.SkinElements +# overriding the existing section from the template file + +function SkinFmt($pagename, $args) { + global $WrapSkinSections, $HideTemplateSections, $TmplDisplay; + + $args = preg_split('!\\s+!', $args, null, PREG_SPLIT_NO_EMPTY); + + $section = array_shift($args); + $hidesection = $HideTemplateSections[$section]; + + if(isset($TmplDisplay[$hidesection]) && $TmplDisplay[$hidesection] == 0) { + return; # Section was disabled by (:noheader:) or (:nofooter:) + } + + foreach($args as $p) { + $pn = FmtPageName($p, $pagename); + $elm = RetrieveAuthSection($pn, "$section{$section}end"); + if(!$elm) continue; + + $html = MarkupToHTML($pagename, Qualify($pn, $elm)); + echo sprintf($WrapSkinSections[$section], $html); + SetTmplDisplay($hidesection,0); + return; + } + if(@$DefaultSkinElements[$section]) + echo FmtPageName($DefaultSkinElements[$section], $pagename); +} + diff --git a/skin.tmpl b/skin.tmpl new file mode 100644 index 0000000..3226992 --- /dev/null +++ b/skin.tmpl @@ -0,0 +1,89 @@ + + + + $WikiTitle | {$Group} / {$Title} $ActionTitle + + + + + + +
+ + + + + + + + + +
+
+ +
+ + $[Recent Changes] - + + $[Search]: + + + + +
+
+
+ + +
+ + + + +
+
+ + +
+ + +
+
{$Group} /
+

{$Title}

+
+ + + +
+ +
+ +
+ + + + + +
+
+ + + + + + + + diff --git a/xclose.svg b/xclose.svg new file mode 100644 index 0000000..b972d12 --- /dev/null +++ b/xclose.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/xmenu.svg b/xmenu.svg new file mode 100644 index 0000000..c7ead3d --- /dev/null +++ b/xmenu.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/xsearch.svg b/xsearch.svg new file mode 100644 index 0000000..4495dcc --- /dev/null +++ b/xsearch.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/xwrench.svg b/xwrench.svg new file mode 100644 index 0000000..6b4d840 --- /dev/null +++ b/xwrench.svg @@ -0,0 +1 @@ + \ No newline at end of file