Array list counter
This commit is contained in:
parent
2f76a8f293
commit
09c2d6fd3b
5 changed files with 51 additions and 36 deletions
|
@ -20,33 +20,28 @@ if($type === 'document') {
|
|||
|
||||
<ul data-ls-loop="<?php echo $this->escape($namespace); ?>" data-ls-as="node" class="sortable numbers">
|
||||
<li data-forms-move-up data-forms-move-down>
|
||||
<div class="row thin responsive margin-bottom-small force-reverse">
|
||||
<div class="col span-2">
|
||||
<div class="drop-list bottom end" data-ls-ui-open="" data-button-text="" data-button-icon="icon-cog" data-button-selector="[data-toggler]" data-button-class="round dark small margin-bottom-small margin-top-tiny pull-end" data-blur="1" tabindex="1">
|
||||
<ul class="arrow-end margin-top margin-end-negative-small">
|
||||
<li data-move-up>
|
||||
<button type="button" class="link"><i class="icon-up-dir"></i> Move Up</button>
|
||||
</li>
|
||||
<li data-move-down>
|
||||
<button type="button" class="link"><i class="icon-down-dir"></i> Move Down</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" data-ls-ui-trigger="splice-<?php echo $this->escape($namespace); ?>-{{$index}}" class="link" data-debug="1"><i class="icon-cancel"></i> Remove</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col span-10">
|
||||
<?php echo $comp->render(); ?>
|
||||
</div>
|
||||
<div class="drop-list bottom end settings" data-ls-ui-open="" data-button-text="" data-button-icon="icon-cog" data-button-selector="[data-toggler]" data-button-class="round dark small margin-bottom-small margin-top-tiny pull-end" data-blur="1" tabindex="1">
|
||||
<ul class="arrow-end margin-top margin-end-negative-small">
|
||||
<li data-move-up>
|
||||
<button type="button" class="link"><i class="icon-up-dir"></i> Move Up</button>
|
||||
</li>
|
||||
<li data-move-down>
|
||||
<button type="button" class="link"><i class="icon-down-dir"></i> Move Down</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" data-ls-ui-trigger="splice-<?php echo $this->escape($namespace); ?>-{{$index}}" class="link" data-debug="1"><i class="icon-cancel"></i> Remove</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<?php echo $comp->render(); ?>
|
||||
|
||||
<hr class="margin-top-no" />
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<?php if(!empty($list) && $type === 'document'): ?>
|
||||
<div class="drop-list" data-ls-ui-open="" data-button-text="Add" data-button-icon="" data-button-selector="[data-toggler]" data-button-class="reverse margin-bottom-small" data-blur="1" tabindex="1">
|
||||
<div class="drop-list" data-ls-ui-open="" data-button-text="Add" data-button-icon="" data-button-selector="[data-toggler]" data-button-class="reverse small margin-bottom-small" data-blur="1" tabindex="1">
|
||||
<ul>
|
||||
<?php foreach($list as $item):
|
||||
$name = (isset($collections[$item])) ? $collections[$item] : '';
|
||||
|
@ -58,5 +53,5 @@ if($type === 'document') {
|
|||
</ul>
|
||||
</div>
|
||||
<?php else: ?>
|
||||
<button type="button" data-ls-ui-trigger="collection-child-<?php echo $this->escape($namespace); ?>" class="reverse margin-bottom-small">Add</button>
|
||||
<button type="button" data-ls-ui-trigger="collection-child-<?php echo $this->escape($namespace); ?>" class="reverse small margin-bottom-small">Add</button>
|
||||
<?php endif; ?>
|
|
@ -82,13 +82,21 @@
|
|||
ul.numbers {
|
||||
> li {
|
||||
position: relative;
|
||||
.func-margin-start(30px);
|
||||
.func-margin-end(50px);
|
||||
|
||||
.settings {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
.func-end(-50px);
|
||||
}
|
||||
|
||||
&::after {
|
||||
display: block;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
font-size: 14px;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
border-radius: 50%;
|
||||
background: var(--config-color-focus);
|
||||
|
@ -97,7 +105,7 @@
|
|||
content: counter(section);
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
top: 3px;
|
||||
.func-start(-45px);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -158,6 +158,12 @@
|
|||
}
|
||||
|
||||
&.sticky-footer {
|
||||
form {
|
||||
footer {
|
||||
margin: -30px;
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
position: sticky;
|
||||
bottom: -30px;
|
||||
|
@ -165,7 +171,7 @@
|
|||
height: 50px;
|
||||
z-index: 1;
|
||||
padding: 30px;
|
||||
box-shadow: 0 0 1px rgba(0,0,0,.05);
|
||||
box-shadow: 0 0 1px rgba(0,0,0,.15);
|
||||
|
||||
form {
|
||||
display: inline-block;
|
||||
|
|
|
@ -732,24 +732,31 @@ input[type=checkbox], input[type=radio] {
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol {
|
||||
ul, ol {
|
||||
margin: 0 0 20px 0;
|
||||
|
||||
li {
|
||||
display: list-item !important;
|
||||
list-style: inherit;
|
||||
margin-bottom: 10px;
|
||||
list-style-position: inside!important;
|
||||
margin: 0 20px 2px 20px;
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul li {
|
||||
margin: 0 20px;
|
||||
display: list-item;
|
||||
ol {
|
||||
li {
|
||||
list-style: decimal;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -966,7 +973,7 @@ hr {
|
|||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
border: solid 2px var(--config-color-background-dark);
|
||||
border: solid 1px var(--config-color-background-dark);
|
||||
|
||||
&:hover:before {
|
||||
background: var(--config-color-focus);
|
||||
|
|
|
@ -18,7 +18,6 @@ table {
|
|||
font-size: 14px;
|
||||
|
||||
th {
|
||||
background: var(--config-color-background-fade);
|
||||
position: sticky;
|
||||
top: -30px;
|
||||
z-index: 3;
|
||||
|
|
Loading…
Reference in a new issue