diff --git a/src/admin/components/advanced-search/advanced-search.vue b/src/admin/components/advanced-search/advanced-search.vue index 3e55945fc..13c6d85ae 100644 --- a/src/admin/components/advanced-search/advanced-search.vue +++ b/src/admin/components/advanced-search/advanced-search.vue @@ -18,13 +18,13 @@ v-else :style="advancedSearchResults ? { 'padding-top': '0' } : { 'padding-top': '47px' }" :class="{ 'padding-in-header': isHeader, 'padding-regular': !isHeader }" - class="columns is-multiline tnc-advanced-search-container"> + class="tnc-advanced-search-container">
+ class="field is-12 tainacan-form"> @@ -113,7 +112,6 @@ >{{ comparator }} @@ -609,7 +607,7 @@ padding-bottom: 47px; .column { - padding: 0 0.3rem 0.3rem !important; + padding: 0 0.5rem 0.75rem !important; } .control { @@ -632,9 +630,16 @@ margin-left: -5px !important; } - .tainacan-input-disabled { - background-color: $gray3; + @media screen and (max-width: 768px) { + .is-12>.columns { + flex-wrap: wrap; + } + .is-two-thirds { + order: 3; + flex-basis: 100%; + } } + } \ No newline at end of file diff --git a/src/admin/pages/lists/items-page.vue b/src/admin/pages/lists/items-page.vue index 5ace96763..4042a77d6 100644 --- a/src/admin/pages/lists/items-page.vue +++ b/src/admin/pages/lists/items-page.vue @@ -94,7 +94,7 @@
+ :class="{ 'spaced-to-right': !isFiltersMenuCompressed && !openAdvancedSearch }"> -
+
-
-
-
+
+
+

{{ $i18n.get('info_search_criteria') }}

-
+ class="field is-grouped">

@@ -413,8 +411,8 @@

-
+
@@ -1087,6 +1085,10 @@ .advanced-search-criteria-title { padding: 0; + &>.is-flex { + justify-content: space-between; + } + h1 { font-size: 20px; font-weight: 500; @@ -1307,6 +1309,9 @@ align-items: center; width: 100%; + .input { + border: 1px solid $gray2; + } .control { width: 100%; .icon { diff --git a/src/admin/scss/_inputs.scss b/src/admin/scss/_inputs.scss index efcf83615..9ff0268d2 100644 --- a/src/admin/scss/_inputs.scss +++ b/src/admin/scss/_inputs.scss @@ -10,8 +10,8 @@ border: 1px solid $gray2 !important; } &[disabled] { - color: $gray4; - background-color: $gray2; + color: $gray4 !important; + background-color: $gray2 !important; } &::placeholder, &::-ms-input-placeholder, diff --git a/src/admin/theme-items-list.vue b/src/admin/theme-items-list.vue index 28c22109e..8d7b632bd 100644 --- a/src/admin/theme-items-list.vue +++ b/src/admin/theme-items-list.vue @@ -35,6 +35,9 @@ export default { // Tainacan imports @import "../admin/scss/_tables.scss"; @import "../admin/scss/_modals.scss"; + @import "../admin/scss/_buttons.scss"; + @import "../admin/scss/_inputs.scss"; + @import "../admin/scss/_checkboxes.scss"; @import "../admin/scss/_pagination.scss"; @import "../admin/scss/_tags.scss"; @import "../admin/scss/_selects.scss"; @@ -56,65 +59,6 @@ export default { list-style: none; } - // Some components have a different style in listing pages - .button { - height: inherit !important; - box-shadow: none !important; - border-radius: 6px; - padding: 2px 15px; - margin-top: 0px; - margin-bottom: 0px; - display: inline-flex; - font-weight: normal; - cursor: pointer; - - &.is-secondary:hover, &.is-secondary:focus { - background: $secondary !important; - } - &.is-primary:hover, &.is-primary:focus { - background: $turquoise3 !important; - } - &.is-success:hover, &.is-success:focus { - background: $success !important; - } - &.is-white:hover, &.is-white:focus, &.is-outlined:hover, &.is-outlined:focus { - background: $white !important; - } - &:active { - -webkit-transform: none !important; - transform: none !important; - } - &.is-outlined { - color: #150e38 !important; - background-color: white; - border-color: $gray4 !important; - } - &:focus { - outline: 0px; - } - } - .button.is-small { - height: 26px !important; - line-height: 12px; - } - .button:not(.is-small):not(.is-medium):not(.is-large) { - height: 30px !important; - line-height: 20px !important; - font-size: 14px !important; - } - .input, .textarea { - font-size: 14px; - border: 1px solid $gray2; - border-radius: 1px !important; - background-color: white; - box-shadow: none !important; - - &:focus, &:active { - box-shadow: none !important; - background-color: white; - border: 1px solid $gray2 !important; - } - } .dropdown { display: inline-flex; position: relative; @@ -123,35 +67,6 @@ export default { .dropdown-menu { display: block; } - .b-checkbox.checkbox { - align-items: baseline; - margin-bottom: 5px; - - input[type="checkbox"] { - box-shadow: none !important; - } - - input[type="checkbox"] + .check { - width: 1.0em; - height: 1.0em; - flex-shrink: 0; - border-radius: 0; - border: 1px solid $gray4; - transition: background 150ms ease-out; - box-shadow: none !important; - } - - &:focus input[type="checkbox"] + .check, - &:active input[type="checkbox"] + .check, - &:hover input[type="checkbox"] + .check { - box-shadow: none !important; - border-color: $gray4 !important; - } - input[type="checkbox"]:checked + .check { - background: white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:%23000' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E") no-repeat center center !important; - border-color: $gray4 !important; - } - } .b-radio.radio { input[type="radio"] + .check {