N°3208 Finish Quick object creation component

This commit is contained in:
Stephen Abello
2020-10-08 17:14:41 +02:00
parent 3556a95f3b
commit e6111609b0
3 changed files with 28 additions and 1 deletions

View File

@@ -50,6 +50,8 @@ $ibo-quick-create--compartment-content--text-color: $ibo-color-grey-900 !default
$ibo-quick-create--compartment-element--margin-bottom: 8px !default;
$ibo-quick-create--compartment-results--element--option: $ibo-quick-create--compartment-element--margin-bottom !default;
$ibo-quick-create--compartment-element-image--margin-right: 8px !default;
$ibo-quick-create--compartment-element-image--width: 20px !default;
@@ -138,6 +140,12 @@ $ibo-quick-create--compartment--placeholder-hint--text-color: $ibo-color-grey-70
color: $ibo-quick-create--input--placeholder-color;
}
}
> .item{
color: $ibo-quick-create--input--text-color;
@extend %ibo-font-ral-nor-300;
line-height: 200%;
}
}
.selectize-dropdown{
background-color: $ibo-quick-create--input-options--background-color;
@@ -206,6 +214,17 @@ $ibo-quick-create--compartment--placeholder-hint--text-color: $ibo-color-grey-70
margin-right: $ibo-quick-create--compartment-element-image--margin-right;
width: $ibo-quick-create--compartment-element-image--width;
}
.ibo-quick-create--compartment-results--element > .option{
margin-bottom: $ibo-quick-create--compartment-element--margin-bottom;
color: inherit;
&:hover{
cursor: pointer;
@extend a:hover;
}
}
.ibo-quick-create--compartment--placeholder{
align-items: center;
display: flex;

View File

@@ -38,6 +38,7 @@ $(function()
form: '[data-role="ibo-quick-create--head"]',
input: '[data-role="ibo-quick-create--input"]',
compartment_element: '[data-role="ibo-quick-create--compartment-element"]',
select_dropdown_parent: '[data-role="ibo-quick-create--compartment-results"]'
},
// the constructor
@@ -57,10 +58,15 @@ $(function()
{
const me = this;
// TODO 2.8.0 Use config parameter for maxOptions value
// Instantiate selectize.js on input
this.element.find(this.js_selectors.input).selectize({
dropdownParent: this.js_selectors.select_dropdown_parent,
dropdownClass: 'ibo-quick-create--compartment-results--container',
dropdownContentClass: 'ibo-quick-create--compartment-results--element',
openOnFocus: false,
maxItems: 1
maxItems: 1,
maxOptions: 10,
});
// Remove some inline styling from the widget

View File

@@ -12,6 +12,8 @@
</form>
<div class="ibo-quick-create--drawer" data-role="ibo-quick-create--drawer">
<div class="ibo-quick-create--compartment">
<div class="ibo-quick-create--compartment-content" data-role="ibo-quick-create--compartment-results">
</div>
<div class="ibo-quick-create--compartment-title" data-role="ibo-quick-create--compartment-title">
<span>{{ 'UI:Component:QuickCreate:Recents:Title'|dict_s }}</span>
</div>