Skip to content

Commit

Permalink
issue #252: added bs4 list group settings
Browse files Browse the repository at this point in the history
  • Loading branch information
@YaWK
YaWK committed Aug 13, 2019
1 parent 52016ef commit f67c0aa
Show file tree
Hide file tree
Showing 2 changed files with 231 additions and 7 deletions.
226 changes: 225 additions & 1 deletion system/classes/bootstrap4.php
View file
Expand Up @@ -25,8 +25,10 @@ public function init()
$this->bs4_CardsCss();
// bootstrap 4 buttons
$this->bs4_ButtonsCss();
// bootstrap 4 buttons
// bootstrap 4 jumbotron
$this->bs4_JumbotronCss();
// bootstrap 4 list groups
$this->bs4_ListGroupCss();

// check if css code is set, not empty and correct type
if (isset($this->cssCode) && (is_string($this->cssCode) && (!empty($this->cssCode))))
Expand Down Expand Up @@ -739,5 +741,227 @@ public function bs4_JumbotronCss()
}
";
}

/**
* Bootstrap 4: LIST GROUP Component CSS Code
* @author Daniel Retzl <danielretzl@gmail.com>
* @version 1.0.0
* @link http://yawk.io
* @annotation add Bootstrap 4 list group component to this css code string
*/
public function bs4_ListGroupCss()
{
// list group css code
$this->cssCode .= "
/* LIST GROUP */
.list-group {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
padding-left: ".$this->tplSettings['listgroup-paddingLeft'].";
margin-bottom: ".$this->tplSettings['listgroup-marginBottom'].";
color: #".$this->tplSettings['listgroup-fontColor'].";
}
.list-group-item-action {
width: 100%;
color: #".$this->tplSettings['listgroup-fontColor'].";
text-align: inherit;
}
.list-group-item-action:hover, .list-group-item-action:focus {
color: #".$this->tplSettings['listgroup-fontColor'].";
text-decoration: none;
background-color: #f8f9fa;
}
.list-group-item-action:active {
color: #212529;
background-color: #e9ecef;
}
.list-group-item {
position: ".$this->tplSettings['listgroup-itemPosition'].";
display: ".$this->tplSettings['listgroup-itemDisplay'].";
padding: ".$this->tplSettings['listgroup-itemPadding'].";
margin-bottom: -1px;
background-color: #".$this->tplSettings['background-listgroup'].";
border: ".$this->tplSettings['listgroup-itemBorder'].";
}
.list-group-item:first-child {
border-top-left-radius: ".$this->tplSettings['listgroup-firstChild-topLeft-radius'].";
border-top-right-radius: ".$this->tplSettings['listgroup-firstChild-topRight-radius'].";
}
.list-group-item:last-child {
margin-bottom: 0;
border-bottom-right-radius: ".$this->tplSettings['listgroup-lastChild-bottomRight-radius'].";
border-bottom-left-radius: ".$this->tplSettings['listgroup-lastChild-bottomLeft-radius'].";
}
.list-group-item:hover, .list-group-item:focus {
z-index: 1;
text-decoration: none;
}
.list-group-item.disabled, .list-group-item:disabled {
color: #6c757d;
background-color: #fff;
}
.list-group-item.active {
z-index: 2;
color: #".$this->tplSettings['listgroup-itemActiveColor'].";
background-color: #".$this->tplSettings['listgroup-itemActiveBackgroundColor'].";
border-color: #".$this->tplSettings['listgroup-itemActiveBorderColor'].";
}";

/*
.list-group-flush .list-group-item {
border-right: 0;
border-left: 0;
border-radius: 0;
}
.list-group-flush:first-child .list-group-item:first-child {
border-top: 0;
}
.list-group-flush:last-child .list-group-item:last-child {
border-bottom: 0;
}
.list-group-item-primary {
color: #004085;
background-color: #b8daff;
}
.list-group-item-primary.list-group-item-action:hover, .list-group-item-primary.list-group-item-action:focus {
color: #004085;
background-color: #9fcdff;
}
.list-group-item-primary.list-group-item-action.active {
color: #fff;
background-color: #004085;
border-color: #004085;
}
.list-group-item-secondary {
color: #383d41;
background-color: #d6d8db;
}
.list-group-item-secondary.list-group-item-action:hover, .list-group-item-secondary.list-group-item-action:focus {
color: #383d41;
background-color: #c8cbcf;
}
.list-group-item-secondary.list-group-item-action.active {
color: #fff;
background-color: #383d41;
border-color: #383d41;
}
.list-group-item-success {
color: #155724;
background-color: #c3e6cb;
}
.list-group-item-success.list-group-item-action:hover, .list-group-item-success.list-group-item-action:focus {
color: #155724;
background-color: #b1dfbb;
}
.list-group-item-success.list-group-item-action.active {
color: #fff;
background-color: #155724;
border-color: #155724;
}
.list-group-item-info {
color: #0c5460;
background-color: #bee5eb;
}
.list-group-item-info.list-group-item-action:hover, .list-group-item-info.list-group-item-action:focus {
color: #0c5460;
background-color: #abdde5;
}
.list-group-item-info.list-group-item-action.active {
color: #fff;
background-color: #0c5460;
border-color: #0c5460;
}
.list-group-item-warning {
color: #856404;
background-color: #ffeeba;
}
.list-group-item-warning.list-group-item-action:hover, .list-group-item-warning.list-group-item-action:focus {
color: #856404;
background-color: #ffe8a1;
}
.list-group-item-warning.list-group-item-action.active {
color: #fff;
background-color: #856404;
border-color: #856404;
}
.list-group-item-danger {
color: #721c24;
background-color: #f5c6cb;
}
.list-group-item-danger.list-group-item-action:hover, .list-group-item-danger.list-group-item-action:focus {
color: #721c24;
background-color: #f1b0b7;
}
.list-group-item-danger.list-group-item-action.active {
color: #fff;
background-color: #721c24;
border-color: #721c24;
}
.list-group-item-light {
color: #818182;
background-color: #fdfdfe;
}
.list-group-item-light.list-group-item-action:hover, .list-group-item-light.list-group-item-action:focus {
color: #818182;
background-color: #ececf6;
}
.list-group-item-light.list-group-item-action.active {
color: #fff;
background-color: #818182;
border-color: #818182;
}
.list-group-item-dark {
color: #1b1e21;
background-color: #c6c8ca;
}
.list-group-item-dark.list-group-item-action:hover, .list-group-item-dark.list-group-item-action:focus {
color: #1b1e21;
background-color: #b9bbbe;
}
.list-group-item-dark.list-group-item-action.active {
color: #fff;
background-color: #1b1e21;
border-color: #1b1e21;
} */

}
}
}
12 changes: 6 additions & 6 deletions system/setup/yawk_database.sql
View file
Expand Up @@ -792,7 +792,7 @@ INSERT INTO `cms_template_settings` (`id`, `templateID`, `property`, `value`, `v
(36, 1, 'globaltext-hovertextdecoration', 'none', 'underline', '', 3, 1, 5, 'TPL_LINK_HOVER_DECORATION', 'form-control', 'select', 'none,none:underline,underline:overline,overline:line-trough,line-trough:blink,blink:inherit,inherit', 'TPL_HOVER_DECORATION_PLACEHOLDER', '', '', '', ''),
(37, 1, 'buttontext-link', 'FFFFFF', 'ffffff', '', 3, 1, 6, 'TPL_BTN_TEXT_LINK_COLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(38, 1, 'background-listgroup', 'FFFFFF', 'ffffff', '', 15, 1, 0, 'TPL_LISTGROUP_BGCOLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(39, 1, 'fontcolor-listgroup', 'FFFFFF', '000000', '', 15, 1, 0, 'TPL_LISTGROUP_FONTCOLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(39, 1, 'listgroup-itemActiveColor', 'FFFFFF', 'FFFFFF', '', 15, 1, 0, 'TPL_LISTGROUP_ACTIVE_FONTCOLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(40, 1, 'globaltext-fontcolor', '222222', '333333', '', 5, 1, 8, 'TPL_TEXT_FONT_COLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(41, 1, 'fontshadow-menucolor', 'CCCCCC', 'CCCCCC', '', 10, 1, 7, 'TPL_MENU_FONT_SHADOW_COLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(42, 1, 'form-valid', '009900', '009900', '', 0, 1, 0, 'Form Valid Color', 'color', '', '', 'pick a color or leave blank', '', '', '', ''),
Expand Down Expand Up @@ -886,12 +886,12 @@ INSERT INTO `cms_template_settings` (`id`, `templateID`, `property`, `value`, `v
(130, 1, 'img-righty-less', '4deg', '4deg', '', 24, 1, 5, 'TPL_IMG_RIGHTY_LESS', 'form-control', '', '', 'TPL_IMG_RIGHTY_LESS_PLACEHOLDER', '', '', '', ''),
(131, 1, 'img-lefty-less', '-4deg', '-4deg', '', 24, 1, 6, 'TPL_IMG_LEFTY_LESS', 'form-control', '', '', 'TPL_IMG_LEFTY_LESS_PLACEHOLDER', '', '', '', ''),
(132, 1, 'img-brightness', '110%', '110%', '', 24, 1, 7, 'TPL_IMG_HOVER_BRIGHTNESS', 'form-control', '', '', 'TPL_IMG_HOVER_BRIGHTNESS_PLACEHOLDER', '', '', '', ''),
(133, 1, 'listgroup-paddingLeft', '0px', '0', '', 15, 1, 0, 'TPL_LISTGROUP_PADDING_LEFT', 'form-control', '', '', 'TPL_LISTGROUP_PADDING_PLACEHOLDER', '', '', '', ''),
(134, 1, 'listgroup-marginBottom', '20px', '0', '', 15, 1, 0, 'TPL_LISTGROUP_PADDING_BOTTOM', 'form-control', '', '', 'TPL_LISTGROUP_PADDING_PLACEHOLDER', '', '', '', ''),
(133, 1, 'listgroup-paddingLeft', '0', '0', '', 15, 1, 0, 'TPL_LISTGROUP_PADDING_LEFT', 'form-control', '', '', 'TPL_LISTGROUP_PADDING_PLACEHOLDER', '', '', '', ''),
(134, 1, 'listgroup-marginBottom', '-1px', '-1px', '', 15, 1, 0, 'TPL_LISTGROUP_PADDING_BOTTOM', 'form-control', '', '', 'TPL_LISTGROUP_PADDING_PLACEHOLDER', '', '', '', ''),
(135, 1, 'listgroup-itemPosition', 'relative', 'relative', '', 15, 1, 0, 'TPL_LISTGROUP_ITEM_POSITION', 'form-control', 'select', 'static,static:relative,relative:fixed,fixed:absolute,absolute', 'TPL_LISTGROUP_ITEM_POSITION_PLACEHOLDER', '', '', '', ''),
(136, 1, 'listgroup-itemDisplay', 'block', 'block', '', 15, 1, 0, 'TPL_LISTGROUP_ITEM_DISPLAY', 'form-control', 'select', 'block,block:inline,inline:inline-block,inline-block:flex,flex', 'TPL_LISTGROUP_ITEM_DISPLAY_PLACEHOLDER', '', '', '', ''),
(137, 1, 'listgroup-itemPadding', '10px 15px', '10px 15px', '', 15, 1, 0, 'TPL_LISTGROUP_ITEM_PADDING', 'form-control', '', '', 'TPL_LISTGROUP_ITEM_PADDING_PLACEHOLDER', '', '', '', ''),
(138, 1, 'listgroup-itemBorder', '1px solid #2E3037', '1px solid #ddd', '', 15, 1, 0, 'TPL_LISTGROUP_ITEM_BORDER', 'form-control', '', '', 'TPL_LISTGROUP_ITEM_BORDER_PLACEHOLDER', '', '', '', ''),
(137, 1, 'listgroup-itemPadding', '0.75rem 1.25rem', '0.75rem 1.25rem', '', 15, 1, 0, 'TPL_LISTGROUP_ITEM_PADDING', 'form-control', '', '', 'TPL_LISTGROUP_ITEM_PADDING_PLACEHOLDER', '', '', '', ''),
(138, 1, 'listgroup-itemBorder', '1px solid #ddd', '1px solid #ddd', '', 15, 1, 0, 'TPL_LISTGROUP_ITEM_BORDER', 'form-control', '', '', 'TPL_LISTGROUP_ITEM_BORDER_PLACEHOLDER', '', '', '', ''),
(139, 1, 'listgroup-itemBackgroundColor', 'FFFFFF', 'FFF', '', 15, 1, 0, 'TPL_LISTGROUP_ITEM_BGCOLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(140, 1, 'jumbotron-paddingTop', '30px', '30px', '', 16, 1, 2, 'TPL_JUMBOTRON_PADDING_TOP', 'form-control', '', '', 'TPL_JUMBOTRON_PADDING_TOP_PLACEHOLDER', '', '', '', ''),
(141, 1, 'jumbotron-paddingBottom', '30px', '30px', '', 16, 1, 3, 'TPL_JUMBOTRON_PADDING_BOTTOM', 'form-control', '', '', 'TPL_JUMBOTRON_PADDING_BOTTOM_PLACEHOLDER', '', '', '', ''),
Expand All @@ -910,7 +910,7 @@ INSERT INTO `cms_template_settings` (`id`, `templateID`, `property`, `value`, `v
(154, 1, 'jumbotron-h1FontSize', '63px', '63px', '', 16, 1, 15, 'TPL_JUMBOTRON_H1_FONTSIZE', 'form-control', '', '', 'TPL_JUMBOTRON_H1_FONTSIZE_PLACEHOLDER', '', '', '', ''),
(155, 1, 'jumbotron-h1Color', 'FFFFFF', 'FFFFFF', '', 16, 1, 0, 'TPL_JUMBOTRON_H1_COLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(156, 1, 'jumbotron-fontColor', 'CCCCCC', 'CCCCCC', '', 16, 1, 9, 'TPL_JUMBOTRON_FONT_COLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(157, 1, 'listgroup-fontColor', 'FFFFFF', 'FFFFFF', '', 15, 1, 10, 'TPL_LISTGROUP_FONT_COLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(157, 1, 'listgroup-fontColor', '495057', '495057', '', 15, 1, 10, 'TPL_LISTGROUP_FONT_COLOR', 'form-control color', '', '', 'TPL_COLOR_PLACEHOLDER', '', '', '', ''),
(158, 1, 'listgroup-fontSize', '0.9em', '1.2em', '', 15, 1, 0, 'TPL_LISTGROUP_FONTSIZE', 'form-control', '', '', 'TPL_LISTGROUP_FONTSIZE_PLACEHOLDER', '', '', '', ''),
(159, 1, 'navbar-marginTop', '0px', '0px', '', 13, 1, 1, 'TPL_MENU_NAVBAR_MARGIN_TOP', 'form-control', '', '', 'TPL_MENU_NAVBAR_MARGIN_PLACEHOLDER', '', '', '', ''),
(160, 1, 'listgroup-bg-gradient-longValue', '', '', '', 15, 1, 0, 'TPL_LISTGROUP_BG_GRADIENT', 'form-control', 'textarea', '', 'TPL_LISTGROUP_BG_GRADIENT_PLACEHOLDER', '', '', '', ''),
Expand Down

0 comments on commit f67c0aa

Please sign in to comment.