Linux-Presentation-Day_LPD/dokuwiki-template-landing
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

initial

Browse Source
This commit is contained in:
Franke 2021-07-12 18:26:55 +02:00
parent 31b0804034
commit e042031f2a
17 changed files with 859 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
assets/bootstrap-theme.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

5
assets/bootstrap.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

6
assets/bootstrap.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
assets/ekko-lightbox.css Normal file
View File

File diff suppressed because one or more lines are too long

2
assets/ekko-lightbox.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
assets/jquery-3.6.0.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

270
assets/landing.css Normal file
View File

@ -0,0 +1,270 @@
.container,
.container-fluid {
padding: 2em;
}
.container.no-padding,
.container-fluid.no-padding {
padding: 0;
}
.lpd-header.container-fluid {
padding:0;
}
.lpd-header .jumbotron {
border-radius: 0;
width:100%;
}
.lpd-header .jumbotron img {
max-width:100%;
}
.lpd-header-sub,
.lpd-header-sub.container-fluid .container,
.lpd-header-sub .jumbotron {
padding: 0;
}
.lpd-header-sub h1 {
display:none;
}
.lpd-header-sub .jumbotron {
border-radius: 0;
width:100%;
}
.lpd-header-sub .jumbotron img,
.lpd-header-sub .jumbotron img.mediacenter {
max-width:100%;
}
.lpd-ribbon.container-fluid {
color:white;
background-color: #337ab7;
}
.lpd-ribbon p > a,
.lpd-ribbon .li > a {
color: #fff;
font-weight: bold;
text-decoration:underline;
}
.lpd-ribbon-light.container-fluid {
background-color: #bee1ff;
}
.lpd-ribbon-light p > a,
.lpd-ribbon-light .li > a {
color: #000;
font-weight: bold;
text-decoration:underline;
}
.container .row.bs-wrap-row {
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
}
.container .row .thumbnail {
background-color:#337ab7;
border:0;
color:white;
text-align:center;
box-shadow: none;
display: flex;
flex-flow: column wrap;
justify-content: flex-start;
height:100%;
}
.container .row .thumbnail p:last-child {
margin-top:auto;
}
/* Icons as font on startpage */
.container-fluid .row .thumbnail span.bs-wrap-image,
.container .row .thumbnail span.bs-wrap-image {
font-size:5em;
}
/* Minor adjustment to wrong width calculation of fontawesome, so it's centered. */
.container-fluid .row .thumbnail span.bs-wrap-image .fa-fw,
.container .row .thumbnail span.bs-wrap-image .fa-fw {
width: inherit;
}
.container .row .thumbnail a.btn-primary {
background-image: none;
background-color: #fff;
color:#337ab7;
border:none;
border-radius: 0;
text-shadow: none;
box-shadow: none;
}
.lpd-ribbon .container .row .bs-wrap-col {
margin: 0 auto;
}
.lpd-ribbon .container .row .bs-wrap-image {
display:flex;
flex-direction: column;
width:100px;
height:100px;
margin:.2em auto;
}
.lpd-ribbon .container .row .bs-wrap-image[data-img-shape=circle] {
border-radius: 50%;
background-color:#3989cf;
justify-content: center;
}
.lpd-ribbon .container .row .bs-wrap-image img.media,
.lpd-ribbon .container .row .bs-wrap-image img.mediaright {
border-radius: 0;
align-self: center;
}
.lpd-ribbon .container .row .bs-wrap-image img.mediaright {
margin: auto 0;
}
.lpd-ribbon .container .row .bs-wrap-image a img.mediaright {
margin: 0;
}
.list-group-item svg {
float:left;
margin-right:10px;
}
.list-group-item a > * {
vertical-align:middle;
}
aside#dokuwiki__pagetools {
position:static;
}
footer, aside {
clear:both;
}
@media (min-width: 1024px) {
aside#dokuwiki__pagetools {
position:fixed;
bottom:0;
right:0;
width:70px;
overflow:hidden;
height:auto;
transition: width .2s;
}
aside#dokuwiki__pagetools:hover {
width:200px;
}
}
#dokuwiki__detail dl {
width: 350px;
overflow: hidden;
padding: 0;
margin: 0;
}
#dokuwiki__detail dt {
float: left;
text-align: right;
width: 150px;
padding: .2em;
margin: 0;
}
#dokuwiki__detail dd {
float: left;
text-align: left;
width: 200px;
padding: .2em;
margin: 0;
}
#dokuwiki__detail #dokuwiki__pagetools .container {
padding:0;
}
#dokuwiki__detail #dokuwiki__pagetools .list-group-item.top {
display: none;
}
.link-home {
cursor:pointer;
}
.lpd-ribbon div.thumb2 {
padding-right: 0;
}
.lpd-ribbon div.thumb2 .thumbinner {
border: 0;
padding: 0;
border-radius: 0 0 5px 5px;
}
.lpd-ribbon div.thumbcaption {
padding: 7px;
}
/* regular button */
.btn {
background-image: none;
text-shadow: none;
border: none;
border-radius: 0;
}
footer > ::before {
display:block;
height:2px;
width:40%;
background-image: linear-gradient(to right, transparent, #337ab7, transparent);
margin: 1em auto;
}
/* plugin:translation adjustments: links in footer */
.dokuwiki footer div.plugin_translation ul li a.wikilink1:link,
.dokuwiki footer div.plugin_translation ul li a.wikilink1:hover,
.dokuwiki footer div.plugin_translation ul li a.wikilink1:active,
.dokuwiki footer div.plugin_translation ul li a.wikilink1:visited {
background-color: inherit;
color: inherit;
}
.dokuwiki footer div.plugin_translation span sup {
display:none;
}
.dokuwiki footer div.plugin_translation ul {
margin-top:3px;
}
.dokuwiki footer div.plugin_translation ul li {
float:initial;
margin: 0;
}
.dokuwiki footer div.plugin_translation ul li div.li {
padding:5px;
}
.dokuwiki footer div.plugin_translation ul li img {
float:right;
margin-top:3px;
}
@media (max-width: 767px) {
.dokuwiki footer div.plugin_translation {
display:block;
width:100%;
text-align:center;
margin-top:0.5em;
}
.dokuwiki footer div.plugin_translation ul {
text-align:center;
}
.dokuwiki footer div.plugin_translation ul li {
}
.dokuwiki footer div.plugin_translation ul li img {
float:none;
margin-top:-2px;
}
}

0
assets/landing.js Normal file
View File

178
assets/offcanvas.css Normal file
View File

@ -0,0 +1,178 @@
/* off-canvas */
/* Adaption of https://bootsnipp.com/snippets/Qb83E */
/*
body {
position: relative;
overflow-x: hidden;
}
body,
html { height: 100%;}
.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {background-color: transparent;}
*/
/*-------------------------------*/
/* Wrappers */
/*-------------------------------*/
#wrapper {
padding-left: 0;
transition: all 0.5s ease;
}
#wrapper.toggled {
/*padding-left: 220px;*/
}
#sidebar-wrapper {
position:absolute;
z-index: 1000;
left: 220px;
width: 0;
height: 100%;
margin-left: -220px;
overflow-y: auto;
overflow-x: hidden;
background: #1a1a1a;
transition: all 0.5s ease;
}
#sidebar-wrapper::-webkit-scrollbar {
display: none;
}
#wrapper.toggled #sidebar-wrapper {
width: 220px;
}
/*
#page-content-wrapper,
#dokuwiki__site {
width: 100%;
}
#wrapper.toggled #page-content-wrapper {
position: absolute;
margin-right: -220px;
}
#wrapper.toggled #dokuwiki__site {
margin-right: -220px;
}
*/
/*-------------------------------*/
/* Sidebar nav styles */
/*-------------------------------*/
.sidebar-offcanvas ul {
width: 220px;
margin: 0;
padding: 0;
list-style: none;
overflow-x: hidden;
}
.sidebar-offcanvas ul li {
position: relative;
line-height: 20px;
min-height: 20px;
height:auto;
display: inline-block;
width: 100%;
}
.sidebar-offcanvas ul li:before {
content: '';
position: absolute;
top: 0;
left: 0;
z-index: -1;
height: 100%;
width: 3px;
background-color: #1c1c1c;
transition: width .3s ease-in;
}
.sidebar-offcanvas ul li a {
color: #fff;
background-color: #1a1a1a;
}
.sidebar-offcanvas ul li:before {
background-color: #314190;
}
.sidebar-offcanvas ul li:hover:before,
.sidebar-offcanvas ul li.open:hover:before {
width: 100%;
transition: width .3s ease-in;
}
.sidebar-offcanvas ul li i {
display:block;
float:left;
width: 20px;
padding: 10px;
font-size: 1.5em;
}
.sidebar-offcanvas h3 {
display:none;
}
.sidebar-offcanvas ul li a {
display: block;
width:190px;
float:right;
color: #ddd;
text-decoration: none;
padding: 10px 15px 10px 30px;
}
.sidebar-offcanvas ul li a:hover,
.sidebar-offcanvas ul li a:active,
.sidebar-offcanvas ul li a:focus,
.sidebar-offcanvas ul li.open a:hover,
.sidebar-offcanvas ul li.open a:active,
.sidebar-offcanvas ul li.open a:focus{
color: #fff;
text-decoration: none;
background-color: transparent;
}
/*-------------------------------*/
/* Hamburger-Cross */
/*-------------------------------*/
.hamburger {
position: absolute;
top: 20px;
z-index: 999;
display: block;
width: 32px;
height: 32px;
margin-left: 15px;
background: transparent;
border: none;
}
.hamburger i {
font-size:2em;
}
#wrapper .hamburger {
margin-left: 0;
transition: margin-left 0.8s ease;
}
#wrapper.toggled .hamburger {
margin-left: 220px;
}
/*-------------------------------*/
/* Overlay */
/*-------------------------------*/
.overlay {
position: fixed;
display: none;
width: 100%;
height: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(250,250,250,.8);
z-index: 1;
}

34
assets/offcanvas.js Normal file
View File

@ -0,0 +1,34 @@
(function() {
jQuery(function($) {
/* Off-Canvas */
var trigger = $('.hamburger'),
icon = $('.hamburger-icon'),
overlay = $('.overlay'),
isClosed = false;
trigger.click(function () {
hamburger_trigger();
});
function hamburger_trigger() {
if (isClosed == true) {
overlay.hide();
icon.removeClass("fa-times");
icon.addClass("fa-bars");
isClosed = false;
} else {
overlay.show();
icon.removeClass("fa-bars");
icon.addClass("fa-times");
isClosed = true;
}
}
overlay.click(function () {
trigger.click();
});
$('[data-toggle="offcanvas"]').click(function () {
$('#wrapper').toggleClass('toggled');
});
});
})();

21
changelog.txt Normal file
View File

@ -0,0 +1,21 @@
...
2021-07-11 Rüdiger Marwein
Added burger menu to show "sidebar" as offcanvas menu.
Removed "link-home" workaround script
2021-07-08 Rüdiger Marwein
Links in ribbon in <p> and <li> underlined and proper color.
2021-07-05 Rüdiger Marwein
(Un-)Styling for ~~TRANS~~ language switcher in footer
Separator above footer
2021-07-04 Rüdiger Marwein
Fix Startpage Icon size
Fix font-awesome Icon Zentrierung
2021-07-03 Rüdiger Marwein
JS induced link to homepage on click on page logo
Screenshot source link a bit beautified

86
detail.php Normal file
View File

@ -0,0 +1,86 @@
<?php
/**
* DokuWiki Image Detail Page
*
* @author Ruediger Marwein <henryxiv@hotmail.com>
*/
// must be run from within DokuWiki
if (!defined('DOKU_INC')) die();
?><!DOCTYPE html>
<html lang="<?php echo $conf['lang']?>" dir="<?php echo $lang['direction'] ?>" class="no-js">
<head>
<meta charset="utf-8" />
<title>
<?php echo hsc(tpl_img_getTag('IPTC.Headline',$IMG))?>
[<?php echo strip_tags($conf['title'])?>]
</title>
<script>(function(H){H.className=H.className.replace(/\bno-js\b/,'js')})(document.documentElement)</script>
<?php tpl_metaheaders()?>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<?php echo tpl_favicon(array('favicon', 'mobile')) ?>
<?php tpl_includeFile('meta.html') ?>
</head>
<body>
<div id="dokuwiki__site"><div id="dokuwiki__top" class="site <?php echo tpl_classes(); ?>">
<article id="dokuwiki__detail">
<div class="container">
<!-- PAGE ACTIONS -->
<?php if (!$ERROR): ?>
<div id="dokuwiki__pagetools">
<div class="container">
<h3 class="a11y"><?php echo $lang['page_tools']; ?></h3>
<div class="tools">
<ul class="list-group">
<?php echo (new \dokuwiki\Menu\DetailMenu())->getListItems("list-group-item "); ?>
</ul>
</div>
</div>
</div>
<?php endif; ?>
<h1>DETAIL</h1>
<?php html_msgarea() ?>
<?php if(!$ERROR): ?>
<div class="pageId"><span><?php echo hsc(tpl_img_getTag('IPTC.Headline',$IMG)); ?></span></div>
<?php endif; ?>
<?php
if($ERROR):
echo '<div class="alert alert-danger" role="alert">'.$ERROR.'</div>';
else: ?>
<?php if($REV) echo p_locale_xhtml('showrev');?>
<h1><?php echo nl2br(hsc(tpl_img_getTag('simple.title'))); ?></h1>
<?php tpl_img(1280,1280); /* parameters: maximum width, maximum height (and more) */ ?>
<div class="img_detail panel">
<div class="panel-body">
<?php tpl_img_meta(); ?>
<dl>
<?php
echo '<dt>'.$lang['reference'].':</dt>';
$media_usage = ft_mediause($IMG,true);
if(count($media_usage) > 0){
foreach($media_usage as $path){
echo '<dd>'.html_wikilink($path).'</dd>';
}
}else{
echo '<dd>'.$lang['nothingfound'].'</dd>';
}
?>
</dl>
<div class="alert alert-danger" role="alert"><?php echo $lang['media_acl_warning']; ?></div>
</div>
</div>
<?php //Comment in for Debug// dbg(tpl_img_getTag('Simple.Raw'));?>
<?php endif; ?>
</div>
</article>
<hr class="a11y" />
</body>
</html>

63
main.php Normal file
View File

@ -0,0 +1,63 @@
<?php
/**
* DokuWiki Default Template 2012
*
* @author Ruediger Marwein <henryxiv@hotmail.com>
* @license GPL 2 (http://www.gnu.org/licenses/gpl.html)
*/
if (!defined('DOKU_INC')) die();
$hasSidebar = page_findnearest($conf['sidebar']);
$showSidebar = $hasSidebar && ($ACT=='show');
?><!DOCTYPE html>
<html lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>" class="no-js">
<head>
<meta charset="utf-8" />
<title><?php tpl_pagetitle() ?> [<?php echo strip_tags($conf['title']) ?>]</title>
<script>(function(H){H.className=H.className.replace(/\bno-js\b/,'js')})(document.documentElement)</script>
<?php tpl_metaheaders() ?>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<?php echo tpl_favicon(array('favicon', 'mobile')) ?>
<?php tpl_includeFile('meta.html') ?>
</head>
<body>
<div id="wrapper">
<div class="overlay"></div>
<div id="dokuwiki__site">
<div id="dokuwiki__top" class="site <?php echo tpl_classes(); ?>">
<article>
<?php tpl_content() ?>
</article>
<aside id="dokuwiki__pagetools">
<div class="container">
<h3 class="a11y"><?php echo $lang['page_tools']; ?></h3>
<div class="tools">
<ul class="list-group">
<?php echo (new \dokuwiki\Menu\PageMenu())->getListItems("list-group-item "); ?>
</ul>
</div>
</div>
</aside>
<footer class="text-center">
<?php tpl_include_page("footer", true, true) ?>
</footer>
<?php tpl_flush() ?>
</div>
<div class="no"><?php tpl_indexerWebBug() ?></div>
<div id="screen__mode" class="no"></div>
</div>
<nav class="navbar navbar-inverse navbar-fixed-top sidebar-offcanvas" id="sidebar-wrapper" role="navigation">
<?php tpl_include_page("sidebar", true, true) ?>
</nav>
<button type="button" class="hamburger is-closed" data-toggle="offcanvas">
<i class="hamburger-icon dw-icons fa-fw fa fa-bars" style=""></i>
</button>
</div>
</body>
</html>

105
readme.txt Normal file
View File

@ -0,0 +1,105 @@
~~USETHEME:landing~~
~~NOTOC~~
<container>
===== The landing pages must be kept clean. =====
* Use short sentences
* Clear and easy language.
* Meta Tags give good and correct signals to Search Engines
* Use a **title** that reflects the page content, ideally the H1 of the page or the actual window title. Will show in Google, Facebook, Twitter as headline.
* **Description** is a rephrase of existing page content. Will appear on Google, Facebook, Twitter as summary.
* Link the **share-image** for open graph and twitter cards. When shared it looks more engaging that way.
* **Keywords** have to be words used in the page, which have relevance to the topic. Keywords are not interpreted by major search engines, but meta-search-engines.
* Use boostrap containers to visually separate context and create easy bites of information.
* Interrupt the white desert with a ribbon where applicaple
* Best use ribbon for a very relevant section of the page
* keep the word-count low and the significance high.
* Keep the footer clean. Only a few helpful links is enough. Imprint is the bare minumum.
* Use H1 for the first headline - it will be prefixed to the page title.
* Use H2 for later sections and when nesting, increment accordingly
* Do not used headlines "just for the look".
* Introduce classes in the template CSS where adjustments / special cases are needed
* Do not put styling elements into the wikitext
* Do not create "more margin" with extra newlines. Create a class in the template.
* Update translations immediately.
</container>
<container>
===== Container =====
Every vertical visual section goes into a <container> Tag.\\
Containers cannot be nested.\\
This is a regular container.\\
Containers can be fluid (full width) or not.
Inside containers you can stuff whatever you want.
Give a class to a special container so you can style the content individually - or use a predefined class.
</container>
<container>
<code>
<container>
Your stuff here
</container>
</code>
</container>
<container class="lpd-ribbon">
===== Ribbon =====
This is a regular ribbon container
</container>
<container>
<code>
<container class="lpd-ribbon">
Your stuff here
</container>
</code>
</container>
<container fluid="1" class="lpd-ribbon">
===== Fluid Ribbon =====
This is a fluid ribbon container
</container>
<container>
<code>
<container fluid="1" class="lpd-ribbon">
Your stuff here
</container>
</code>
</container>
<container fluid="1" class="text-center">
===== Center content =====
You can use the text-center class from Bootstrap to center the content of a container.
</container>
<container>
<code>
<container fluid="1" class="text-center">
Your stuff here
</container>
</code>
</container>
<container class="ribbon">
===== Custom Styling =====
When you create custom stylesheets make sure your classname is unique.\\
**Styles are located in the theme "landing".**
</container>
<container>
<code>
<container class="very-unique-class">
==== Your stuff here ====
Foo bar
</container>
.very-unique-class p {
font-size: 200px;
color: #deadee;
}
</code>
</container>

4
script.js Normal file
View File

@ -0,0 +1,4 @@
/* DOKUWIKI:include assets/bootstrap.min.js */
/* DOKUWIKI:include assets/ekko-lightbox.min.js */
/* DOKUWIKI:include assets/landing.js */
/* DOKUWIKI:include assets/offcanvas.js */

69
style.ini Normal file
View File

@ -0,0 +1,69 @@
; Please see http://php.net/manual/en/function.parse-ini-file.php
; for limitations of the ini format used here
; To extend this file or make changes to it, it is recommended to create
; a local conf/tpl/<template-folder-name>/style.ini file to prevent losing
; any changes after an upgrade.
; Please don't forget to copy the section your changes should be under
; (i.e. [stylesheets] or [replacements]) into that file as well.
; Define the stylesheets your template uses here. The second value
; defines for which output media the style should be loaded. Currently
; print, screen and all are supported.
; You can reference CSS and LESS files here. Files referenced here will
; be checked for updates when considering a cache rebuild while files
; included through LESS' @import statements are not
[stylesheets]
assets/bootstrap.min.css = screen
assets/bootstrap-theme.min.css = screen
assets/ekko-lightbox.css = screen
assets/landing.css = screen
assets/offcanvas.css = screen
../bootstrap3/css/core/_edit.css = screen
; This section is used to configure some placeholder values used in
; the stylesheets. Changing this file is the simplest method to
; give your wiki a new look.
; Placeholders defined here will also be made available as LESS variables
; (with surrounding underscores removed, and the prefix @ini_ added)
[replacements]
;--------------------------------------------------------------------------
;------ guaranteed dokuwiki color placeholders that every plugin can use
; main text and background colors
__text__ = "#333" ; @ini_text
__background__ = "#fff" ; @ini_background
; alternative text and background colors
__text_alt__ = "#999" ; @ini_text_alt
__background_alt__ = "#eee" ; @ini_background_alt
; neutral text and background colors
__text_neu__ = "#666" ; @ini_text_neu
__background_neu__ = "#ddd" ; @ini_background_neu
; border color
__border__ = "#ccc" ; @ini_border
; highlighted text (e.g. search snippets)
__highlight__ = "#ff9" ; @ini_highlight
; default link color
__link__ = "#2b73b7" ; @ini_link
;--------------------------------------------------------------------------
__background_site__ = "#fbfaf9" ; @ini_background_site
; these are used for wiki links
__existing__ = "#080" ; @ini_existing
__missing__ = "#d30" ; @ini_missing
; site and sidebar widths
__site_width__ = "75em" ; @ini_site_width
__sidebar_width__ = "16em" ; @ini_sidebar_width
; cut off points for mobile devices
__tablet_width__ = "800px" ; @ini_tablet_width
__phone_width__ = "480px" ; @ini_phone_width
__theme_color__ = "#008800" ; @_ini_theme_color: theme_color of the web app

7
template.info.txt Normal file
View File

@ -0,0 +1,7 @@
base landing
author Ruediger Marwein
email henryxiv@hotmail.com
date 2021-06-15
name Landingpage Template
desc Template to build beautiful, clutter-free bootstrap pages.
url -