tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Adds several css border-radius variables to form components.

This commit is contained in:
mateuswetah 2023-11-17 11:10:53 -03:00
parent b37a11610f
commit 3470553840
21 changed files with 56 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/assets/css/tainacan-gutenberg-block-item-submission-form.css
View File

@ -129,14 +129,14 @@
height: 1.5em; height: 1.5em;
width: 18%; width: 18%;
border: 2px solid var(--tainacan-input-border-color, rgba(200, 200, 200, 0.3)); border: 2px solid var(--tainacan-input-border-color, rgba(200, 200, 200, 0.3));
border-radius: 3px; border-radius: var(--tainacan-input-border-radius, 1px);
display: inline-block; } display: inline-block; }
.wp-block-tainacan-item-submission-form .item-submission-form-placeholder .fake-textarea { .wp-block-tainacan-item-submission-form .item-submission-form-placeholder .fake-textarea {
background-color: var(--tainacan-input-background-color, rgba(200, 200, 200, 0.3)); background-color: var(--tainacan-input-background-color, rgba(200, 200, 200, 0.3));
height: 2.5em; height: 2.5em;
width: 100%; width: 100%;
border: 2px solid var(--tainacan-input-border-color, rgba(200, 200, 200, 0.3)); border: 2px solid var(--tainacan-input-border-color, rgba(200, 200, 200, 0.3));
border-radius: 3px; border-radius: var(--tainacan-input-border-radius, 1px);
display: inline-block; } display: inline-block; }
.wp-block-tainacan-item-submission-form .item-submission-form-placeholder .fake-button { .wp-block-tainacan-item-submission-form .item-submission-form-placeholder .fake-button {
background-color: var(--tainacan-secondary, rgba(200, 200, 200, 0.3)); background-color: var(--tainacan-secondary, rgba(200, 200, 200, 0.3));
@ -146,7 +146,7 @@
max-width: 3.45em; max-width: 3.45em;
min-width: 1em; min-width: 1em;
margin-left: 6px; margin-left: 6px;
border-radius: 3px; border-radius: var(--tainacan-button-border-radius, 4px);
display: flex; display: flex;
align-items: center; align-items: center;
margin-right: auto; } margin-right: auto; }

2
src/assets/css/tainacan-gutenberg-block-item-submission-form.css.map
View File

File diff suppressed because one or more lines are too long

1
src/views/admin/components/edition/item-document-edition-form.vue
View File

@ -166,6 +166,7 @@ export default {
justify-content: space-evenly; justify-content: space-evenly;
padding: 1.5rem 1rem 2rem 1rem; padding: 1.5rem 1rem 2rem 1rem;
border: 1px solid var(--tainacan-input-border-color); border: 1px solid var(--tainacan-input-border-color);
border-radius: var(--tainacan-input-border-radius, 1px);
li { li {
text-align: center; text-align: center;

2
src/views/admin/components/edition/item-edition-form.vue
View File

@ -1351,9 +1351,7 @@ export default {
if (currentItemMetadatum) { if (currentItemMetadatum) {
const itemMetadatumValues = Array.isArray(currentItemMetadatum.value) ? currentItemMetadatum.value : [ currentItemMetadatum.value ]; const itemMetadatumValues = Array.isArray(currentItemMetadatum.value) ? currentItemMetadatum.value : [ currentItemMetadatum.value ];
const conditionalValues = Array.isArray(eventBusItemMetadata.conditionalSections[conditionalSectionId].metadatumValues) ? eventBusItemMetadata.conditionalSections[conditionalSectionId].metadatumValues : [eventBusItemMetadata.conditionalSections[conditionalSectionId].metadatumValues]; const conditionalValues = Array.isArray(eventBusItemMetadata.conditionalSections[conditionalSectionId].metadatumValues) ? eventBusItemMetadata.conditionalSections[conditionalSectionId].metadatumValues : [eventBusItemMetadata.conditionalSections[conditionalSectionId].metadatumValues];
console.log(itemMetadatumValues, conditionalValues);
eventBusItemMetadata.conditionalSections[conditionalSectionId].hide = Array.isArray(itemMetadatumValues) ? itemMetadatumValues.every(aValue => conditionalValues.indexOf(aValue['id'] ? aValue['id'] : aValue) < 0) : conditionalValues.indexOf(itemMetadatumValues) < 0; eventBusItemMetadata.conditionalSections[conditionalSectionId].hide = Array.isArray(itemMetadatumValues) ? itemMetadatumValues.every(aValue => conditionalValues.indexOf(aValue['id'] ? aValue['id'] : aValue) < 0) : conditionalValues.indexOf(itemMetadatumValues) < 0;
console.log(eventBusItemMetadata.conditionalSections[conditionalSectionId].hide)
} }
} }

2
src/views/admin/components/filter-types/tainacan-filter-item.vue
View File

@ -236,7 +236,7 @@
} }
.taginput-container { .taginput-container {
border-radius: 1px !important; border-radius: var(--tainacan-input-border-radius, 1px) !important;
box-shadow: none !important; box-shadow: none !important;
transition: background-color 0.1s; transition: background-color 0.1s;
} }

5
src/views/admin/components/lists/terms-list-hierarchical.vue
View File

@ -866,7 +866,10 @@ export default {
.tainacan-hierarchical-list-columns-container { .tainacan-hierarchical-list-columns-container {
background-color: var(--tainacan-background-color); background-color: var(--tainacan-background-color);
border: 1px solid var(--tainacan-gray2); border: 1px solid var(--tainacan-gray2);
border-radius: 2px; border-bottom-left-radius: var(--tainacan-dropdownmenu-border-radius);
border-bottom-right-radius: var(--tainacan-dropdownmenu-border-radius);
border-top-right-radius: 0px;
border-top-left-radius: 0px;
margin-top: 0px; margin-top: 0px;
display: flex; display: flex;
height: auto; height: auto;

5
src/views/admin/components/lists/terms-list.vue
View File

@ -342,7 +342,10 @@ export default {
.tainacan-hierarchical-list-columns-container { .tainacan-hierarchical-list-columns-container {
background-color: var(--tainacan-background-color); background-color: var(--tainacan-background-color);
border: 1px solid var(--tainacan-gray2); border: 1px solid var(--tainacan-gray2);
border-radius: 2px; border-bottom-left-radius: var(--tainacan-dropdownmenu-border-radius);
border-bottom-right-radius: var(--tainacan-dropdownmenu-border-radius);
border-top-right-radius: 0px;
border-top-left-radius: 0px;
margin-top: 0px; margin-top: 0px;
display: flex; display: flex;
height: auto; height: auto;

4
src/views/admin/components/other/checkbox-radio-filter-input.vue
View File

@ -962,6 +962,10 @@
.tainacan-finder-columns-container { .tainacan-finder-columns-container {
background-color: var(--tainacan-white); background-color: var(--tainacan-white);
border: 1px solid var(--tainacan-gray1); border: 1px solid var(--tainacan-gray1);
border-bottom-left-radius: var(--tainacan-dropdownmenu-border-radius);
border-bottom-right-radius: var(--tainacan-dropdownmenu-border-radius);
border-top-right-radius: 0px;
border-top-left-radius: 0px;
border-top: 0px; border-top: 0px;
margin-top: -1px; margin-top: -1px;
height: auto; height: auto;

4
src/views/admin/components/other/checkbox-radio-metadata-input.vue
View File

@ -1034,6 +1034,10 @@
.tainacan-finder-columns-container { .tainacan-finder-columns-container {
background-color: var(--tainacan-white); background-color: var(--tainacan-white);
border: 1px solid var(--tainacan-gray1); border: 1px solid var(--tainacan-gray1);
border-bottom-left-radius: var(--tainacan-dropdownmenu-border-radius);
border-bottom-right-radius: var(--tainacan-dropdownmenu-border-radius);
border-top-right-radius: 0px;
border-top-left-radius: 0px;
border-top: 0px; border-top: 0px;
margin-top: -1px; margin-top: -1px;
display: flex; display: flex;

10
src/views/admin/components/search/advanced-search.vue
View File

@ -143,7 +143,7 @@
<div class="field"> <div class="field">
<button <button
@click.prevent="removeCriterion(searchCriterion)" @click.prevent="removeCriterion(searchCriterion)"
class="button is-white is-pulled-right has-text-secondary" class="button button-remove-criterion is-pulled-right has-text-secondary"
type="button" type="button"
:aria-label="$i18n.get('remove_search_criterion')"> :aria-label="$i18n.get('remove_search_criterion')">
<span <span
@ -651,6 +651,7 @@
.tnc-advanced-search-container { .tnc-advanced-search-container {
position: relative; position: relative;
padding: 1.25em; padding: 1.25em;
border-radius: var(--tainacan-dropdownmenu-border-radius, 0px);
h3 { h3 {
font-size: 1em !important; font-size: 1em !important;
@ -683,6 +684,13 @@
margin-right: 1em; margin-right: 1em;
} }
.button-remove-criterion {
color: var(--tainacan-input-color);
background: transparent;
border: none;
border-radius: var(--tainacan-button-border-radius, 4px);
}
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
.is-12>.columns { .is-12>.columns {
flex-wrap: wrap; flex-wrap: wrap;

2
src/views/admin/components/search/filters-tags-list.vue
View File

@ -213,7 +213,7 @@
} }
.filter-tag { .filter-tag {
border-radius: 3px; border-radius: var(--tainacan-button-border-radius, 4px);
padding: 3px 8px 2px 8px; padding: 3px 8px 2px 8px;
position: relative; position: relative;
background-color: var(--tainacan-input-background-color); background-color: var(--tainacan-input-background-color);

2
src/views/admin/pages/lists/activities-page.vue
View File

@ -671,7 +671,7 @@
.button { .button {
display: flex; display: flex;
align-items: center; align-items: center;
border-radius: 0px !important; border-radius: var(--tainacan-button-border-radius, 4px) !important;
height: 100% !important; height: 100% !important;
} }

4
src/views/admin/scss/_buttons.scss
View File

@ -17,7 +17,7 @@ button.link-style:active {
} }
} }
.button { .button {
border-radius: 4px !important; border-radius: var(--tainacan-button-border-radius, 4px) !important;
min-height: 2.125em; min-height: 2.125em;
font-weight: normal; font-weight: normal;
text-transform: inherit; text-transform: inherit;
@ -117,7 +117,7 @@ kbd {
border-left-width: 2px; border-left-width: 2px;
border-right-width: 3px; border-right-width: 3px;
border-bottom-width: 4px; border-bottom-width: 4px;
border-radius: 4px; border-radius: var(--tainacan-button-border-radius, 4px);
border-style: solid; border-style: solid;
border-color: var(--tainacan-gray2, #dbdbdb); border-color: var(--tainacan-gray2, #dbdbdb);
border-bottom-color: var(--tainacan-gray3, #a5a5a5); border-bottom-color: var(--tainacan-gray3, #a5a5a5);

3
src/views/admin/scss/_custom_variables.scss
View File

@ -45,6 +45,9 @@
--tainacan-label-color: var(--tainacan-gray5); --tainacan-label-color: var(--tainacan-gray5);
--tainacan-info-color: var(--tainacan-gray4); --tainacan-info-color: var(--tainacan-gray4);
--tainacan-heading-color: var(--tainacan-black); --tainacan-heading-color: var(--tainacan-black);
--tainacan-input-border-radius: #{$tainacan-input-border-radius};
--tainacan-button-border-radius: #{$tainacan-button-border-radius};
--tainacan-dropdownmenu-border-radius: #{$tainacan-dropdownmenu-border-radius};
// Skeleton color // Skeleton color
--tainacan-skeleton-color: #{$skeleton-color}; --tainacan-skeleton-color: #{$skeleton-color};

6
src/views/admin/scss/_dropdown-and-autocomplete.scss
View File

@ -29,7 +29,7 @@
font-size: 1em; font-size: 1em;
padding: 0px; padding: 0px;
margin-top: 0; margin-top: 0;
border-radius: 0px; border-radius: var(--tainacan-dropdownmenu-border-radius, 0px);
min-width: 6em; min-width: 6em;
border: none; border: none;
z-index: 999991; z-index: 999991;
@ -37,7 +37,7 @@
.dropdown-content { .dropdown-content {
padding: 0px 0px 1px 0px; padding: 0px 0px 1px 0px;
border-radius: 0px !important; border-radius: var(--tainacan-dropdownmenu-border-radius, 0px) !important;
max-height: 240px; max-height: 240px;
overflow-y: auto; overflow-y: auto;
box-shadow: none; box-shadow: none;
@ -146,7 +146,7 @@
box-shadow: none; box-shadow: none;
} }
.taginput-container { .taginput-container {
border-radius: 1px !important; border-radius: var(--tainacan-input-border-radius, 1px) !important;
padding: 0px !important; padding: 0px !important;
background-color: transparent !important; background-color: transparent !important;

2
src/views/admin/scss/_inputs.scss
View File

@ -20,7 +20,7 @@ input[type="week"].input {
line-height: 1em; line-height: 1em;
font-size: 0.875em; font-size: 0.875em;
font-family: var(--tainacan-font-family, inherit); font-family: var(--tainacan-font-family, inherit);
border-radius: 1px !important; border-radius: var(--tainacan-input-border-radius, 1px) !important;
box-shadow: none !important; box-shadow: none !important;
background-color: var(--tainacan-input-background-color); background-color: var(--tainacan-input-background-color);
border: 1px solid var(--tainacan-input-border-color); border: 1px solid var(--tainacan-input-border-color);

4
src/views/admin/scss/_modals.scss
View File

@ -69,7 +69,7 @@
.tainacan-modal-content { .tainacan-modal-content {
font-family: var(--tainacan-font-family, inherit); font-family: var(--tainacan-font-family, inherit);
font-size: 1rem; font-size: 1rem;
border-radius: 0px; border-radius: var(--tainacan-dropdownmenu-border-radius, 0px);
background-color: var(--tainacan-background-color); background-color: var(--tainacan-background-color);
padding: 40px var(--tainacan-one-column); padding: 40px var(--tainacan-one-column);
padding: 40px 4.166666667vw; padding: 40px 4.166666667vw;
@ -166,7 +166,7 @@
width: 100%; width: 100%;
.button { .button {
border-radius: 4px !important; border-radius: var(--tainacan-button-border-radius, 4px) !important;
font-weight: normal; font-weight: normal;
padding: 2px 15px !important; padding: 2px 15px !important;
margin-top: 0px !important; margin-top: 0px !important;

4
src/views/admin/scss/_selects.scss
View File

@ -1,6 +1,6 @@
.select { .select {
padding-top: 0px !important; padding-top: 0px !important;
border-radius: 1px; border-radius: var(--tainacan-input-border-radius, 1px);
&, &,
&:not(.is-multiple) { &:not(.is-multiple) {
@ -12,7 +12,7 @@
select { select {
background: transparent; // WordPress 5.3 adds arrows here background: transparent; // WordPress 5.3 adds arrows here
border: none; border: none;
border-radius: 1px !important; border-radius: var(--tainacan-input-border-radius, 1px) !important;
font-weight: normal; font-weight: normal;
font-size: 0.875em !important; font-size: 0.875em !important;
font-family: var(--tainacan-font-family, inherit); font-family: var(--tainacan-font-family, inherit);

3
src/views/admin/scss/_tainacan-form.scss
View File

@ -78,6 +78,7 @@
height: auto !important; height: auto !important;
text-align: start; text-align: start;
} }
p.cont
button.is-primary:disabled, button.is-primary:disabled,
button.is-primary:disabled:hover, button.is-primary:disabled:hover,
button.is-primary:disabled:focus, button.is-primary:disabled:focus,
@ -172,7 +173,7 @@
justify-content: space-between; justify-content: space-between;
width: 100%; width: 100%;
border: 1px solid var(--tainacan-input-border-color) !important; border: 1px solid var(--tainacan-input-border-color) !important;
border-radius: 0 !important; border-radius: var(--tainacan-input-border-radius, 1px) !important;
padding: 2px 14px 2px 18px !important padding: 2px 14px 2px 18px !important
} }
} }

5
src/views/admin/scss/_variables.scss
View File

@ -63,6 +63,11 @@ $yellow2-invert: findColorInvert($yellow2);
$tainacan-input-color: #1d1d1d; $tainacan-input-color: #1d1d1d;
$tainacan-input-color-invert: findColorInvert($tainacan-input-color); $tainacan-input-color-invert: findColorInvert($tainacan-input-color);
// Input border radius
$tainacan-input-border-radius: 1px;
$tainacan-button-border-radius: 4px;
$tainacan-dropdownmenu-border-radius: 0px;
// Skeleton colors // Skeleton colors
$skeleton-color: #eeeeee; $skeleton-color: #eeeeee;
$skeleton-color-invert: findColorInvert(#eeeeee); $skeleton-color-invert: findColorInvert(#eeeeee);

6
src/views/gutenberg-blocks/blocks/item-submission-form/style.scss
View File

@ -157,7 +157,7 @@
height: 1.5em; height: 1.5em;
width: 18%; width: 18%;
border: 2px solid var(--tainacan-input-border-color, rgba(200,200,200, 0.3)); border: 2px solid var(--tainacan-input-border-color, rgba(200,200,200, 0.3));
border-radius: 3px; border-radius: var(--tainacan-input-border-radius, 1px);
display: inline-block; display: inline-block;
} }
.fake-textarea { .fake-textarea {
@ -165,7 +165,7 @@
height: 2.5em; height: 2.5em;
width: 100%; width: 100%;
border: 2px solid var(--tainacan-input-border-color, rgba(200,200,200, 0.3)); border: 2px solid var(--tainacan-input-border-color, rgba(200,200,200, 0.3));
border-radius: 3px; border-radius: var(--tainacan-input-border-radius, 1px);
display: inline-block; display: inline-block;
} }
.fake-button { .fake-button {
@ -176,7 +176,7 @@
max-width: 3.45em; max-width: 3.45em;
min-width: 1em; min-width: 1em;
margin-left: 6px; margin-left: 6px;
border-radius: 3px; border-radius: var(--tainacan-button-border-radius, 4px);
display: flex; display: flex;
align-items: center; align-items: center;
margin-right: auto; margin-right: auto;