mirror/php-e107
1
0
Fork 0
mirror of https://github.com/e107inc/e107.git synced 2025-01-17 12:48:24 +01:00
Code Issues Releases Wiki Activity

Initial Bootstrap 5 theme added.

Browse Source
This commit is contained in:
Cameron 2021-03-22 11:43:13 -07:00
parent c33b91ee5c
commit 79ded794b1
15 changed files with 805 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
e107_themes/bootstrap5/README.md Normal file
View File

@ -0,0 +1,2 @@
# bootstrap5
bootstrap5 theme for e107 v2.3.1+

9
e107_themes/bootstrap5/languages/English.php Normal file
View File

@ -0,0 +1,9 @@
<?php
/* example */
// define('LAN_THEME_BOOTSTRAP5_001', "Example");

11
e107_themes/bootstrap5/languages/English_admin.php Normal file
View File

@ -0,0 +1,11 @@
<?php
/*
+ ----------------------------------------------------------------------------+
| e107 website system -
|
+----------------------------------------------------------------------------+
*/
define("LAN_THEMEPREF_01", "Bootswatch Styles:");
define("LAN_THEMEPREF_02", "Display standard menu with card look");
define("LAN_THEMEPREF_03", "Display Login Page as standard page");

10
e107_themes/bootstrap5/layouts/bare_layout.html Normal file
View File

@ -0,0 +1,10 @@
<!-- Page Content -->
<div class="container">
<div class="row mt-4">
<div class="col-lg-12">
{SETSTYLE=bare}
{ALERTS}
{---}
</div>
</div>
</div>

11
e107_themes/bootstrap5/layouts/full_layout.html Normal file
View File

@ -0,0 +1,11 @@
<!-- Layout: Full -->
{ALERTS}
<div class='container'>
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">{---CAPTION---}
<small>{---TEXT---}</small>
</h1>
{---BREADCRUMB---}
{SETSTYLE=main}
{---}
</div>

12
e107_themes/bootstrap5/layouts/home_layout.html Normal file
View File

@ -0,0 +1,12 @@
<!-- place for Featurebox or any masthead solution -->
{SETSTYLE=bare}
{HERO}
{MENU=1}
<!-- Page Content -->
{ALERTS}
{SETSTYLE=section} <!-- Example -->
{---}
<div class="container">
{MENU=2}
</div>

34
e107_themes/bootstrap5/layouts/sidebar_left_layout.html Normal file
View File

@ -0,0 +1,34 @@
<!-- Magic Shortcodes - proof of concept -->
<!-- Enabled Debug in 'basic' mode to view all available types -->
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">{---CAPTION---}
<small>{---TEXT---}</small>
</h1>
{---BREADCRUMB---}
<div class="row">
<div class="col-md-3 mb-3 sidebar">
<div class="menu">
{SETSTYLE=cardmenu}
{MENU=1}
</div>
</div>
<div class="col-md-9">
{ALERTS}
{SETSTYLE=main}
{---}
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->

42
e107_themes/bootstrap5/layouts/sidebar_right_layout.html Normal file
View File

@ -0,0 +1,42 @@
<!-- Magic Shortcodes - proof of concept -->
<!-- Enabled Debug in 'basic' mode to view all available types -->
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<h1 class="mt-4 mb-3">{---CAPTION---}
<small>{---TEXT---}</small>
</h1>
{---BREADCRUMB---}
<div class="row">
<!-- Blog Entries Column -->
<div class="col-md-8">
{ALERTS}
{SETSTYLE=main}
{---}
</div>
<div class="col-md-4 mb-3 sidebar">
<!-- Standard sidebar menu -->
<div class="menu">
{SETSTYLE=cardmenu}
{MENU=1}
</div>
<!-- Example for listgroup menu -->
<div class="list">
{SETSTYLE=listgroup}
{MENU=2}
</div>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->

6
e107_themes/bootstrap5/layouts/splash_layout.html Normal file
View File

@ -0,0 +1,6 @@
{SETSTYLE=singlelogin}
{ALERTS}
{---}

111
e107_themes/bootstrap5/style.css Normal file
View File

@ -0,0 +1,111 @@
body {
padding-top: 56px;
}
body.layout-home {
padding-top: 0px;
}
body.layout-singlelogin {
padding-top: 0px;
}
/* featurebox defaults */
#e107bootstrapcarousel .carousel-item {
height: 65vh;
min-height: 300px;
background: no-repeat center center scroll;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#e107fullpagecarousel .carousel-item {
height: 100vh;
min-height: 300px;
background: no-repeat center center scroll;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-color: #272B30;
color: white;
}
ul.social-buttons li a {
font-size: 20px;
line-height: 50px;
display: block;
width: 50px;
height: 50px;
-webkit-transition: all .3s;
transition: all .3s;
color: #fff;
border-radius: 100%;
outline: 0;
background-color: #212529;
}
/* fix for comment avatar */
.rounded-circle img.rounded {
border-radius: 50%!important;
}
@media (min-width: 768px) {
.offset1 {
margin-left: 8.33333%;
}
}
.list-group-item.active a {
z-index: 2;
color: #fff;
background-color: #007bff;
border-color: #007bff;
}
/* fix for caret bootstrap user nav */
.profile-photo-small {
display: inline;
}
/* fix for fixed-top on login page - to save custom header */
.layout-singlelogin .fixed-top {
position: initial;
}
/* fix for too small core login box width */
#login-template {
max-width: 95%;
}
@media (min-width: 768px) {
#login-template {
max-width: 500px;
margin-right: auto;
margin-left: auto;
}
}
/* fix for too big margin */
#login-template .login-page-footer {
margin-bottom: initial;
}
/* */
.jumbotron {
padding: 2rem 1rem;
margin-bottom: 2rem;
background-color: #e9ecef;
border-radius: .3rem;
}
/* CUSTOM Responsive Styles */

62
e107_themes/bootstrap5/theme.html Normal file
View File

@ -0,0 +1,62 @@
<body id="page-top" class="{LAYOUT_ID}" {BODY_ONLOAD} >
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="{SITEURL}">{SITENAME}</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
{NAVIGATION: type=main&class=me-auto}
{SIGNIN}
</div>
</div>
</nav>
<!--- Optional custom header template controlled by theme_shortcodes -->
{---HEADER---}
<!-- Page Content -->
{---LAYOUT---}
<!-- Footer -->
{SETSTYLE=footer}
<footer class="footer py-4 bg-dark text-white">
<div class="container">
<div class="content">
<div class="row">
<div class="col-md-3">
<h4>Navigation</h4>
{NAVIGATION: type=main&layout=alt}
{MENUAREA=10}
</div>
<div class="col-md-3">
<h4>Follow Us</h4>
{XURL_ICONS: template=footer}
{MENUAREA=11}
</div>
<div class="col-md-3">
{MENUAREA=12}
</div>
<div class="col-md-3">
{MENUAREA=13}
</div>
</div>
</div>
<hr>
<div class="container">{NAVIGATION: type=main&layout=footer}</div>
<div class="container">
<p class="m-0 text-center text-white">{SITEDISCLAIMER}</p>
</div>
<!-- /.container -->
</div>
</footer>
<!--- Optional custom footer template controlled by theme_shortcodes -->
{---FOOTER---}
{---MODAL---}
<!-- Javascripts and other information are automatically added below here -->
</body> <!-- This tag is not necessary and is ignored and replaced. Left here only as a reference -->

235
e107_themes/bootstrap5/theme.php Normal file
View File

@ -0,0 +1,235 @@
<?php
if(!defined('e107_INIT'))
{
exit();
}
class theme implements e_theme_render
{
public function init()
{
e107::lan('theme');
e107::meta('viewport', 'width=device-width, initial-scale=1.0'); // added to <head>
// e107::link('rel="preload" href="{THEME}fonts/myfont.woff2?v=2.2.0" as="font" type="font/woff2" crossorigin'); // added to <head>
//e107::meta('apple-mobile-web-app-capable','yes');
$bootswatch = e107::pref('theme', 'bootswatch', false);
if($bootswatch) {
e107::css('url', 'https://bootswatch.com/4/' . $bootswatch . '/bootstrap.min.css');
e107::css('url', 'https://bootswatch.com/4/' . $bootswatch . '/bootstrap.min.css');
}
$inlinecss = e107::pref('theme', 'inlinecss', false);
if($inlinecss)
{
e107::css("inline", $inlinecss);
}
$inlinejs = e107::pref('theme', 'inlinejs');
if($inlinejs)
{
e107::js("footer-inline", $inlinejs);
}
e107::js("theme", 'custom.js', 'jquery');
$login_iframe = e107::pref('theme', 'login_iframe', false);
//XXX FIXME - e_IFRAME cannot be redefined.
if (THEME_LAYOUT == "singlelogin" && $login_iframe)
{
define('e_IFRAME', '0');
}
if (THEME_LAYOUT == "singlesignup" && $login_iframe)
{
define('e_IFRAME', '0');
}
}
/**
* @param string $text
* @return string without p tags added always with bbcodes
* note: this solves W3C validation issue and CSS style problems
* use this carefully, mainly for custom menus, let decision on theme developers
*/
function remove_ptags($text = '') // FIXME this is a bug in e107 if this is required.
{
$text = str_replace(array("<!-- bbcode-html-start --><p>", "</p><!-- bbcode-html-end -->"), "", $text);
return $text;
}
function tablestyle($caption, $text, $mode='', $options = array())
{
$style = varset($options['setStyle'], 'default');
// Override style based on mode.
switch($mode)
{
case 'wmessage':
case 'wm':
$style = 'wmessage';
break;
case "login_page":
case "fpw":
case "coppa":
case "signup":
$style = 'splash';
break;
}
echo "\n<!-- tablestyle initial: style=" . $style . " mode=" . $mode . " UniqueId=" . varset($options['uniqueId']) . " -->\n\n";
if($style === 'listgroup' && empty($options['list']))
{
$style = 'cardmenu';
}
if($style === 'cardmenu' && !empty($options['list']))
{
$style = 'listgroup';
}
/* Changing card look via prefs */
if(!e107::pref('theme', 'cardmenu_look') && $style == 'cardmenu')
{
$style = 'menu';
}
// echo "\n<!-- tablestyle: style=" . $style . " mode=" . $mode . " UniqueId=" . varset($options['uniqueId']) . " -->\n\n";
if(deftrue('e_DEBUG'))
{
echo "\n<!-- \n";
echo json_encode($options, JSON_PRETTY_PRINT);
echo "\n-->\n\n";
}
switch($style)
{
case 'wmessage':
echo '<div class="jumbotron"><div class="container text-center">';
if(!empty($caption))
{
echo '<h1 class="display-4">'.$caption.'</h1>';
}
echo '<p class="lead">'.$this->remove_ptags($text).'</p>';
echo '</div></div>';
break;
case 'bare':
echo $this->remove_ptags($text);
break;
case 'nocaption':
case 'main':
echo $text;
break;
case 'menu':
echo '<div class=" mb-4">';
if(!empty($caption))
{
echo '<h5 >' . $caption . '</h5>';
}
echo $text;
echo '</div>';
break;
case 'cardmenu':
echo '<div class="card mb-4">';
if(!empty($caption))
{
echo '<h5 class="card-header">' . $caption . '</h5>';
}
echo '<div class="card-body">';
echo $text;
echo '</div>
</div>';
break;
case 'listgroup':
echo '<div class="card mb-4">';
if(!empty($caption))
{
echo '<h5 class="card-header">' . $caption . '</h5>';
}
echo $text;
if(!empty($options['footer'])) // XXX @see news-months menu.
{
echo '<div class="card-footer">
'.$options['footer'].'
</div>';
}
echo '</div>';
break;
case 'splash':
echo '<div class="container justify-content-center text-center my-5" id="'.$mode.'">
<div class="row align-items-center">
<div class="card card-signin col-md-6 offset-md-3 " id="login-template"><div class="card-body">';
if(!empty($caption))
{
echo '<h5 class="card-title text-center">' . $caption . '</h5>';
}
echo $text;
if(!empty($options['footer'])) // XXX @see news-months menu.
{
echo '<div class="card-footer">
'.$options['footer'].'
</div>';
}
echo '</div></div>
</div></div>';
break;
default:
// default style
// only if this always work, play with different styles
if(!empty($caption))
{
echo '<h4>' . $caption . '</h4>';
}
echo $text;
return;
}
}
}

47
e107_themes/bootstrap5/theme.xml Normal file
View File

@ -0,0 +1,47 @@
<?xml version="1.0" encoding="utf-8"?>
<e107Theme name="Bootstrap 5" version="1.0" date="2021-03-22" compatibility="2.3.1">
<author name ="e107 Inc" email="e107inc@something.com" url="http://e107.org" />
<summary>Bootstrap 5 basic theme</summary>
<description>A starter template for bootstrap5 themes.</description>
<category>generic</category>
<plugins>
<plugin name='social' url='core' />
<plugin name='featurebox' url='core' />
</plugins>
<keywords>
<word>bootstrap</word>
<word>clean</word>
<word>wireframe</word>
</keywords>
<libraries>
<library name="bootstrap" version="5" scope="front"/>
<library name="fontawesome" version="5" scope="front"/>
</libraries>
<stylesheets>
<css file="style.css" name="Default" />
</stylesheets>
<screenshots>
<image>preview_frontend.png</image>
</screenshots>
<layouts>
<layout name='home' title='Home Page' >
<custompages>FRONTPAGE</custompages>
</layout>
<layout name='full' title='Full Page' >
<custompages>forum/ download/</custompages>
</layout>
<layout name='sidebar_left' title='Sidebar (left)' />
<layout name='sidebar_right' title='Sidebar (right)' default='true' />
<layout name='splash' title='Splash Page' >
<custompages>login fpw signup</custompages>
</layout>
<layout name='bare' title='Bare Page' >
<custompages></custompages>
</layout>
</layouts>
<themePrefs>
<pref name='cardmenu_look'>1</pref>
<pref name='inlinecss'></pref>
<pref name='login_iframe'></pref>
</themePrefs>
</e107Theme>

69
e107_themes/bootstrap5/theme_config.php Normal file
View File

@ -0,0 +1,69 @@
<?php
if (!defined('e107_INIT')) { exit; }
$sitetheme = e107::getPref('sitetheme');
e107::themeLan('admin', $sitetheme, true);
class theme_config implements e_theme_config
{
function __construct()
{
}
function config()
{
// v2.2.2
$bootswatch = array(
"cerulean"=> 'Cerulean',
"cosmo"=> 'Cosmo',
"cyborg"=> 'Cyborg',
"darkly"=> 'Darkly',
"flatly"=> 'Flatly',
"journal"=> 'Journal',
"litera"=> 'Litera',
"lumen"=> 'Lumen',
"lux"=> 'Lux',
"materia"=> 'Materia',
"minty"=> 'Minty',
"pulse"=> 'Pulse',
"sandstone"=> 'Sandstone',
"simplex"=> 'Simplex',
"sketchy"=> 'sketchy',
"slate"=> 'Slate',
"solar"=> 'Solar',
"spacelab"=> 'Spacelab',
"superhero"=> 'Superhero',
"united"=> 'United',
"yeti"=> 'Yeti',
);
$previewLink = " <a class='btn btn-default btn-secondary e-modal' data-modal-caption=\"Use the 'Themes' menu to view the selection.\" href='http://bootswatch.com/default/'>".LAN_PREVIEW."</a>";
return array(
'bootswatch' => array('title'=>LAN_THEMEPREF_01, 'type'=>'dropdown', 'writeParms'=>array('optArray'=> $bootswatch, 'post'=>$previewLink, 'default'=>LAN_DEFAULT)),
'cardmenu_look' => array('title' => LAN_THEMEPREF_02, 'type'=>'boolean', 'writeParms'=>array(),'help'=>''),
'login_iframe' => array('title' => LAN_THEMEPREF_03, 'type'=>'boolean', 'writeParms'=>array(),'help'=>''),
);
}
function help()
{
return null;
}
function process()
{
return null;
}
}

144
e107_themes/bootstrap5/theme_shortcodes.php Normal file
View File

@ -0,0 +1,144 @@
<?php
/*
* e107 website system
*
* Copyright (C) 2008-2021 e107 Inc (e107.org)
* Released under the terms and conditions of the
* GNU General Public License (http://www.gnu.org/licenses/gpl.txt)
*
* e107 Bootstrap Theme Shortcodes.
*
*/
class theme_shortcodes extends e_shortcode
{
/**
* Special Header Shortcode for dynamic menuarea templates.
* @shortcode {---HEADER---}
* @return string
*/
function sc_header()
{
return "<!-- Dynamic Header template -->\n";
}
/**
* Special Footer Shortcode for dynamic menuarea templates.
* @shortcode {---FOOTER---}
* @return string
*/
function sc_footer()
{
return "<!-- Dynamic Footer template -->\n";
/*
return '
<footer class="footer py-4 bg-dark text-white">
<div class="container">
<div class="content">
<div class="row">
<div class="col-md-3"> <h4>Navigation</h4>{NAVIGATION: type=main&layout=alt}
{MENUAREA=14}
</div>
<div class="col-md-3"> <h4>Follow Us</h4>{XURL_ICONS: template=footer}
{MENUAREA=15}
</div>
<div class="col-md-3">
{MENUAREA=16}
</div>
<div class="col-md-3">
{MENUAREA=17}
</div>
</div>
</div>
<hr>
<div class="container"> {NAVIGATION: type=main&layout=footer} </div>
<div class="container">
<p class="m-0 text-center text-white">{SITEDISCLAIMER}</p>
</div>
<!-- /.container -->
</div>
</footer>';*/
}
/**
* Optional {---CAPTION---} processing.
* @shortcode {---CAPTION---}
* @return string
*/
function sc_caption($caption)
{
return $caption;
}
/**
* Will only function on the news page.
* @example {THEME_NEWS_BANNER: type=date}
* @example, {THEME_NEWS_BANNER: type=image}
* @example {THEME_NEWS_BANNER: type=author}
* @param null $parm
* @return string|null
*/
function sc_theme_news_banner($parm=null)
{
/** @var news_shortcodes $news */
$sc = e107::getScBatch('news');
$news = $sc->getScVar('news_item');
$ret = '';
$type = varset($parm['type']);
switch($type)
{
case "title":
$ret = $sc->sc_news_title();
break;
case "date":
$ret = $sc->sc_news_date();
break;
case "comment":
$ret = $sc->sc_news_comment_count();
break;
case "author":
$ret = $sc->sc_news_author();
break;
case "image":
default:
if(!empty($news['news_thumbnail']))
{
$tmp = explode(',', $news['news_thumbnail']);
$opts = array(
'w' => 1800,
'h' => null,
'crop' => false,
);
$ret = e107::getParser()->toImage($tmp[0], $opts);
}
}
return $ret;
}
}