haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-20 02:48:51 +00:00
Code Issues Releases Wiki Activity

feat: metadata hide image location (#6591)

Browse Source 
* feat: metadata hide image location

* feat: update code

* feat: update code

* feat: update code

---------

Co-authored-by: 杨国璇 <ygx@Hello-word.local>
This commit is contained in:
杨国璇
2024-08-20 18:16:05 +08:00
committed by GitHub
parent f5a74a1b42
commit b030693def
11 changed files with 107 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/css/lib-content-view.css
View File

@@ -381,6 +381,7 @@
} }
.cur-view-container .cur-view-path .cur-view-path-left { .cur-view-container .cur-view-path .cur-view-path-left {
flex: 1;
border-bottom: none; border-bottom: none;
transition-property: all; transition-property: all;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

1
frontend/src/metadata/metadata-view/_basic/constants/column/common.js
View File

@@ -9,6 +9,7 @@ export const NOT_DISPLAY_COLUMN_KEYS = [
PRIVATE_COLUMN_KEY.OBJ_ID, PRIVATE_COLUMN_KEY.OBJ_ID,
PRIVATE_COLUMN_KEY.SUFFIX, PRIVATE_COLUMN_KEY.SUFFIX,
PRIVATE_COLUMN_KEY.FILE_DETAILS, PRIVATE_COLUMN_KEY.FILE_DETAILS,
PRIVATE_COLUMN_KEY.LOCATION,
]; ];
export const VIEW_NOT_DISPLAY_COLUMN_KEYS = [ export const VIEW_NOT_DISPLAY_COLUMN_KEYS = [

24
frontend/src/metadata/metadata-view/components/popover/filter-popover/widgets/filter-item-utils.js
View File

@@ -12,8 +12,8 @@ class FilterItemUtils {
value: { column }, value: { column },
label: ( label: (
<Fragment> <Fragment>
<span className="filter-header-icon"><Icon iconName={COLUMNS_ICON_CONFIG[type]} /></span> <span className="sf-metadata-filter-header-icon"><Icon iconName={COLUMNS_ICON_CONFIG[type]} /></span>
<span className='select-option-name'>{name}</span> <span className="select-option-name">{name}</span>
</Fragment> </Fragment>
) )
}; };
@@ -22,14 +22,14 @@ class FilterItemUtils {
static generatorPredicateOption(filterPredicate) { static generatorPredicateOption(filterPredicate) {
return { return {
value: { filterPredicate }, value: { filterPredicate },
label: <span className='select-option-name'>{FILTER_PREDICATE_SHOW[filterPredicate]}</span> label: <span className="select-option-name">{FILTER_PREDICATE_SHOW[filterPredicate]}</span>
}; };
} }
static generatorTermModifierOption(filterTermModifier) { static generatorTermModifierOption(filterTermModifier) {
return { return {
value: { filterTermModifier }, value: { filterTermModifier },
label: <span className='select-option-name'>{FILTER_TERM_MODIFIER_SHOW[filterTermModifier]}</span> label: <span className="select-option-name">{FILTER_TERM_MODIFIER_SHOW[filterTermModifier]}</span>
}; };
} }
@@ -37,9 +37,9 @@ class FilterItemUtils {
return { return {
value: { columnOption: option }, value: { columnOption: option },
label: ( label: (
<div className='select-option-name single-option-name'> <div className="select-option-name single-option-name">
<div className="single-select-option" style={{ background: option.color, color: option.textColor || null }} title={option.name} aria-label={option.name}>{option.name}</div> <div className="single-select-option" style={{ background: option.color, color: option.textColor || null }} title={option.name} aria-label={option.name}>{option.name}</div>
<div className='single-check-icon'> <div className="single-check-icon">
{selectedOption?.id === option.id && (<Icon iconName="check-mark" />)} {selectedOption?.id === option.id && (<Icon iconName="check-mark" />)}
</div> </div>
</div> </div>
@@ -51,9 +51,9 @@ class FilterItemUtils {
return { return {
value: { columnOption: option }, value: { columnOption: option },
label: ( label: (
<div className='select-option-name multiple-option-name'> <div className="select-option-name multiple-option-name">
<div className="multiple-select-option" style={{ background: option.color, color: option.textColor }} title={option.name} aria-label={option.name}>{option.name}</div> <div className="multiple-select-option" style={{ background: option.color, color: option.textColor }} title={option.name} aria-label={option.name}>{option.name}</div>
<div className='multiple-check-icon'> <div className="multiple-check-icon">
{filterTerm.indexOf(option.id) > -1 && (<Icon iconName="check-mark" />)} {filterTerm.indexOf(option.id) > -1 && (<Icon iconName="check-mark" />)}
</div> </div>
</div> </div>
@@ -65,11 +65,11 @@ class FilterItemUtils {
return [ return [
{ {
value: { filterConjunction: 'And' }, value: { filterConjunction: 'And' },
label: (<span className='select-option-name'>{gettext('And')}</span>) label: (<span className="select-option-name">{gettext('And')}</span>)
}, },
{ {
value: { filterConjunction: 'Or' }, value: { filterConjunction: 'Or' },
label: (<span className='select-option-name'>{gettext('Or')}</span>) label: (<span className="select-option-name">{gettext('Or')}</span>)
} }
]; ];
} }
@@ -78,12 +78,12 @@ class FilterItemUtils {
if (conjunction === 'And') { if (conjunction === 'And') {
return { return {
value: { filterConjunction: 'And' }, value: { filterConjunction: 'And' },
label: (<span className='select-option-name'>{gettext('And')}</span>) label: (<span className="select-option-name">{gettext('And')}</span>)
}; };
} }
return { return {
value: { filterConjunction: 'Or' }, value: { filterConjunction: 'Or' },
label: (<span className='select-option-name'>{gettext('Or')}</span>) label: (<span className="select-option-name">{gettext('Or')}</span>)
}; };
} }
} }

4
frontend/src/metadata/metadata-view/components/popover/filter-popover/widgets/filter-item/collaborator-filter/index.css
View File

@@ -1,9 +1,9 @@
.sf-metadata-selector-collaborator.sf-metadata-select .option { .sf-metadata-selector-collaborator.sf-metadata-select .sf-metadata-option {
line-height: 20px; line-height: 20px;
padding: 5px 10px 5px 10px !important; padding: 5px 10px 5px 10px !important;
} }
.sf-metadata-selector-collaborator.sf-metadata-select .option:hover { .sf-metadata-selector-collaborator.sf-metadata-select .sf-metadata-option:hover {
background-color: #f7f7f7; background-color: #f7f7f7;
color: #212529; color: #212529;
} }

12
frontend/src/metadata/metadata-view/components/popover/filter-popover/widgets/filter-item/index.css
View File

@@ -4,8 +4,8 @@
margin: 0; margin: 0;
} }
.sf-metadata-filters .filters-list .single-select-option, .sf-metadata-filters .sf-metadata-filters-list .single-select-option,
.sf-metadata-filters .filters-list .multiple-select-option { .sf-metadata-filters .sf-metadata-filters-list .multiple-select-option {
border-radius: 10px; border-radius: 10px;
display: block; display: block;
font-size: 13px; font-size: 13px;
@@ -21,14 +21,14 @@
width: min-content; width: min-content;
} }
.sf-metadata-selector-single-select .option, .sf-metadata-selector-single-select .sf-metadata-option,
.sf-metadata-selector-multiple-select .option { .sf-metadata-selector-multiple-select .sf-metadata-option {
height: 30px; height: 30px;
padding: 0 10px; padding: 0 10px;
} }
.sf-metadata-selector-single-select .option:hover, .sf-metadata-selector-single-select .sf-metadata-option:hover,
.sf-metadata-selector-multiple-select .option:hover { .sf-metadata-selector-multiple-select .sf-metadata-option:hover {
background-color: #f7f7f7; background-color: #f7f7f7;
color: #212529; color: #212529;
} }

136
frontend/src/metadata/metadata-view/components/popover/filter-popover/widgets/index.css
View File

@@ -1,97 +1,97 @@
.filters-list { .sf-metadata-filters-list {
min-height: 120px; min-height: 120px;
max-height: 100%; max-height: 100%;
padding: 15px; padding: 15px;
} }
.filters-list.empty-filters-container { .sf-metadata-filters-list.empty-filters-container {
min-height: 80px; min-height: 80px;
padding: 16px; padding: 16px;
} }
.filters-list.empty-filters-container .empty-filters-list { .sf-metadata-filters-list.empty-filters-container .empty-filters-list {
padding-left: 0; padding-left: 0;
} }
.filters-list .empty-filters-list { .sf-metadata-filters-list .empty-filters-list {
padding: 0.25rem; padding: 0.25rem;
font-size: 14px; font-size: 14px;
color: #666666; color: #666666;
} }
.filters-list .filter-item { .sf-metadata-filters-list .filter-item {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0.25rem 0; padding: 0.25rem 0;
} }
.filters-list .filter-item .condition { .sf-metadata-filters-list .filter-item .condition {
display: flex; display: flex;
flex: 1; flex: 1;
} }
.filters-list .filter-item .condition > div { .sf-metadata-filters-list .filter-item .condition > div {
height: 38px; height: 38px;
line-height: 38px; line-height: 38px;
margin-left: 0.5rem; margin-left: 0.5rem;
} }
.filters-list .filter-item .condition > div:first-child { .sf-metadata-filters-list .filter-item .condition > div:first-child {
margin-left: 0; margin-left: 0;
} }
.filters-list .filter-item .filter-term { .sf-metadata-filters-list .filter-item .filter-term {
max-width: 300px; max-width: 300px;
} }
.filters-list .filter-item .filter-term .option-group-content .option.option-active .sf-metadata-icon { .sf-metadata-filters-list .filter-item .filter-term .sf-metadata-option-group-content .option.option-active .sf-metadata-icon {
color: #798d99; color: #798d99;
} }
.filters-list .filter-conjunction { .sf-metadata-filters-list .filter-conjunction {
width: 72px; width: 72px;
} }
.filters-list .filter-conjunction-readonly { .sf-metadata-filters-list .filter-conjunction-readonly {
width: 52px; width: 52px;
} }
.filters-list .filter-container { .sf-metadata-filters-list .filter-container {
width: calc(100% - 72px); width: calc(100% - 72px);
display: flex; display: flex;
} }
.filters-list .sf-metadata-select .selected-option-show { .sf-metadata-filters-list .sf-metadata-select .selected-option-show {
width: calc(100% - 20px); width: calc(100% - 20px);
height: 20px; height: 20px;
line-height: 20px; line-height: 20px;
} }
.filters-list .sf-metadata-select.disabled .selected-option-show { .sf-metadata-filters-list .sf-metadata-select.disabled .selected-option-show {
width: 100%; width: 100%;
} }
.filters-list .sf-metadata-select .selected-option { .sf-metadata-filters-list .sf-metadata-select .selected-option {
width: auto; width: auto;
overflow-x: auto; overflow-x: auto;
line-height: 1.5; line-height: 1.5;
} }
.filters-list .sf-metadata-select .sf-metadata-icon-drop-down { .sf-metadata-filters-list .sf-metadata-select .sf-metadata-icon-drop-down {
margin-left: 0.5rem; margin-left: 0.5rem;
} }
.filters-list .selected-conjunction-show { .sf-metadata-filters-list .selected-conjunction-show {
padding: 0 10px; padding: 0 10px;
color: #666666; color: #666666;
} }
.filters-list .filter-column { .sf-metadata-filters-list .filter-column {
max-width: 150px; max-width: 150px;
} }
.filter-term .selector-multiple-select .option, .filter-term .selector-multiple-select .sf-metadata-option,
.filter-term .selector-single-select .option { .filter-term .selector-single-select .sf-metadata-option {
height: 30px; height: 30px;
padding: 0 10px; padding: 0 10px;
} }
@@ -101,41 +101,41 @@
margin-top: 5px; margin-top: 5px;
} }
.filter-term .selector-single-select .option:hover { .filter-term .selector-single-select .sf-metadata-option:hover {
color: #212529; color: #212529;
background-color: #f7f7f7; background-color: #f7f7f7;
} }
.filter-term .selector-single-select .option:hover .select-option-name, .filter-term .selector-single-select .sf-metadata-option:hover .select-option-name,
.filter-term .selector-multiple-select .option:hover .select-option-name, .filter-term .selector-multiple-select .sf-metadata-option:hover .select-option-name,
.filter-term .selector-collaborator .option:hover .select-option-name { .filter-term .selector-collaborator .sf-metadata-option:hover .select-option-name {
color: unset; color: unset;
} }
.filters-list .selector-collaborator .selected-option-show { .sf-metadata-filters-list .selector-collaborator .selected-option-show {
text-overflow: unset; text-overflow: unset;
} }
.filters-list .selector-multiple-select .option:hover, .sf-metadata-filters-list .selector-multiple-select .sf-metadata-option:hover,
.filters-list .selector-multiple-select .option.option-active, .sf-metadata-filters-list .selector-multiple-select .sf-metadata-option.sf-metadata-option-active,
.filters-list .selector-collaborator .option:hover, .sf-metadata-filters-list .selector-collaborator .sf-metadata-option:hover,
.filters-list .selector-collaborator .option.option-active { .sf-metadata-filters-list .selector-collaborator .sf-metadata-option.sf-metadata-option-active {
color: #212529; color: #212529;
background-color: #f7f7f7; background-color: #f7f7f7;
} }
.filters-list .selector-multiple-select .option.option-active .select-option-name, .sf-metadata-filters-list .selector-multiple-select .sf-metadata-option.sf-metadata-option-active .select-option-name,
.filters-list .selector-collaborator .option.option-active .select-option-name { .sf-metadata-filters-list .selector-collaborator .sf-metadata-option.sf-metadata-option-active .select-option-name {
color: #212529; color: #212529;
} }
.filters-list .selected-option .multiple-select-option, .sf-metadata-filters-list .selected-option .multiple-select-option,
.filters-list .selected-option .single-select-option { .sf-metadata-filters-list .selected-option .single-select-option {
margin: 0; margin: 0;
display: inline-block; display: inline-block;
} }
.filters-list .filter-term input { .sf-metadata-filters-list .filter-term input {
display: flex; display: flex;
width: 100%; width: 100%;
height: 38px; height: 38px;
@@ -147,19 +147,19 @@
font-size: 0.875rem; font-size: 0.875rem;
} }
.filters-list .filter-term input:hover { .sf-metadata-filters-list .filter-term input:hover {
border-color: rgb(179, 179, 179); border-color: rgb(179, 179, 179);
} }
.filters-list .filter-term input:disabled:hover { .sf-metadata-filters-list .filter-term input:disabled:hover {
border-color: rgba(0, 40, 100, 0.12); border-color: rgba(0, 40, 100, 0.12);
} }
.filters-list .filter-term input:hover:focus { .sf-metadata-filters-list .filter-term input:hover:focus {
border-color: #1991eb; border-color: #1991eb;
} }
.filters-list .filter-term input:focus { .sf-metadata-filters-list .filter-term input:focus {
color: #495057; color: #495057;
background-color: #fff; background-color: #fff;
border-color: #1991eb; border-color: #1991eb;
@@ -167,22 +167,22 @@
box-shadow: 0 0 0 2px rgba(70, 127, 207, 0.25); box-shadow: 0 0 0 2px rgba(70, 127, 207, 0.25);
} }
.filters-list .filter-term .date-picker-container input:focus { .sf-metadata-filters-list .filter-term .date-picker-container input:focus {
color: #495057; color: #495057;
background-color: #fff; background-color: #fff;
border: 1px solid #fff; border: 1px solid #fff;
outline: 0; outline: 0;
} }
.filters-list .filter-term .date-picker-container table tr { .sf-metadata-filters-list .filter-term .date-picker-container table tr {
height: 30px; height: 30px;
} }
.filters-list .filter-term input[type='checkbox'] { .sf-metadata-filters-list .filter-term input[type='checkbox'] {
width: inherit; width: inherit;
} }
.filters-list .filter-term input[type='checkbox']:focus { .sf-metadata-filters-list .filter-term input[type='checkbox']:focus {
border: 0; border: 0;
box-shadow: none; box-shadow: none;
} }
@@ -193,14 +193,14 @@
border: 1px solid rgba(0, 40, 100, 0.12); border: 1px solid rgba(0, 40, 100, 0.12);
} }
.filters-list .delete-filter { .sf-metadata-filters-list .delete-filter {
width: 12px; width: 12px;
height: 20px; height: 20px;
margin-right: 14px; margin-right: 14px;
text-align: center; text-align: center;
} }
.filters-list .delete-filter:hover { .sf-metadata-filters-list .delete-filter:hover {
cursor: pointer; cursor: pointer;
} }
@@ -214,13 +214,13 @@
fill: #666; fill: #666;
} }
.filters-list .multiple-option-name { .sf-metadata-filters-list .multiple-option-name {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.filters-list .multiple-check-icon, .sf-metadata-filters-list .multiple-check-icon,
.filters-list .collaborator-check-icon { .sf-metadata-filters-list .collaborator-check-icon {
display: inline-flex; display: inline-flex;
width: 20px; width: 20px;
height: 20px; height: 20px;
@@ -228,8 +228,8 @@
text-align: center; text-align: center;
} }
.filters-list .multiple-check-icon .sf-metadata-icon-check-mark, .sf-metadata-filters-list .multiple-check-icon .sf-metadata-icon-check-mark,
.filters-list .collaborator-check-icon .sf-metadata-icon-check-mark { .sf-metadata-filters-list .collaborator-check-icon .sf-metadata-icon-check-mark {
fill: #798d99; fill: #798d99;
font-size: 12px; font-size: 12px;
} }
@@ -246,83 +246,83 @@
background: #eaeaea; background: #eaeaea;
} }
.filters-list .collaborator-show { .sf-metadata-filters-list .collaborator-show {
flex: 1; flex: 1;
} }
.filters-list .collaborator-avatar-container { .sf-metadata-filters-list .collaborator-avatar-container {
width: 16px; width: 16px;
height: 16px; height: 16px;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.filters-list .collaborator-avatar { .sf-metadata-filters-list .collaborator-avatar {
width: 16px; width: 16px;
height: 16px; height: 16px;
border-radius: 50%; border-radius: 50%;
} }
.filters-list .collaborator-name { .sf-metadata-filters-list .collaborator-name {
margin-left: 5px; margin-left: 5px;
max-width: 200px; max-width: 200px;
} }
.filters-list .option-collaborator { .sf-metadata-filters-list .option-collaborator {
display: flex; display: flex;
} }
.filters-list .collaborator-container { .sf-metadata-filters-list .collaborator-container {
flex: 1; flex: 1;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.filters-list .popover-add-tool { .sf-metadata-filters-list .popover-add-tool {
border-top: none; border-top: none;
color: #666666; color: #666666;
} }
.filters-list .popover-add-tool .popover-add-icon { .sf-metadata-filters-list .popover-add-tool .popover-add-icon {
margin-right: 14px; margin-right: 14px;
} }
.filters-list .option-group { .sf-metadata-filters-list .sf-metadata-option-group {
max-height: 360px; max-height: 360px;
overflow: auto; overflow: auto;
} }
.filters-list .filter-container-readonly .sf-metadata-select .selected-option-show, .sf-metadata-filters-list .filter-container-readonly .sf-metadata-select .selected-option-show,
.filters-list .filter-conjunction-readonly .sf-metadata-select .selected-option-show { .sf-metadata-filters-list .filter-conjunction-readonly .sf-metadata-select .selected-option-show {
width: 100%; width: 100%;
} }
.dropdown-item .collaborator, .dropdown-item .collaborator,
.filters-list .option-group .option-group-content .collaborator { .sf-metadata-filters-list .sf-metadata-option-group .sf-metadata-option-group-content .collaborator {
background-color: unset; background-color: unset;
} }
.filters-list .sf-metadata-select .selected-option-show .remove-container { .sf-metadata-filters-list .sf-metadata-select .selected-option-show .remove-container {
display: none; display: none;
} }
.filter-header-icon { .sf-metadata-filter-header-icon {
display: inline-block; display: inline-block;
padding: 0 0.3125rem; padding: 0 0.3125rem;
margin-left: -0.3125rem; margin-left: -0.3125rem;
} }
.filter-header-icon .sf-metadata-icon { .sf-metadata-filter-header-icon .sf-metadata-icon {
font-size: 14px; font-size: 14px;
fill: #aaa; fill: #aaa;
cursor: default; cursor: default;
} }
.option:hover .filter-header-icon .sf-metadata-icon, .sf-metadata-option:hover .sf-metadata-filter-header-icon .sf-metadata-icon,
.option.option-active .filter-header-icon .sf-metadata-icon { .sf-metadata-option.sf-metadata-option-active .sf-metadata-filter-header-icon .sf-metadata-icon {
fill: #fff; fill: #fff;
} }
.option:not(.option-active):hover .filter-header-icon .sf-metadata-icon { .sf-metadata-option:not(.sf-metadata-option-active):hover .sf-metadata-filter-header-icon .sf-metadata-icon {
fill: #aaa; fill: #aaa;
} }

2
frontend/src/metadata/metadata-view/components/popover/filter-popover/widgets/index.js
View File

@@ -109,7 +109,7 @@ class FiltersList extends Component {
let { filters, className, emptyPlaceholder, columns } = this.props; let { filters, className, emptyPlaceholder, columns } = this.props;
const isEmpty = filters.length === 0; const isEmpty = filters.length === 0;
return ( return (
<div className={classnames('filters-list', { 'empty-filters-container': isEmpty }, { [className]: className })}> <div className={classnames('sf-metadata-filters-list', { 'empty-filters-container': isEmpty }, { [className]: className })}>
{isEmpty && <div className="empty-filters-list">{emptyPlaceholder}</div>} {isEmpty && <div className="empty-filters-list">{emptyPlaceholder}</div>}
{!isEmpty && {!isEmpty &&
filters.map((filter, index) => { filters.map((filter, index) => {

12
frontend/src/metadata/metadata-view/components/popover/groupbys-popover/groupbys/groupby-item.js
View File

@@ -74,8 +74,8 @@ const GroupbyItem = memo(({
value: { column }, value: { column },
label: ( label: (
<Fragment> <Fragment>
<span className="filter-header-icon"><Icon iconName={COLUMNS_ICON_CONFIG[type]} /></span> <span className="sf-metadata-filter-header-icon"><Icon iconName={COLUMNS_ICON_CONFIG[type]} /></span>
<span className='select-option-name'>{name}</span> <span className="select-option-name">{name}</span>
</Fragment> </Fragment>
) )
}; };
@@ -90,10 +90,10 @@ const GroupbyItem = memo(({
return [ return [
{ {
value: { sortType: SORT_TYPE.UP }, value: { sortType: SORT_TYPE.UP },
label: <span className='select-option-name'>{gettext('Up')}</span> label: <span className="select-option-name">{gettext('Up')}</span>
}, { }, {
value: { sortType: SORT_TYPE.DOWN }, value: { sortType: SORT_TYPE.DOWN },
label: <span className='select-option-name'>{gettext('Down')}</span> label: <span className="select-option-name">{gettext('Down')}</span>
} }
]; ];
}, []); }, []);
@@ -108,7 +108,7 @@ const GroupbyItem = memo(({
return granularityList.map((granularity) => { return granularityList.map((granularity) => {
return { return {
value: granularity, value: granularity,
label: <span className='select-option-name'>{gettext(displayGranularity[granularity])}</span>, label: <span className="select-option-name">{gettext(displayGranularity[granularity])}</span>,
}; };
}); });
}, [columns, groupby]); }, [columns, groupby]);
@@ -118,7 +118,7 @@ const GroupbyItem = memo(({
const countType = getSelectedCountType(column, count_type); const countType = getSelectedCountType(column, count_type);
if (countType) { if (countType) {
return { return {
label: <span className='select-option-name'>{gettext(countType)}</span> label: <span className="select-option-name">{gettext(countType)}</span>
}; };
} }
}, [column, groupby]); }, [column, groupby]);

4
frontend/src/metadata/metadata-view/components/popover/index.css
View File

@@ -29,3 +29,7 @@
.sf-metadata-filter-popover .popover-add-tool.disabled { .sf-metadata-filter-popover .popover-add-tool.disabled {
color: #c2c2c2; color: #c2c2c2;
} }
.sf-metadata-select.custom-select {
font-size: 14px;
}

12
frontend/src/metadata/metadata-view/components/popover/sort-popover/index.jsx
View File

@@ -151,8 +151,8 @@ class SortPopover extends Component {
value: { column }, value: { column },
label: ( label: (
<Fragment> <Fragment>
<span className="filter-header-icon"><Icon iconName={COLUMNS_ICON_CONFIG[type]} /></span> <span className="sf-metadata-filter-header-icon"><Icon iconName={COLUMNS_ICON_CONFIG[type]} /></span>
<span className='select-option-name'>{name}</span> <span className=''>{name}</span>
</Fragment> </Fragment>
) )
}; };
@@ -163,7 +163,7 @@ class SortPopover extends Component {
return SORT_TYPES.map(sortType => { return SORT_TYPES.map(sortType => {
return { return {
value: { sortType }, value: { sortType },
label: <span className='select-option-name'>{gettext(sortType)}</span> label: <span className="select-option-name">{gettext(sortType)}</span>
}; };
}); });
}; };
@@ -183,15 +183,15 @@ class SortPopover extends Component {
let selectedColumn = { let selectedColumn = {
label: ( label: (
<Fragment> <Fragment>
<span className="filter-header-icon"><Icon iconName={COLUMNS_ICON_CONFIG[type]} /></span> <span className="sf-metadata-filter-header-icon"><Icon iconName={COLUMNS_ICON_CONFIG[type]} /></span>
<span className='select-option-name' title={name} aria-label={name}>{name}</span> <span className="select-option-name" title={name} aria-label={name}>{name}</span>
</Fragment> </Fragment>
) )
}; };
let selectedTypeShow = sort.sort_type; let selectedTypeShow = sort.sort_type;
let selectedSortType = selectedTypeShow && { let selectedSortType = selectedTypeShow && {
label: <span className='select-option-name'>{gettext(selectedTypeShow)}</span> label: <span className="select-option-name">{gettext(selectedTypeShow)}</span>
}; };
return ( return (

14
frontend/src/metadata/metadata-view/components/table/index.css
View File

@@ -395,20 +395,6 @@
flex-direction: column; flex-direction: column;
} }
/* custom table filters */
.table-filters .filters-list .filter-item .filter-term {
max-width: unset;
}
.table-filters .filters-list .sf-metadata-select.custom-select {
max-width: 700px;
}
.table-filters .filters-list .single-select-option,
.table-filters .filters-list .multiple-select-option {
max-width: 250px;
}
.sf-metadata-wrapper .sf-metadata-main { .sf-metadata-wrapper .sf-metadata-main {
flex: 1; flex: 1;
overflow: hidden; overflow: hidden;