raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-01-24 20:36:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Implements the ofn-drop-down-v2 design

Browse Source
This commit is contained in:
Jean-Baptiste Bellet
2022-09-27 16:11:19 +02:00
parent 23e2d28488
commit b4e041c7e9
2 changed files with 38 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
app/components/multiple_checked_select_component/multiple_checked_select_component.html.haml
View File

@@ -1,7 +1,6 @@
.ofn-drop-down{ data: { controller: "multiple-checked-select", "multiple-checked-select-input-name-value": @name } }
%div{ "data-multiple-checked-select-target": "button" }
%span{ class: 'icon-reorder' }
= "  #{t('admin.columns')}".html_safe
.ofn-drop-down.ofn-drop-down-v2{ data: { controller: "multiple-checked-select", "multiple-checked-select-input-name-value": @name } }
%div.ofn-drop-down-label{ "data-multiple-checked-select-target": "button" }
%span{class: "label"}= t('admin.columns')
%span{ class: "icon-caret-down", "data-multiple-checked-select-target": "caret" }
%div.menu{ class: "hidden", "data-multiple-checked-select-target": "options" }
%div.filter

35
app/webpacker/css/admin/dropdown.scss
View File

@@ -65,6 +65,41 @@
.ofn-drop-down {
@include ofn-drop-down-style;
&.ofn-drop-down-v2 {
border: 1px solid $pale-blue;
background-color: white;
padding: 0px;
&:hover {
border-color: $spree-blue;
}
.ofn-drop-down-label {
color: $color-3;
padding: 10px;
width: 235px;
display: flex;
justify-content: space-between;
&:hover {
color: $color-3;
}
.label {
padding-right: 10px;
}
.icon-caret-down, .icon-caret-up {
padding-right: 0px;
}
}
.menu {
width: 100%;
}
}
position: relative;
float: left;