Skip to content

Commit

Permalink
IBX-9069: Initial Product Tab (#1397)
Browse files Browse the repository at this point in the history
  • Loading branch information
tischsoic authored Dec 20, 2024
1 parent c4dfa51 commit ac4bae7
Show file tree
Hide file tree
Showing 45 changed files with 1,376 additions and 407 deletions.
Original file line number Diff line number Diff line change
@@ -1,20 +1,30 @@
@import 'universal-discovery/mixins/collapsible-arrow';
@import 'universal-discovery/mixins/filters-panel';
@import 'universal-discovery/mixins/filters-row';
@import 'universal-discovery/mixins/selected.items.panel.item';
@import 'universal-discovery/mixins/selected.items.panel';

@import 'universal-discovery/main';
@import 'universal-discovery/tab';
@import 'universal-discovery/top.menu';
@import 'universal-discovery/top.menu.search.input';
@import 'universal-discovery/actions.menu';
@import 'universal-discovery/collapsible';
@import 'universal-discovery/content.create';
@import 'universal-discovery/content.create.widget';
@import 'universal-discovery/content.create.button';
@import 'universal-discovery/content.edit';
@import 'universal-discovery/content.edit.button';
@import 'universal-discovery/content.type.selector.list';
@import 'universal-discovery/sort.switcher';
@import 'universal-discovery/view.switcher';
@import 'universal-discovery/tab.selector';
@import 'universal-discovery/finder';
@import 'universal-discovery/finder.branch';
@import 'universal-discovery/finder.leaf';
@import 'universal-discovery/content.meta.preview';
@import 'universal-discovery/selected.items.panel.item';
@import 'universal-discovery/selected.items.panel';
@import 'universal-discovery/selected.locations';
@import 'universal-discovery/selected.locations.item';
@import 'universal-discovery/grid';
Expand All @@ -23,6 +33,8 @@
@import 'universal-discovery/search.tags';
@import 'universal-discovery/content.table.item';
@import 'universal-discovery/content.table';
@import 'universal-discovery/filters-panel';
@import 'universal-discovery/filters-row';
@import 'universal-discovery/filters';
@import 'universal-discovery/bookmarks.list';
@import 'universal-discovery/translation.selector';
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
.c-collapsible {
$self: &;

& + .c-filters-row,
& + .c-filters__row {
border-top: calculateRem(1px) solid $ibexa-color-light;
}

&--hidden {
#{$self} {
&__title {
box-shadow: none;
border-bottom-color: transparent;

&:before {
transform: rotate(135deg);
}

&:after {
transform: rotate(-135deg);
}
}

&__content {
transform: scaleY(0);
opacity: 0;
height: 0;
}
}
}

&__title {
position: relative;
cursor: pointer;
padding: 0 calculateRem(24px);
font-size: $ibexa-text-font-size-medium;
font-weight: 600;
min-height: calculateRem(40px);
display: flex;
align-items: center;
border-style: solid;
border-color: $ibexa-color-light;
border-width: calculateRem(1px) 0;
box-shadow: calculateRem(4px) calculateRem(22px) calculateRem(47px) 0 rgba($ibexa-color-info, 0.05);

@include collapsible-arrow;
}

&__content {
transform: scaleY(1);
transform-origin: top center;
}

&__content-wrapper {
padding: calculateRem(16px) calculateRem(24px);
}

&__list {
padding: 0;
margin-bottom: 0;
list-style-type: none;
}

&__list-item {
padding: calculateRem(6px) 0;

.form-check {
width: 100%;
}

.form-check-label {
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
}

.ibexa-input--checkbox {
margin-right: calculateRem(8px);
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
.c-content-type-selector-list {
padding: 0;
margin-bottom: 0;
list-style-type: none;

&__item {
padding: calculateRem(6px) 0;

.form-check {
width: 100%;
}

.form-check-label {
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
}

.ibexa-input--checkbox {
margin-right: calculateRem(8px);
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.c-filters-panel {
@include c-filters-panel('.c-filters-row');
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.c-filters-row {
@include c-filters-row('__title');
}
Original file line number Diff line number Diff line change
@@ -1,145 +1,11 @@
.c-filters {
position: relative;
width: 100%;
height: 100%;
overflow: auto;
padding-bottom: calculateRem(24px);

&__header {
display: flex;
position: sticky;
top: 0;
background-color: $ibexa-color-white;
z-index: 2;
align-items: center;
justify-content: space-between;
padding: calculateRem(16px) calculateRem(12px);
border-bottom: calculateRem(1px) solid $ibexa-color-light;
}

&__header-content {
font-size: $ibexa-text-font-size-large;
font-weight: 600;
margin-right: calculateRem(8px);
}

&__header-actions {
display: flex;
flex-wrap: nowrap;
}

&__row-title {
position: relative;
font-size: $ibexa-text-font-size-medium;
font-weight: 600;
min-height: calculateRem(40px);
display: flex;
align-items: center;
}

&__collapsible {
& + .c-filters__row {
border-top: calculateRem(1px) solid $ibexa-color-light;
}

&--hidden {
.c-filters {
&__collapsible-title {
box-shadow: none;
border-bottom-color: transparent;

&:before {
transform: rotate(135deg);
}

&:after {
transform: rotate(-135deg);
}
}

&__collapsible-content {
transform: scaleY(0);
opacity: 0;
height: 0;
}
}
}
}

&__collapsible-title {
position: relative;
cursor: pointer;
padding: 0 calculateRem(24px);
font-size: $ibexa-text-font-size-medium;
font-weight: 600;
min-height: calculateRem(40px);
display: flex;
align-items: center;
border-style: solid;
border-color: $ibexa-color-light;
border-width: calculateRem(1px) 0;
box-shadow: calculateRem(4px) calculateRem(22px) calculateRem(47px) 0 rgba($ibexa-color-info, 0.05);

&::before,
&::after {
content: '';
position: absolute;
z-index: 1;
top: 50%;
width: calculateRem(6px);
height: calculateRem(1px);
background: $ibexa-color-dark;
}

&::before {
transform: rotate(225deg);
right: calculateRem(12px);
}

&::after {
transform: rotate(-225deg);
right: calculateRem(16px);
}
}

&__collapsible-content {
transform: scaleY(1);
transform-origin: top center;
}

&__collapsible-content-wrapper {
padding: calculateRem(16px) calculateRem(24px);
}
@include c-filters-panel('.c-filters__row');

&__row {
padding: calculateRem(4px) calculateRem(24px);
@include c-filters-row('-title');

&--language {
padding-bottom: calculateRem(16px);
}
}

&__collapsible-list {
padding: 0;
margin-bottom: 0;
list-style-type: none;
}

&__collapsible-list-item {
padding: calculateRem(6px) 0;

.form-check {
width: 100%;
}

.form-check-label {
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
}

.ibexa-input--checkbox {
margin-right: calculateRem(8px);
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -19,13 +19,15 @@
height: 100%;
}

&__sidebar {
display: flex;
&__content-meta-preview:not(:empty) {
flex: 1;
height: 100%;
min-width: calculateRem(270px);
margin-right: calculateRem(24px);
border-right: calculateRem(1px) solid $ibexa-color-light;
background-color: $ibexa-color-white;
overflow: auto;
border-left: calculateRem(1px) solid $ibexa-color-light;
}

&__filters {
border-left: calculateRem(1px) solid $ibexa-color-light;
}

&__spinner-wrapper {
Expand All @@ -41,12 +43,13 @@
}

&__content {
flex: 2;
display: flex;
flex-direction: column;
overflow: auto;
width: 100%;
flex-shrink: 1;
padding: 0 calculateRem(8px);
padding: calculateRem(24px);
background-color: $ibexa-color-white;
position: relative;
}
Expand All @@ -73,7 +76,6 @@
display: grid;
grid-template: 'title clear-search-btn' 'subtitle subtitle';
justify-content: start;
margin-top: calculateRem(16px);
}

&__table-tile {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.c-selected-items-panel-item {
@include c-selected-items-panel-item;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.c-selected-items-panel {
@include c-selected-items-panel;
}
Loading

0 comments on commit ac4bae7

Please sign in to comment.