raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-02-11 23:17:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

Introduce relaxed, regular and condensed button for specify height

Browse Source
This commit is contained in:
Jean-Baptiste Bellet
2023-08-16 11:27:00 +02:00
parent 5de0d79ca2
commit f5e7738c78
5 changed files with 20 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/views/admin/products_v3/_filters.html.haml
View File

@@ -10,4 +10,4 @@
= select_tag :category_id, options_for_select(category_options, category_id), include_blank: t('.all_categories'), "data-controller": "tom-select", "data-tom-select-options-value": '{ "plugins": [] }', class: "fullwidth"
.submit
.search-button
= button_tag t(".search"), class: "secondary icon-search"
= button_tag t(".search"), class: "secondary icon-search relaxed"

2
app/views/admin/products_v3/_sort.html.haml
View File

@@ -2,7 +2,7 @@
%div
= t(".pagination.total_html", total: pagy.count, from: pagy.from, to: pagy.to)
- if search_term.present? || producer_id.present? || category_id.present?
%a{ href: "#", class: "button disruptive medium", data: { reflex: "click->products#clear_search" } }
%a{ href: "#", class: "button disruptive condensed", data: { reflex: "click->products#clear_search" } }
= t(".pagination.clear_search")
%div.with-dropdown
= t(".pagination.per_page.show")

10
app/webpacker/css/admin/products_v3.scss
View File

@@ -104,8 +104,8 @@
}
#sort {
line-height: $btn-medium-height;
height: $btn-medium-height;
line-height: $btn-relaxed-height;
height: $btn-relaxed-height;
.with-dropdown {
display: flex;
@@ -150,8 +150,8 @@
background-color: $lighter-grey;
border: 1px solid $lighter-grey;
border-radius: 4px;
height: $btn-height;
line-height: $btn-height;
height: $btn-relaxed-height;
line-height: $btn-relaxed-height;
&:has(input:focus),
&:has(input:active) {
@@ -176,7 +176,7 @@
.categories {
select {
width: 150px;
height: $btn-height;
height: $btn-relaxed-height;
}
}

15
app/webpacker/css/admin_v3/components/buttons.scss
View File

@@ -12,8 +12,8 @@ button:not(.plain):not(.trix-button),
border: 1px solid $color-btn-bg;
color: $color-btn-text;
text-transform: uppercase;
line-height: 40px;
height: 40px;
line-height: $btn-regular-height - 2px; // remove 2px to compensate for border
height: $btn-regular-height;
font-weight: bold;
&:before {
@@ -79,9 +79,14 @@ button:not(.plain):not(.trix-button),
}
}
&.medium {
line-height: $btn-medium-height;
height: $btn-medium-height;
&.condensed {
line-height: $btn-condensed-height - 2px; // remove 2px to compensate for border
height: $btn-condensed-height;
}
&.relaxed {
line-height: $btn-relaxed-height - 2px; // remove 2px to compensate for border
height: $btn-relaxed-height;
}
.badge {

5
app/webpacker/css/admin_v3/globals/variables.scss
View File

@@ -155,5 +155,6 @@ $border-radius: 4px !default;
$font-weight-bold: 600 !default;
$font-weight-normal: 400 !default;
$btn-height: 40px !default;
$btn-medium-height: 32px !default;
$btn-relaxed-height: 40px !default;
$btn-regular-height: 32px !default;
$btn-condensed-height: 26px !default;