From a8c67791b28e832eccd10d093b9463f890e6da5c Mon Sep 17 00:00:00 2001 From: Jakub Brzegowski Date: Sat, 29 Jan 2022 12:46:24 +0100 Subject: [PATCH 1/2] IBX-1348: Create sidebar design fixes - main & UDW --- .../public/scss/_instant-filter.scss | 8 +- .../content/widget/content_create.html.twig | 4 +- .../content.create.widget.js | 107 +++++++++--------- 3 files changed, 65 insertions(+), 54 deletions(-) diff --git a/src/bundle/Resources/public/scss/_instant-filter.scss b/src/bundle/Resources/public/scss/_instant-filter.scss index 6791ceeb58..b0fa4ad472 100644 --- a/src/bundle/Resources/public/scss/_instant-filter.scss +++ b/src/bundle/Resources/public/scss/_instant-filter.scss @@ -6,6 +6,12 @@ } .ibexa-extra-actions--create { + .ibexa-extra-actions { + &__section-content { + width: 75%; + } + } + .ibexa-instant-filter { &__desc { color: $ibexa-color-dark-400; @@ -18,7 +24,7 @@ flex-wrap: wrap; padding-bottom: calculateRem(16px); - &:not(:first-of-type) { + &:not(:last-of-type) { border-bottom: calculateRem(1px) solid $ibexa-color-light; } } diff --git a/src/bundle/Resources/views/themes/admin/content/widget/content_create.html.twig b/src/bundle/Resources/views/themes/admin/content/widget/content_create.html.twig index 1718df58ac..fc2c434012 100644 --- a/src/bundle/Resources/views/themes/admin/content/widget/content_create.html.twig +++ b/src/bundle/Resources/views/themes/admin/content/widget/content_create.html.twig @@ -16,7 +16,7 @@
{{ form_start(form, { 'action': path('ibexa.content.create'), 'attr': { 'autocomplete': 'off' } }) }} -
{{ 'content.create.select_language'|trans|desc('Select a language:') }}
+
{% if form.language.vars.choices|length == 1 %} {{ form_widget(form.language, {'attr': {'class': 'ibexa-content-create form-control', 'readonly': true}}) }} @@ -24,7 +24,7 @@ {{ form_widget(form.language, {'attr': {'class': 'form-control'}}) }} {% endif %}
-
{{ 'content.create.select_content_type'|trans|desc('Select a Content Type:') }}
+
diff --git a/src/bundle/ui-dev/src/modules/universal-discovery/components/content-create-widget/content.create.widget.js b/src/bundle/ui-dev/src/modules/universal-discovery/components/content-create-widget/content.create.widget.js index 7d820137b3..da098a4ee6 100644 --- a/src/bundle/ui-dev/src/modules/universal-discovery/components/content-create-widget/content.create.widget.js +++ b/src/bundle/ui-dev/src/modules/universal-discovery/components/content-create-widget/content.create.widget.js @@ -120,7 +120,7 @@ const ContentCreateWidget = () => {
{createUnderLabel}
-
{selectLanguageLabel}
+
{ extraClasses="c-udw-dropdown" />
-
{selectContentType}
+
@@ -144,61 +144,66 @@ const ContentCreateWidget = () => { />
-
-
{filtersDescLabel}
-
- {contentTypes.map(([groupName, groupItems]) => { - const restrictedContentTypeIds = selectedLocation?.permissions?.create.restrictedContentTypeIds ?? []; - const isHidden = groupItems.every((groupItem) => { - const isNotSearchedName = filterQuery && !groupItem.name.toLowerCase().includes(filterQuery); - const hasNotPermission = - restrictedContentTypeIds.length && !restrictedContentTypeIds.includes(groupItem.id.toString()); - const isNotAllowedContentType = allowedContentTypes && !allowedContentTypes.includes(groupItem.identifier); +
{filtersDescLabel}
+
+ {contentTypes.map(([groupName, groupItems]) => { + const restrictedContentTypeIds = selectedLocation?.permissions?.create.restrictedContentTypeIds ?? []; + const isHidden = groupItems.every((groupItem) => { + const isNotSearchedName = filterQuery && !groupItem.name.toLowerCase().includes(filterQuery); + const hasNotPermission = + restrictedContentTypeIds.length && !restrictedContentTypeIds.includes(groupItem.id.toString()); + const isNotAllowedContentType = + allowedContentTypes && !allowedContentTypes.includes(groupItem.identifier); - return isNotSearchedName || hasNotPermission || isNotAllowedContentType; - }); + return isNotSearchedName || hasNotPermission || isNotAllowedContentType; + }); - if (isHidden) { - return null; - } + if (isHidden) { + return null; + } - return ( -
-
{groupName}
- {groupItems.map(({ name, thumbnail, identifier, id }) => { - const isHidden = - (filterQuery && !name.toLowerCase().includes(filterQuery)) || - (selectedLocation && - selectedLocation.permissions && - selectedLocation.permissions.create.restrictedContentTypeIds.length && - !selectedLocation.permissions.create.restrictedContentTypeIds.includes(id.toString())) || - (allowedContentTypes && !allowedContentTypes.includes(identifier)); - const className = createCssClassNames({ - 'ibexa-instant-filter__group-item': true, - 'ibexa-instant-filter__group-item--selected': identifier === selectedContentType, - }); - const updateSelectedContentType = () => setSelectedContentType(identifier); + return ( +
+
{groupName}
+ {groupItems.map(({ name, thumbnail, identifier, id }) => { + const isHidden = + (filterQuery && !name.toLowerCase().includes(filterQuery)) || + (selectedLocation && + selectedLocation.permissions && + selectedLocation.permissions.create.restrictedContentTypeIds.length && + !selectedLocation.permissions.create.restrictedContentTypeIds.includes( + id.toString() + )) || + (allowedContentTypes && !allowedContentTypes.includes(identifier)); + const className = createCssClassNames({ + 'ibexa-instant-filter__group-item': true, + 'ibexa-instant-filter__group-item--selected': identifier === selectedContentType, + }); + const updateSelectedContentType = () => setSelectedContentType(identifier); - if (isHidden) { - return null; - } + if (isHidden) { + return null; + } - return ( - - ); - })} + ); + })} +
+ ); + })} +
From 1d59ad5c265b47b4713be432fb02cfbc518c8f3b Mon Sep 17 00:00:00 2001 From: Jakub Brzegowski Date: Sat, 29 Jan 2022 12:54:14 +0100 Subject: [PATCH 2/2] Remove deprecated .ibexa-extra-actions__section-header styling --- src/bundle/Resources/public/scss/_extra-actions.scss | 7 ------- 1 file changed, 7 deletions(-) diff --git a/src/bundle/Resources/public/scss/_extra-actions.scss b/src/bundle/Resources/public/scss/_extra-actions.scss index 30f6d61d42..28de4cbbb5 100644 --- a/src/bundle/Resources/public/scss/_extra-actions.scss +++ b/src/bundle/Resources/public/scss/_extra-actions.scss @@ -119,13 +119,6 @@ } } - &__section-header { - margin-bottom: calculateRem(12px); - color: $ibexa-color-dark-300; - font-size: calculateRem(16px); - padding-top: calculateRem(32px); - } - &__section-content { padding-bottom: calculateRem(32px); background: $ibexa-color-white;