Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2025-12-20 23:40:38 +01:00
Code Issues Packages Projects Releases Wiki Activity

plugins/rewards/widgets/skins/customize

Browse Source 
modal fixes
This commit is contained in:
Barış Soner Uşaklı
2022-09-07 20:36:32 -04:00
parent 48207bc2a2
commit 9f9c9c6a66
14 changed files with 314 additions and 176 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
public/scss/admin/admin.scss
View File

@@ -10,10 +10,9 @@
@import "./manage/tags"; @import "./manage/tags";
@import "./manage/groups"; @import "./manage/groups";
@import "./appearance/customise"; @import "./appearance/customise";
// @import "./appearance/themes"; @import "./extend/plugins";
// @import "./extend/plugins"; @import "./extend/rewards";
// @import "./extend/rewards"; @import "./extend/widgets";
// @import "./extend/widgets";
// @import "./advanced/database"; // @import "./advanced/database";
// @import "./advanced/events"; // @import "./advanced/events";
// @import "./advanced/logs"; // @import "./advanced/logs";
@@ -118,7 +117,7 @@ body {
box-shadow: 0px 1px 3px 0px rgba(165, 165, 165, 0.75); box-shadow: 0px 1px 3px 0px rgba(165, 165, 165, 0.75);
margin-bottom: 20px; margin-bottom: 20px;
.card-header { >.card-header {
@include acp-panel-heading; @include acp-panel-heading;
background: #fefefe; background: #fefefe;
color: #333; color: #333;
@@ -285,4 +284,14 @@ body {
form small { form small {
color: $gray-700; color: $gray-700;
}
.caret {
display: inline-block;
width: 0;
height: 0;
vertical-align: middle;
border-top: 4px dashed;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
} }

58
public/scss/admin/extend/plugins.scss Normal file
View File

@@ -0,0 +1,58 @@
.plugins {
padding-left: 0px;
li {
list-style-type: none;
background: rgba(64, 64, 64, 0.05);
padding: 1em;
margin-bottom: 5px;
border-left: 5px solid #08c;
margin-left: -40px;
h2 {
font-size: 16px;
margin: 0;
}
p {
font-size: 12px;
}
}
.plugin-list.ui-sortable {
li {
cursor: pointer;
.fa-chevron-up {
margin-right: 10px;
}
.fa-chevron-up, .fa-chevron-down {
border: 1px solid;
border-radius: 50%;
padding: 3px;
vertical-align: 1px;
background-color: white;
}
&:first-child .fa-chevron-up, &:last-child .fa-chevron-down {
pointer-events: none;
color: $gray-300;
}
}
}
.controls .btn {
display: list-item;
width: 150px;
margin-bottom: 3px;
margin-left: 10px;
}
.acp-sidebar {
.mdl-switch__label {
margin-left: 24px;
display: block;
left: 0;
}
}
}

45
public/scss/admin/extend/rewards.scss Normal file
View File

@@ -0,0 +1,45 @@
#rewards {
ul {
list-style-type: none;
padding: 0px;
margin: 0px;
> li {
border-bottom: 1px solid #ddd;
margin-bottom: 20px;
&:last-child {
border-bottom: 0;
}
}
}
.rewards { width: 100%; }
.card {
border-radius: 2px;
border-width: 2px;
color: #333;
&.if-block {
border-color: $primary;
max-width: 33%;
}
&.this-block {
border-color: $warning;
max-width: 33%;
}
&.then-block {
border-color: $success;
max-width: 33%;
}
&.reward-block {
border-color: $success;
background-color: lighten($success, 15%);
color: #fff;
a, select, input { color: #fff; }
select > option { color: #333; }
width: 100%;
min-height: 110px;
}
}
}

28
public/scss/admin/extend/widgets.scss Normal file
View File

@@ -0,0 +1,28 @@
.page-admin-extend.page-admin-widgets {
[component="clone"] {
display: flex;
align-items: stretch;
align-content: stretch;
[component="clone/button"] {
flex-grow: 1;
text-align: left;
}
.dropdown-menu {
max-height: 300px;
overflow-y: scroll;
min-width: 250px;
border-radius: 0;
}
}
.container-hover {
.container-html {
// border: 1px solid red!important;
@extend .border;
@extend .border-2;
@extend .border-primary;
}
}
}

13
public/src/admin/appearance/skins.js
View File

@@ -8,7 +8,7 @@ define('admin/appearance/skins', ['translator', 'alerts'], function (translator,
// Populate skins from Bootswatch API // Populate skins from Bootswatch API
$.ajax({ $.ajax({
method: 'get', method: 'get',
url: 'https://bootswatch.com/api/3.json', url: 'https://bootswatch.com/api/5.json',
}).done(Skins.render); }).done(Skins.render);
$('#skins').on('click', function (e) { $('#skins').on('click', function (e) {
@@ -69,12 +69,11 @@ define('admin/appearance/skins', ['translator', 'alerts'], function (translator,
}, function (html) { }, function (html) {
themeContainer.html(html); themeContainer.html(html);
if (config['theme:src']) { if (app.config.bootswatchSkin) {
const skin = config['theme:src'] const skin = app.config.bootswatchSkin;
.match(/latest\/(\S+)\/bootstrap.min.css/)[1] highlightSelectedTheme(
.replace(/(^|\s)([a-z])/g, function (m, p1, p2) { return p1 + p2.toUpperCase(); }); skin.charAt(0).toUpperCase() + skin.slice(1)
);
highlightSelectedTheme(skin);
} }
}); });
}; };

4
public/src/admin/extend/plugins.js
View File

@@ -21,6 +21,10 @@ define('admin/extend/plugins', [
return; return;
} }
if (window.location.hash) {
$(`.nav-pills button[data-bs-target="${window.location.hash}"]`).trigger('click');
}
const searchInputEl = document.querySelector('#plugin-search'); const searchInputEl = document.querySelector('#plugin-search');
searchInputEl.value = ''; searchInputEl.value = '';

20
public/src/admin/extend/widgets.js
View File

@@ -12,13 +12,13 @@ define('admin/extend/widgets', [
const Widgets = {}; const Widgets = {};
Widgets.init = function () { Widgets.init = function () {
$('#widgets .nav-pills .dropdown-menu a').on('click', function (ev) { $('#widgets .dropdown .dropdown-menu a').on('click', function (ev) {
const $this = $(this); const $this = $(this);
$('#widgets .tab-pane').removeClass('active'); $('#widgets .tab-pane').removeClass('active');
const templateName = $this.attr('data-template'); const templateName = $this.attr('data-template');
$('#widgets .tab-pane[data-template="' + templateName + '"]').addClass('active'); $('#widgets .tab-pane[data-template="' + templateName + '"]').addClass('active');
$('#widgets .selected-template').text(templateName); $('#widgets .selected-template').text(templateName);
$('#widgets .nav-pills .dropdown').trigger('click'); $('#widgets .dropdown').trigger('click');
ev.preventDefault(); ev.preventDefault();
return false; return false;
}); });
@@ -73,9 +73,9 @@ define('admin/extend/widgets', [
panel.remove(); panel.remove();
} }
}); });
}).on('mouseup', '> .panel > .panel-heading', function (evt) { }).on('mouseup', '> .card > .card-header', function (evt) {
if (!($(this).parent().is('.ui-sortable-helper') || $(evt.target).closest('.delete-widget').length)) { if (!($(this).parent().is('.ui-sortable-helper') || $(evt.target).closest('.delete-widget').length)) {
$(this).parent().children('.panel-body').toggleClass('hidden'); $(this).parent().children('.card-body').toggleClass('hidden');
} }
}); });
@@ -176,13 +176,13 @@ define('admin/extend/widgets', [
drop: function (event, ui) { drop: function (event, ui) {
const el = $(this); const el = $(this);
el.find('.panel-body .container-html').val(ui.draggable.attr('data-container-html')); el.find('.card-body .container-html').val(ui.draggable.attr('data-container-html'));
el.find('.panel-body').removeClass('hidden'); el.find('.card-body').removeClass('hidden');
}, },
hoverClass: 'panel-info', hoverClass: 'container-hover',
}) })
.children('.panel-heading') .children('.card-header')
.append('<div class="pull-right pointer"><span class="delete-widget"><i class="fa fa-times-circle"></i></span></div><div class="pull-left pointer"><span class="toggle-widget"><i class="fa fa-chevron-circle-down"></i></span>&nbsp;</div>') .append('<div class="float-end pointer"><span class="delete-widget"><i class="fa fa-times-circle"></i></span></div><div class="float-start pointer"><span class="toggle-widget"><i class="fa fa-chevron-circle-down"></i></span>&nbsp;</div>')
.children('small') .children('small')
.html(''); .html('');
} }
@@ -191,7 +191,7 @@ define('admin/extend/widgets', [
function loadWidgetData() { function loadWidgetData() {
function populateWidget(widget, data) { function populateWidget(widget, data) {
if (data.title) { if (data.title) {
const title = widget.find('.panel-heading strong'); const title = widget.find('.card-header strong');
title.text(title.text() + ' - ' + data.title); title.text(title.text() + ' - ' + data.title);
} }

20
src/views/admin/appearance/customise.tpl
View File

@@ -1,12 +1,12 @@
<div id="customise" class="customise"> <div id="customise" class="customise">
<ul class="nav nav-pills"> <ul class="nav nav-pills mb-3">
<li class="active"><a href="#custom-css" data-toggle="tab">[[admin/appearance/customise:custom-css]]</a></li> <li class="nav-item"><a class="nav-link active" href="#custom-css" data-bs-toggle="tab">[[admin/appearance/customise:custom-css]]</a></li>
<li><a href="#custom-js" data-toggle="tab">[[admin/appearance/customise:custom-js]]</a></li> <li class="nav-item"><a class="nav-link" href="#custom-js" data-bs-toggle="tab">[[admin/appearance/customise:custom-js]]</a></li>
<li><a href="#custom-header" data-toggle="tab">[[admin/appearance/customise:custom-header]]</a></li> <li class="nav-item"><a class="nav-link" href="#custom-header" data-bs-toggle="tab">[[admin/appearance/customise:custom-header]]</a></li>
</ul> </ul>
<br />
<div class="tab-content"> <div class="tab-content">
<div class="tab-pane fade active in" id="custom-css"> <div class="tab-pane fade show active" id="custom-css">
<p> <p>
[[admin/appearance/customise:custom-css.description]] [[admin/appearance/customise:custom-css.description]]
</p> </p>
@@ -15,7 +15,7 @@
<br /> <br />
<form class="form"> <form class="form">
<div class="form-group"> <div class="mb-3">
<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="useCustomCSS"> <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="useCustomCSS">
<input class="mdl-switch__input" id="useCustomCSS" type="checkbox" data-field="useCustomCSS" /> <input class="mdl-switch__input" id="useCustomCSS" type="checkbox" data-field="useCustomCSS" />
<span class="mdl-switch__label">[[admin/appearance/customise:custom-css.enable]]</span> <span class="mdl-switch__label">[[admin/appearance/customise:custom-css.enable]]</span>
@@ -33,7 +33,7 @@
<br /> <br />
<form class="form"> <form class="form">
<div class="form-group"> <div class="mb-3">
<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="useCustomJS"> <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="useCustomJS">
<input class="mdl-switch__input" id="useCustomJS" type="checkbox" data-field="useCustomJS" /> <input class="mdl-switch__input" id="useCustomJS" type="checkbox" data-field="useCustomJS" />
<span class="mdl-switch__label">[[admin/appearance/customise:custom-js.enable]]</span> <span class="mdl-switch__label">[[admin/appearance/customise:custom-js.enable]]</span>
@@ -52,7 +52,7 @@
<br /> <br />
<form class="form"> <form class="form">
<div class="form-group"> <div class="mb-3">
<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="useCustomHTML"> <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="useCustomHTML">
<input class="mdl-switch__input" id="useCustomHTML" type="checkbox" data-field="useCustomHTML" /> <input class="mdl-switch__input" id="useCustomHTML" type="checkbox" data-field="useCustomHTML" />
<span class="mdl-switch__label">[[admin/appearance/customise:custom-header.enable]]</span> <span class="mdl-switch__label">[[admin/appearance/customise:custom-header.enable]]</span>
@@ -62,7 +62,7 @@
</div> </div>
<form class="form"> <form class="form">
<div class="form-group"> <div class="mb-3">
<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="enableLiveReload"> <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="enableLiveReload">
<input class="mdl-switch__input" id="enableLiveReload" type="checkbox" data-field="enableLiveReload" checked /> <input class="mdl-switch__input" id="enableLiveReload" type="checkbox" data-field="enableLiveReload" checked />
<span class="mdl-switch__label"> <span class="mdl-switch__label">

127
src/views/admin/extend/plugins.tpl
View File

@@ -1,81 +1,44 @@
{{{ if !canChangeState }}} {{{ if !canChangeState }}}
<div class="alert alert-warning">[[error:plugins-set-in-configuration]]</div> <div class="alert alert-warning">[[error:plugins-set-in-configuration]]</div>
{{{ end }}} {{{ end }}}
<ul class="nav nav-pills"> <ul class="nav nav-pills mb-3">
<li> <li class="nav-item">
<a href="#trending" data-toggle="tab"> <button class="nav-link" data-bs-target="#trending" data-bs-toggle="tab">
[[admin/extend/plugins:trending]] [[admin/extend/plugins:trending]]
<i class="fa fa-star"></i> <i class="fa fa-star"></i>
</a> </button>
</li> </li>
<li class="active"> <li class="nav-item">
<a href="#installed" data-toggle="tab"> <button class="nav-link active" data-bs-target="#installed" data-bs-toggle="tab">
[[admin/extend/plugins:installed]] [[admin/extend/plugins:installed]]
<span class="badge">{installedCount}</span> <span class="badge bg-light">{installedCount}</span>
</a> </button>
</li> </li>
<li> <li class="nav-item">
<a href="#active" data-toggle="tab"> <button class="nav-link" data-bs-target="#active" data-bs-toggle="tab">
[[admin/extend/plugins:active]] [[admin/extend/plugins:active]]
<span class="badge">{activeCount}</span> <span class="badge bg-light">{activeCount}</span>
</a> </button>
</li> </li>
<li> <li class="nav-item">
<a href="#deactive" data-toggle="tab"> <button class="nav-link" data-bs-target="#deactive" data-bs-toggle="tab">
[[admin/extend/plugins:inactive]] [[admin/extend/plugins:inactive]]
<span class="badge">{inactiveCount}</span> <span class="badge bg-light">{inactiveCount}</span>
</a> </button>
</li> </li>
<li> <li class="nav-item">
<a href="#upgrade" data-toggle="tab"> <button class="nav-link" data-bs-target="#upgrade" data-bs-toggle="tab">
[[admin/extend/plugins:out-of-date]] [[admin/extend/plugins:out-of-date]]
<span class="badge">{upgradeCount}</span> <span class="badge bg-light">{upgradeCount}</span>
</a> </button>
</li> </li>
<li> <li class="nav-item">
<a href="#download" data-toggle="tab">[[admin/extend/plugins:find-plugins]]</a> <button class="nav-link" data-bs-target="#download" data-bs-toggle="tab">[[admin/extend/plugins:find-plugins]]</button>
</li> </li>
</ul> </ul>
<br />
<div class="plugins row"> <div class="plugins row">
<div class="acp-sidebar col-lg-3 col-lg-push-9"> <div class="col-lg-9">
<div class="panel panel-default">
<div class="panel-heading">[[admin/extend/plugins:plugin-search]]</div>
<div class="panel-body">
<input autofocus class="form-control" type="text" id="plugin-search" placeholder="[[admin/extend/plugins:plugin-search-placeholder]]"/><br/>
</div>
</div>
<div class="panel panel-default">
<div class="panel-body">
<div class="checkbox">
<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
<input id="plugin-submit-usage" class="mdl-switch__input" type="checkbox" data-field="submitPluginUsage" <!-- IF submitPluginUsage -->checked<!-- ENDIF submitPluginUsage -->/>
<span class="mdl-switch__label">[[admin/extend/plugins:submit-anonymous-usage]]</span>
</label>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">[[admin/extend/plugins:reorder-plugins]]</div>
<div class="panel-body">
<button class="btn btn-default btn-block" id="plugin-order"><i class="fa fa-exchange"></i> [[admin/extend/plugins:order-active]]</button>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">[[admin/extend/plugins:dev-interested]]</div>
<div class="panel-body">
<p>
[[admin/extend/plugins:docs-info]]
</p>
</div>
</div>
</div>
<div class="col-lg-9 col-lg-pull-3">
<div class="tab-content"> <div class="tab-content">
<div class="tab-pane fade" id="trending"> <div class="tab-pane fade" id="trending">
<!-- IMPORT admin/partials/plugins/no-plugins.tpl --> <!-- IMPORT admin/partials/plugins/no-plugins.tpl -->
@@ -85,7 +48,7 @@
{{{ end }}} {{{ end }}}
</ul> </ul>
</div> </div>
<div class="tab-pane fade active in" id="installed"> <div class="tab-pane fade show active" id="installed">
<!-- IMPORT admin/partials/plugins/no-plugins.tpl --> <!-- IMPORT admin/partials/plugins/no-plugins.tpl -->
<ul class="installed"> <ul class="installed">
<!-- BEGIN installed --> <!-- BEGIN installed -->
@@ -116,11 +79,47 @@
</div> </div>
</div> </div>
<div class="acp-sidebar col-lg-3">
<div class="card">
<div class="card-header">[[admin/extend/plugins:plugin-search]]</div>
<div class="card-body">
<input autofocus class="form-control" type="text" id="plugin-search" placeholder="[[admin/extend/plugins:plugin-search-placeholder]]"/><br/>
</div>
</div>
<div class="card">
<div class="card-body">
<div class="checkbox">
<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
<input id="plugin-submit-usage" class="mdl-switch__input" type="checkbox" data-field="submitPluginUsage" <!-- IF submitPluginUsage -->checked<!-- ENDIF submitPluginUsage -->/>
<span class="mdl-switch__label">[[admin/extend/plugins:submit-anonymous-usage]]</span>
</label>
</div>
</div>
</div>
<div class="card">
<div class="card-header">[[admin/extend/plugins:reorder-plugins]]</div>
<div class="card-body d-grid">
<button class="btn btn-outline-secondary" id="plugin-order">[[admin/extend/plugins:order-active]]</button>
</div>
</div>
<div class="card">
<div class="card-header">[[admin/extend/plugins:dev-interested]]</div>
<div class="card-body">
<p>
[[admin/extend/plugins:docs-info]]
</p>
</div>
</div>
</div>
<div class="modal fade" id="order-active-plugins-modal"> <div class="modal fade" id="order-active-plugins-modal">
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">[[admin/extend/plugins:order-active]]</h4> <h4 class="modal-title">[[admin/extend/plugins:order-active]]</h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
@@ -133,14 +132,12 @@
<ul class="plugin-list"></ul> <ul class="plugin-list"></ul>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">[[global:buttons.close]]</button> <button type="button" class="btn btn-default" data-bs-dismiss="modal">[[global:buttons.close]]</button>
<button type="button" class="btn btn-primary" id="save-plugin-order">[[global:save]]</button> <button type="button" class="btn btn-primary" id="save-plugin-order">[[global:save]]</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>

42
src/views/admin/extend/rewards.tpl
View File

@@ -4,34 +4,34 @@
{{{ each active }}} {{{ each active }}}
<li data-rid="{active.rid}" data-id="{active.id}"> <li data-rid="{active.rid}" data-id="{active.id}">
<div class="row"> <div class="row">
<div class="col-xs-12 col-sm-12 col-lg-8"> <div class="col-12 col-lg-8">
<form class="main inline-block"> <form class="main d-inline-block">
<div class="well inline-block if-block"> <div class="card card-body d-inline-block if-block">
<label for="condition-if-users">[[admin/extend/rewards:condition-if-users]]</label><br /> <label class="form-label" for="condition-if-users">[[admin/extend/rewards:condition-if-users]]</label>
<select id="condition-if-users" class="form-control" name="condition" data-selected="{active.condition}"> <select id="condition-if-users" class="form-select" name="condition" data-selected="{active.condition}">
{{{ each conditions }}} {{{ each conditions }}}
<option value="{conditions.condition}">{conditions.name}</option> <option value="{conditions.condition}">{conditions.name}</option>
{{{ end }}} {{{ end }}}
</select> </select>
</div> </div>
<div class="well inline-block this-block"> <div class="card card-body d-inline-block this-block">
<label for="condition-is">[[admin/extend/rewards:condition-is]]</label><br /> <label class="form-label" for="condition-is">[[admin/extend/rewards:condition-is]]</label>
<div class="row"> <div class="row">
<div class="col-xs-4"> <div class="col-4">
<select id="condition-is" class="form-control" name="conditional" data-selected="{active.conditional}"> <select id="condition-is" class="form-select" name="conditional" data-selected="{active.conditional}">
{{{ each conditionals }}} {{{ each conditionals }}}
<option value="{conditionals.conditional}">{conditionals.name}</option> <option value="{conditionals.conditional}">{conditionals.name}</option>
{{{ end }}} {{{ end }}}
</select> </select>
</div> </div>
<div class="col-xs-8"> <div class="col-8">
<input class="form-control" type="text" name="value" value="{active.value}" /> <input class="form-control" type="text" name="value" value="{active.value}" />
</div> </div>
</div> </div>
</div> </div>
<div class="well inline-block then-block"> <div class="card card-body d-inline-block then-block">
<label for="condition-then">[[admin/extend/rewards:condition-then]]</label><br /> <label class="form-label" for="condition-then">[[admin/extend/rewards:condition-then]]</label>
<select id="condition-then" class="form-control" name="rid" data-selected="{active.rid}"> <select id="condition-then" class="form-select" name="rid" data-selected="{active.rid}">
<!-- BEGIN ../../rewards --> <!-- BEGIN ../../rewards -->
<option value="{rewards.rid}">{rewards.name}</option> <option value="{rewards.rid}">{rewards.name}</option>
<!-- END ../../rewards --> <!-- END ../../rewards -->
@@ -39,24 +39,24 @@
</div> </div>
</form> </form>
</div> </div>
<div class="col-xs-12 col-sm-12 col-lg-4"> <div class="col-12 col-lg-4">
<form class="rewards inline-block"> <form class="rewards d-inline-block">
<div class="inputs well inline-block reward-block"></div> <div class="inputs card card-body d-inline-block reward-block"></div>
</form> </form>
</div> </div>
</div> </div>
<div class="pull-left"> <div class="float-start">
<div class="panel-body inline-block"> <div class="card-body d-inline-block">
<form class="main"> <form class="main">
<label for="claimable">[[admin/extend/rewards:max-claims]] <small>[[admin/extend/rewards:zero-infinite]]</small></label><br /> <label class="form-label" for="claimable">[[admin/extend/rewards:max-claims]] <small>[[admin/extend/rewards:zero-infinite]]</small></label>
<input id="claimable" class="form-control" type="text" name="claimable" value="{active.claimable}" placeholder="1" /> <input id="claimable" class="form-control" type="text" name="claimable" value="{active.claimable}" placeholder="1" />
</form> </form>
</div> </div>
</div> </div>
<div class="pull-right"> <div class="float-end">
<div class="panel-body inline-block"> <div class="card-body d-inline-block">
<button class="btn btn-danger delete">[[admin/extend/rewards:delete]]</button> <button class="btn btn-danger delete">[[admin/extend/rewards:delete]]</button>
<!-- IF active.disabled --> <!-- IF active.disabled -->
<button class="btn btn-success toggle">[[admin/extend/rewards:enable]]</button> <button class="btn btn-success toggle">[[admin/extend/rewards:enable]]</button>

84
src/views/admin/extend/widgets.tpl
View File

@@ -1,28 +1,25 @@
<div id="widgets" class="row"> <div id="widgets" class="row">
<div class="col-md-8" id="active-widgets"> <div class="col-md-8" id="active-widgets">
<ul class="nav nav-pills"> <div class="dropdown mb-3">
<button class="btn btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
<li role="presentation" class="dropdown"> <span class="selected-template">{templates.0.template}</span> <span class="caret"></span>
<a class="dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> </button>
<span class="selected-template">{templates.0.template}</span> <span class="caret"></span> <ul class="dropdown-menu">
</a> {{{ each templates }}}
<ul class="dropdown-menu"> <li><a class="dropdown-item" href="#" data-template="{../template}" data-toggle="pill">{../template}</a></li>
{{{ each templates }}} {{{ end }}}
<li><a class="dropdown-item" href="#" data-template="{../template}" data-toggle="pill">{../template}</a></li> </ul>
{{{ end }}} </div>
</ul>
</li>
</ul>
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-12">
<div class="tab-content"> <div class="tab-content">
{{{ each templates }}} {{{ each templates }}}
<div class="tab-pane <!-- IF @first -->active<!-- ENDIF @first -->" data-template="{../template}"> <div class="tab-pane <!-- IF @first -->active<!-- ENDIF @first -->" data-template="{../template}">
{{{ each templates.areas }}} {{{ each templates.areas }}}
<div class="area" data-template="{templates.template}" data-location="{../location}"> <div class="area" data-template="{templates.template}" data-location="{../location}">
<h4>{../name} <small>{templates.template} / {../location}</small></h4> <h4>{../name} <small>{templates.template} / {../location}</small></h4>
<div class="well widget-area"> <div class="card card-body text-bg-light widget-area">
</div> </div>
</div> </div>
@@ -35,9 +32,9 @@
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<div class="panel panel-default"> <div class="card mb-3">
<div class="panel-heading">[[admin/extend/widgets:available]]</div> <div class="card-header">[[admin/extend/widgets:available]]</div>
<div class="panel-body"> <div class="card-body">
<div class="available-widgets"> <div class="available-widgets">
<p>[[admin/extend/widgets:explanation]]</p> <p>[[admin/extend/widgets:explanation]]</p>
<!-- IF !availableWidgets.length --> <!-- IF !availableWidgets.length -->
@@ -52,13 +49,13 @@
</p> </p>
<div class="row"> <div class="row">
<!-- BEGIN availableWidgets --> <!-- BEGIN availableWidgets -->
<div class="col-xs-12"> <div class="col-12">
<div data-widget="{availableWidgets.widget}" class="panel widget-panel panel-default pointer hide"> <div data-widget="{availableWidgets.widget}" class="card widget-panel pointer hide">
<div class="panel-heading"> <div class="card-header">
<strong>{availableWidgets.name}</strong> <strong>{availableWidgets.name}</strong>
<small><br />{availableWidgets.description}</small> <small><br />{availableWidgets.description}</small>
</div> </div>
<div class="panel-body hidden"> <div class="card-body hidden">
<form> <form>
{availableWidgets.content} {availableWidgets.content}
</form> </form>
@@ -73,7 +70,7 @@
<button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown"> <button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown">
<span class="caret"></span> <span class="caret"></span>
</button> </button>
<ul class="dropdown-menu pull-right"> <ul class="dropdown-menu dropdown-menu-end">
<!-- BEGIN templates --> <!-- BEGIN templates -->
<!-- IF !@first --> <!-- IF !@first -->
<li><a class="dropdown-item" href="#">{templates.template}</a></li> <li><a class="dropdown-item" href="#">{templates.template}</a></li>
@@ -84,39 +81,40 @@
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default">
<div class="panel-heading">[[admin/extend/widgets:containers.available]]</div> <div class="card">
<div class="panel-body"> <div class="card-header">[[admin/extend/widgets:containers.available]]</div>
<div class="card-body">
<p>[[admin/extend/widgets:containers.explanation]]</p> <p>[[admin/extend/widgets:containers.explanation]]</p>
<div class="available-containers"> <div class="available-containers">
<div class="containers"> <div class="containers">
<div class="pointer" style="padding: 20px; border: 1px dotted #dedede; margin-bottom: 20px;" data-container-html=" "> <div class="pointer" style="padding: 20px; border: 1px dotted #dedede; margin-bottom: 20px;" data-container-html=" ">
[[admin/extend/widgets:containers.none]] [[admin/extend/widgets:containers.none]]
</div> </div>
<div class="well pointer" data-container-html='<div class="well">\{{body}}</div>'> <div class="card card-body bg-light rounded-0 border-0 shadow-none mb-3 pointer" data-container-html='<div class="card card-body bg-light rounded-0 border-0 shadow-none mb-3">\{{body}}</div>'>
[[admin/extend/widgets:container.well]] [[admin/extend/widgets:container.well]]
</div> </div>
<div class="jumbotron pointer" data-container-html='<div class="jumbotron">\{{body}}</div>'> <div class="card card-body bg-light rounded-0 border-0 shadow-none p-5 mb-3 pointer" data-container-html='<div class="card card-body bg-light rounded-0 border-0 shadow-none p-5 mb-3">\{{body}}</div>'>
[[admin/extend/widgets:container.jumbotron]] [[admin/extend/widgets:container.jumbotron]]
</div> </div>
<div class="panel" data-container-html='<div class="panel panel-default"><div class="panel-body">\{{body}}</div></div>'> <div class="card mb-3" data-container-html='<div class="card"><div class="card-body">\{{body}}</div></div>'>
<div class="panel-body pointer"> <div class="card-body pointer">
[[admin/extend/widgets:container.panel]] [[admin/extend/widgets:container.panel]]
</div> </div>
</div> </div>
<div class="panel panel-default pointer" data-container-html='<div class="panel panel-default"><div class="panel-heading"><h3 class="panel-title">\{{title}}</h3></div><div class="panel-body">\{{body}}</div></div>'> <div class="card mb-3 pointer" data-container-html='<div class="card"><h5 class="card-header">\{{title}}</h5><div class="card-body">\{{body}}</div></div>'>
<div class="panel-heading"> <div class="card-header">
[[admin/extend/widgets:container.panel-header]] [[admin/extend/widgets:container.panel-header]]
<div class="pull-right color-selector"> <div class="pull-right color-selector">
<button data-class="panel-default" class="btn btn-xs">&nbsp;&nbsp;</button> <button data-class="text-bg-primary" class="btn btn-sm btn-primary">&nbsp;&nbsp;</button>
<button data-class="panel-primary" class="btn btn-xs btn-primary">&nbsp;&nbsp;</button> <button data-class="" class="btn btn-sm btn-secondary">&nbsp;&nbsp;</button>
<button data-class="panel-success" class="btn btn-xs btn-success">&nbsp;&nbsp;</button> <button data-class="text-bg-success" class="btn btn-sm btn-success">&nbsp;&nbsp;</button>
<button data-class="panel-info" class="btn btn-xs btn-info">&nbsp;&nbsp;</button> <button data-class="text-bg-info" class="btn btn-sm btn-info">&nbsp;&nbsp;</button>
<button data-class="panel-warning" class="btn btn-xs btn-warning">&nbsp;&nbsp;</button> <button data-class="text-bg-warning" class="btn btn-sm btn-warning">&nbsp;&nbsp;</button>
<button data-class="panel-danger" class="btn btn-xs btn-danger">&nbsp;&nbsp;</button> <button data-class="text-bg-danger" class="btn btn-sm btn-danger">&nbsp;&nbsp;</button>
</div> </div>
</div> </div>
<div class="panel-body"> <div class="card-body">
[[admin/extend/widgets:container.panel-body]] [[admin/extend/widgets:container.panel-body]]
</div> </div>
</div> </div>
@@ -124,10 +122,10 @@
<div class="alert alert-info pointer" data-container-html='<div class="alert alert-info">\{{body}}</div>'> <div class="alert alert-info pointer" data-container-html='<div class="alert alert-info">\{{body}}</div>'>
[[admin/extend/widgets:container.alert]] [[admin/extend/widgets:container.alert]]
<div class="pull-right color-selector"> <div class="pull-right color-selector">
<button data-class="alert-success" class="btn btn-xs btn-success">&nbsp;&nbsp;</button> <button data-class="alert-success" class="btn btn-sm btn-success">&nbsp;&nbsp;</button>
<button data-class="alert-info" class="btn btn-xs btn-info">&nbsp;&nbsp;</button> <button data-class="alert-info" class="btn btn-sm btn-info">&nbsp;&nbsp;</button>
<button data-class="alert-warning" class="btn btn-xs btn-warning">&nbsp;&nbsp;</button> <button data-class="alert-warning" class="btn btn-sm btn-warning">&nbsp;&nbsp;</button>
<button data-class="alert-danger" class="btn btn-xs btn-danger">&nbsp;&nbsp;</button> <button data-class="alert-danger" class="btn btn-sm btn-danger">&nbsp;&nbsp;</button>
</div> </div>
</div> </div>
</div> </div>

4
src/views/admin/manage/groups.tpl
View File

@@ -65,7 +65,7 @@
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">[[admin/manage/groups:create]]</h4> <h4 class="modal-title">[[admin/manage/groups:create]]</h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
@@ -95,7 +95,7 @@
</form> </form>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal"> <button type="button" class="btn btn-default" data-bs-dismiss="modal">
[[global:close]] [[global:close]]
</button> </button>
<button type="button" class="btn btn-primary" id="create-modal-go"> <button type="button" class="btn btn-primary" id="create-modal-go">

22
src/views/admin/partials/theme_list.tpl
View File

@@ -1,22 +1,22 @@
<!-- BEGIN themes --> <!-- BEGIN themes -->
<div class="col-lg-4 col-md-6 col-sm-12 col-xs-12" data-type="{themes.type}" data-theme="{themes.id}"<!-- IF themes.css --> data-css="{themes.css}"<!-- ENDIF themes.css -->> <div class="col-lg-4 col-md-6 col-12 mb-4" data-type="{themes.type}" data-theme="{themes.id}"{{{ if themes.css }}} data-css="{themes.css}" {{{ end }}}>
<div class="theme-card mdl-card mdl-shadow--2dp"> <div class="card h-100">
<div class="mdl-card__title mdl-card--expand" style="background-image: url('{themes.screenshot_url}');"></div> <img src="{themes.screenshot_url}" class="card-img-top">
<div class="mdl-card__supporting-text"> <div class="card-body">
<h2 class="mdl-card__title-text">{themes.name}</h2> <h5 class="card-title">{themes.name}</h5>
<p> <p class="card-text">
{themes.description} {themes.description}
</p> </p>
<!-- IF themes.url --> {{{ if themes.url }}}
<p> <p>
<a href="{themes.url}" target="_blank">[[admin/appearance/themes:homepage]]</a> <a href="{themes.url}" target="_blank">[[admin/appearance/themes:homepage]]</a>
</p> </p>
<!-- ENDIF themes.url --> {{{ end }}}
</div> </div>
<div class="mdl-card__actions mdl-card--border"> <div class="card-footer">
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" data-action="use"> <a class="btn btn-primary" data-action="use">
<!-- IF themes.skin -->[[admin/appearance/skins:select-skin]]<!-- ELSE -->[[admin/appearance/themes:select-theme]]<!-- ENDIF themes.skin --> {{{ if themes.skin }}}[[admin/appearance/skins:select-skin]]{{{ else }}}[[admin/appearance/themes:select-theme]]{{{ end }}}
</a> </a>
</div> </div>
</div> </div>

4
src/views/modals/crop_picture.tpl
View File

@@ -2,7 +2,7 @@
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">×</button>
<h3 id="crop-picture">[[user:crop_picture]]</h3> <h3 id="crop-picture">[[user:crop_picture]]</h3>
</div> </div>
<div class="modal-body"> <div class="modal-body">
@@ -30,7 +30,7 @@
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Close</button> <button class="btn btn-default" data-bs-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-primary upload-btn <!-- IF !allowSkippingCrop -->hidden<!-- ENDIF !allowSkippingCrop -->">[[user:upload_picture]]</button> <button class="btn btn-primary upload-btn <!-- IF !allowSkippingCrop -->hidden<!-- ENDIF !allowSkippingCrop -->">[[user:upload_picture]]</button>
<button class="btn btn-primary crop-btn">[[user:upload_cropped_picture]]</button> <button class="btn btn-primary crop-btn">[[user:upload_cropped_picture]]</button>
</div> </div>