Adding upstream version 0.46.
Signed-off-by: Daniel Baumann <daniel@debian.org>
This commit is contained in:
parent
eb42e29864
commit
5ea73fcab5
125 changed files with 8421 additions and 71 deletions
83
docs/components/ui/LinkedList/DemoCSS.jinja
Normal file
83
docs/components/ui/LinkedList/DemoCSS.jinja
Normal file
|
@ -0,0 +1,83 @@
|
|||
{% filter markdown %}{% raw %}
|
||||
```css
|
||||
.ui-linkedlist {
|
||||
padding: 0px;
|
||||
background-color: rgb(255 255 255);
|
||||
overscroll-behavior: contain;
|
||||
overflow-y: scroll;
|
||||
list-style-type: none;
|
||||
height: 16rem;
|
||||
margin: 0px;
|
||||
border: 1px solid rgb(128 128 128);
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.ui-linkedlist li {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
padding: 0.25rem 1rem;
|
||||
align-items: center;
|
||||
}
|
||||
.ui-linkedlist li[disabled] {
|
||||
color: rgb(156 156 156);
|
||||
cursor: default;
|
||||
}
|
||||
.ui-linkedlist li:hover {
|
||||
background-color: rgb(243 244 246);
|
||||
}
|
||||
.ui-linkedlist input[type="checkbox"] {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
label {
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
background-color: white;
|
||||
padding: 0.25rem 2rem;
|
||||
border: 1px solid rgb(128 128 128);
|
||||
border-radius: 0.25rem 0.25rem 0 0;
|
||||
font-size: 0.7rem;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
button {
|
||||
margin-top: 0.5rem;
|
||||
display: inline-flex;
|
||||
cursor: pointer;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
button > :not([hidden]) ~ :not([hidden]) {
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
button {
|
||||
white-space: nowrap;
|
||||
border-radius: 0.25rem;
|
||||
border: 1px solid transparent;
|
||||
background-color: rgb(229 231 235);
|
||||
padding: 0.5rem 0.75rem;
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1rem;
|
||||
}
|
||||
button:hover {
|
||||
border-color: rgb(219 234 254);
|
||||
background-color: rgb(243 244 246);
|
||||
}
|
||||
button:focus {
|
||||
background-color: rgb(229 231 235);
|
||||
outline-offset: 1px;
|
||||
outline-color: #3b82f6;
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
button {
|
||||
padding: 0.25rem 0.5rem;
|
||||
}
|
||||
}
|
||||
button.select-all {
|
||||
float: right;
|
||||
}
|
||||
```
|
||||
{% endraw %}{% endfilter %}
|
35
docs/components/ui/LinkedList/DemoHTML.jinja
Normal file
35
docs/components/ui/LinkedList/DemoHTML.jinja
Normal file
|
@ -0,0 +1,35 @@
|
|||
{% filter markdown %}{% raw %}
|
||||
```html+jinja
|
||||
<div>
|
||||
<label>Known Mutants</label>
|
||||
<LinkedList id="linkedlist-demo-list1" linked_to="linkedlist-demo-list2">
|
||||
<li><input type="checkbox" name="users" value="1" />
|
||||
Alexander Summers</li>
|
||||
<!-- ... etc ... -->
|
||||
<li><input type="checkbox" name="users" value="27" />
|
||||
Warren Worthington III</li>
|
||||
</LinkedList>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="select-all"
|
||||
onclick="document.getElementById('linkedlist-demo-list1').dispatchEvent(new CustomEvent('jxui:linked:sendall'));"
|
||||
>
|
||||
Select all »
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<label>X-Men</label>
|
||||
<LinkedList id="linkedlist-demo-list2" linked_to="linkedlist-demo-list1" active>
|
||||
</LinkedList>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="remove-all"
|
||||
onclick="document.getElementById('linkedlist-demo-list2').dispatchEvent(new CustomEvent('jxui:linked:sendall'));"
|
||||
>
|
||||
« Remove all
|
||||
</button>
|
||||
</div>
|
||||
```
|
||||
{% endraw %}{% endfilter %}
|
89
docs/components/ui/LinkedList/DemoResult.jinja
Normal file
89
docs/components/ui/LinkedList/DemoResult.jinja
Normal file
|
@ -0,0 +1,89 @@
|
|||
{#css ui/LinkedList/LinkedList.css #}
|
||||
|
||||
<div class="bg-cover"
|
||||
style="background-image:linear-gradient(to right, rgba(132,204,22,0.7), rgba(22,163,74,0.7))"
|
||||
data-md-skip
|
||||
></div>
|
||||
|
||||
<div id="linkedlist-demo" data-md-skip>
|
||||
<div>
|
||||
<label>Known Mutants</label>
|
||||
<LinkedList id="linkedlist-demo-list1" linked_to="linkedlist-demo-list2">
|
||||
<li><input type="checkbox" name="users" value="1" />
|
||||
Alexander Summers</li>
|
||||
<li><input type="checkbox" name="users" value="2" />
|
||||
Alison Blaire</li>
|
||||
<li><input type="checkbox" name="users" value="3" />
|
||||
Anna Marie LeBeau</li>
|
||||
<li><input type="checkbox" name="users" value="4" />
|
||||
Charles Francis Xavier</li>
|
||||
<li><input type="checkbox" name="users" value="5" />
|
||||
Elizabeth Braddock</li>
|
||||
<li><input type="checkbox" name="users" value="6" />
|
||||
Emma Grace Frost</li>
|
||||
<li disabled><input type="checkbox" name="users" value="7" disabled />
|
||||
Erik Magnus Lehnsherr</li>
|
||||
<li><input type="checkbox" name="users" value="8" />
|
||||
Henry Philip McCoy</li>
|
||||
<li><input type="checkbox" name="users" value="9" />
|
||||
James Howlett</li>
|
||||
<li><input type="checkbox" name="users" value="10" />
|
||||
Jean Elaine Grey</li>
|
||||
<li><input type="checkbox" name="users" value="11" />
|
||||
John Proudstar</li>
|
||||
<li><input type="checkbox" name="users" value="12" />
|
||||
Jubilation Lee</li>
|
||||
<li><input type="checkbox" name="users" value="13" />
|
||||
Katherine Anne Pryde</li>
|
||||
<li><input type="checkbox" name="users" value="14" />
|
||||
Kurt Wagner</li>
|
||||
<li><input type="checkbox" name="users" value="15" />
|
||||
Lucas Bishop</li>
|
||||
<li><input type="checkbox" name="users" value="16" />
|
||||
Nathan Summers</li>
|
||||
<li><input type="checkbox" name="users" value="17" />
|
||||
Ororo Munroe</li>
|
||||
<li><input type="checkbox" name="users" value="18" />
|
||||
Piotr Nikolaievitch Rasputin</li>
|
||||
<li><input type="checkbox" name="users" value="19
|
||||
Rachel Anne Summers</li>
|
||||
<li><input type="checkbox" name="users" value="20" />
|
||||
Raven Darkhölme</li>
|
||||
<li><input type="checkbox" name="users" value="21" />
|
||||
Remy Etienne LeBeau</li>
|
||||
<li><input type="checkbox" name="users" value="22" />
|
||||
Robert Louis Drake</li>
|
||||
<li><input type="checkbox" name="users" value="23" />
|
||||
Roberto da Costa</li>
|
||||
<li><input type="checkbox" name="users" value="24" />
|
||||
Scott Summers</li>
|
||||
<li><input type="checkbox" name="users" value="25" />
|
||||
Sean Cassidy</li>
|
||||
<li><input type="checkbox" name="users" value="26" />
|
||||
Shiro Yoshida</li>
|
||||
<li><input type="checkbox" name="users" value="27" />
|
||||
Warren Worthington III</li>
|
||||
</LinkedList>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="select-all"
|
||||
onclick="document.getElementById('linkedlist-demo-list1').dispatchEvent(new CustomEvent('jxui:linked:sendall'));"
|
||||
>
|
||||
Select all »
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<label>X-Men</label>
|
||||
<LinkedList id="linkedlist-demo-list2" linked_to="linkedlist-demo-list1" active>
|
||||
</LinkedList>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="remove-all"
|
||||
onclick="document.getElementById('linkedlist-demo-list2').dispatchEvent(new CustomEvent('jxui:linked:sendall'));"
|
||||
>
|
||||
« Remove all
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
96
docs/components/ui/LinkedList/LinkedList.css
Normal file
96
docs/components/ui/LinkedList/LinkedList.css
Normal file
|
@ -0,0 +1,96 @@
|
|||
@scope (#linkedlist-demo) {
|
||||
:scope {
|
||||
position: relative;
|
||||
display: block;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.5rem;
|
||||
height: 360px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
:scope > div {
|
||||
width: 100%;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.ui-linkedlist {
|
||||
padding: 0px;
|
||||
background-color: rgb(255 255 255);
|
||||
overscroll-behavior: contain;
|
||||
overflow-y: scroll;
|
||||
list-style-type: none;
|
||||
height: 16rem;
|
||||
margin: 0px;
|
||||
border: 1px solid rgb(128 128 128);
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.ui-linkedlist li {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
padding: 0.25rem 1rem;
|
||||
align-items: center;
|
||||
}
|
||||
.ui-linkedlist li[disabled] {
|
||||
color: rgb(156 156 156);
|
||||
cursor: default;
|
||||
}
|
||||
.ui-linkedlist li:hover {
|
||||
background-color: rgb(243 244 246);
|
||||
}
|
||||
.ui-linkedlist input[type="checkbox"] {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
label {
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
background-color: white;
|
||||
padding: 0.25rem 2rem;
|
||||
border: 1px solid rgb(128 128 128);
|
||||
border-radius: 0.25rem 0.25rem 0 0;
|
||||
font-size: 0.7rem;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
button {
|
||||
margin-top: 0.5rem;
|
||||
display: inline-flex;
|
||||
cursor: pointer;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
button > :not([hidden]) ~ :not([hidden]) {
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
button {
|
||||
white-space: nowrap;
|
||||
border-radius: 0.25rem;
|
||||
border: 1px solid transparent;
|
||||
background-color: rgb(229 231 235);
|
||||
padding: 0.5rem 0.75rem;
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1rem;
|
||||
}
|
||||
button:hover {
|
||||
border-color: rgb(219 234 254);
|
||||
background-color: rgb(243 244 246);
|
||||
}
|
||||
button:focus {
|
||||
background-color: rgb(229 231 235);
|
||||
outline-offset: 1px;
|
||||
outline-color: #3b82f6;
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
button {
|
||||
padding: 0.25rem 0.5rem;
|
||||
}
|
||||
}
|
||||
button.select-all {
|
||||
float: right;
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue