diff --git a/frontend/configuration.properties.js b/frontend/configuration.properties.js index dfc8e9a..95796d6 100755 --- a/frontend/configuration.properties.js +++ b/frontend/configuration.properties.js @@ -259,6 +259,12 @@ // The label for the export button exportButtonLabel: 'Export', }, + + // These properties configure the default properties for FacetResults component in the UI. + FacetResults: { + hideFacet: [ // The facet field names that should be hidden from the FacetResults + ], + }, // These properties configure the default values for properties of any Searcher components, // which are used by their child components to perform the searches of the index. diff --git a/frontend/src/style/bootstrap/attivio-facet-tabs.less b/frontend/src/style/bootstrap/attivio-facet-tabs.less new file mode 100644 index 0000000..d1a3225 --- /dev/null +++ b/frontend/src/style/bootstrap/attivio-facet-tabs.less @@ -0,0 +1,43 @@ +.facet-tab-container{ + width: 100%; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-between; + align-content: center; + align-items: center; + border-radius: 5px; +} + +.facet-tab { + order: 0; + flex: 1 1 auto; + align-self: auto; + margin-top: 0.6em; + margin-bottom: 0.6em; + margin-left: 0.7em; + margin-right: 0.7em; + padding-top: 0.5em; + padding-bottom: 0.5em; + padding-left: 0.5em; + padding-right: 0.5em; + min-height: auto; + display: flex; + align-items: center; + border-radius: 5px; + background-color: white; + transition: all .2s ease-in-out; + cursor: pointer; +} + +.facet-tab-text { + width: 100%; + text-align: center; + color: #363f45; + font-weight: bold; +} + +.facet-tab:hover { + background-color: #f9f9f9; + transform: scale(1.01); +} diff --git a/frontend/src/style/bootstrap/bootstrap.less b/frontend/src/style/bootstrap/bootstrap.less index 72b523f..f7d7562 100755 --- a/frontend/src/style/bootstrap/bootstrap.less +++ b/frontend/src/style/bootstrap/bootstrap.less @@ -93,3 +93,4 @@ @import "attivio-templates.less"; @import (inline) "../../../node_modules/react-dates/lib/css/_datepicker.css"; @import "attivio-date-picker.less"; +@import "attivio-facet-tabs.less";