bellord/kit
1
0
Fork 0
mirror of https://bitbucket.org/bellord13/kit.git synced 2026-11-13 19:06:11 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix

Browse Source
This commit is contained in:
bellord
2021-09-05 20:17:36 +03:00
parent 7310d04755
commit 6297c67201
28 changed files with 2676 additions and 1591 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/cheatsheet.php
+103 -5
View File
@@ -15,7 +15,11 @@ if(\Bitrix\Main\Loader::includeModule('wt.core')) {
$APPLICATION->ShowHead();
?>
<script>
kit.ready(['popover', 'datepicker'], function () {
});
</script>
<div class="kit-wrapper">
<h1 style="text-align: center;">BX.KIT FRONT-END FRAMEWORK</h1>
@@ -27,6 +31,8 @@ $APPLICATION->ShowHead();
<h6>Lorem ipsum dolor sit amet, consectetur adipisicing elit</h6>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis eos esse excepturi explicabo fugit labore laborum quaerat quasi voluptatibus? A ab earum explicabo labore nobis nostrum optio perspiciatis provident, quam.</p>
<h2>Tooltip</h2>
<div class="flex-line-wrap flex-col-count" style="--flex-col-count: 5">
<div class="flex-list-item">
<?
@@ -34,7 +40,7 @@ $APPLICATION->ShowHead();
'LABEL' => 'Tooltip on top',
'CLASS' => '',
'ATTR' => [
'data-toggle' => 'tooltip',
'data-bs-toggle' => 'tooltip',
'data-bs-placement' => 'top',
'title' => 'Tooltip on top'
]
@@ -47,7 +53,7 @@ $APPLICATION->ShowHead();
'LABEL' => 'Tooltip on end',
'CLASS' => '',
'ATTR' => [
'data-toggle' => 'tooltip',
'data-bs-toggle' => 'tooltip',
'data-bs-placement' => 'right',
'title' => 'Tooltip on end'
]
@@ -60,7 +66,7 @@ $APPLICATION->ShowHead();
'LABEL' => 'Tooltip on bottom',
'CLASS' => '',
'ATTR' => [
'data-toggle' => 'tooltip',
'data-bs-toggle' => 'tooltip',
'data-bs-placement' => 'bottom',
'title' => 'Tooltip on bottom'
]
@@ -73,7 +79,7 @@ $APPLICATION->ShowHead();
'LABEL' => 'Tooltip on start',
'CLASS' => '',
'ATTR' => [
'data-toggle' => 'tooltip',
'data-bs-toggle' => 'tooltip',
'data-bs-placement' => 'left',
'title' => 'Tooltip on start'
]
@@ -86,7 +92,7 @@ $APPLICATION->ShowHead();
'LABEL' => 'Tooltip with HTML',
'CLASS' => '',
'ATTR' => [
'data-toggle' => 'tooltip',
'data-bs-toggle' => 'tooltip',
'data-bs-html' => 'true',
'title' => '<em>Tooltip</em> <u>with</u> <b>HTML</b>'
]
@@ -95,6 +101,98 @@ $APPLICATION->ShowHead();
</div>
</div>
<h2>Popover</h2>
<div class="flex-line-wrap flex-col-count" style="--flex-col-count: 5">
<div class="flex-list-item">
<?
service()->templater()->render('kit:button', [
'LABEL' => 'Popover on top',
'CLASS' => '',
'ATTR' => [
'data-bs-toggle' => 'popover',
'data-bs-placement' => 'top',
'data-bs-content' => 'Top popover',
'data-bs-container' => 'body',
]
]);
?>
</div>
<div class="flex-list-item">
<?
service()->templater()->render('kit:button', [
'LABEL' => 'Popover on right',
'CLASS' => '',
'ATTR' => [
'data-bs-toggle' => 'popover',
'data-bs-placement' => 'right',
'data-bs-content' => 'Right popover',
'data-bs-container' => 'body',
]
]);
?>
</div>
<div class="flex-list-item">
<?
service()->templater()->render('kit:button', [
'LABEL' => 'Popover on bottom',
'CLASS' => '',
'ATTR' => [
'data-bs-toggle' => 'popover',
'data-bs-placement' => 'bottom',
'data-bs-content' => 'Bottom popover',
'data-bs-container' => 'body',
]
]);
?>
</div>
<div class="flex-list-item">
<?
service()->templater()->render('kit:button', [
'LABEL' => 'Popover on left',
'CLASS' => '',
'ATTR' => [
'data-bs-toggle' => 'popover',
'data-bs-placement' => 'left',
'data-bs-content' => 'Left popover',
'data-bs-container' => 'body',
]
]);
?>
</div>
<div class="flex-list-item">
<?
service()->templater()->render('kit:button', [
'LABEL' => htmlspecialchars('<HTML> & header'),
'CLASS' => '',
'ATTR' => [
'data-bs-toggle' => 'popover',
'data-bs-content' => 'And here\'s some amazing content. It\'s very engaging. <em>Right</em>?',
'data-bs-container' => 'body',
'data-bs-html' => 'true',
'title' => '<em>Tooltip</em> <u>with</u> <b>HTML</b>'
]
]);
?>
</div>
<div class="flex-list-item">
<?
service()->templater()->render('kit:button', [
'LABEL' => 'trigger focus',
'CLASS' => '',
'ATTR' => [
'data-bs-toggle' => 'popover',
'data-bs-content' => 'And here\'s some amazing content. It\'s very engaging. <em>Right</em>?',
'data-bs-container' => 'body',
'data-bs-html' => 'true',
'data-bs-trigger' => 'focus',
'title' => '<em>Tooltip</em> <u>with</u> <b>HTML</b>'
]
]);
?>
</div>
</div>
<div class="d-flex justify-content-between flex-wrap">
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModalCenteredScrollable">