Merge branch 'feature/theming' into develop

CHANGELOG.md

@@ -4,14 +4,18 @@
 * allow to define templates show before and after a murph collection item
 * add global batch actions
 * add constraint `Length` in forms
+* add sass classes to mange with of elements
 ### Changed
 * refactor services using constructor property promotions
 * remove twig in the mail notifier service
+* change pills colors
+* change border colors of inputs when focused
 
 ### Fixed
 * fix regression on crud sorting
 * fix test in RepositoryQuery::addForcedFilterHandler
 * remove parameter $option on CrudConfiguration::setForm and fix CrudController make template
+* fix the aspect of the actions's column in the crud
 
 ## [v1.22.0] 2023-09-28
 ### Added

src/core/Entity/Site/Navigation.php

@@ -67,7 +67,7 @@ class Navigation implements EntityInterface
         return $this->label;
     }
 
-    public function setLabel(string $label): self
+    public function setLabel(?string $label): self
     {
         $this->label = $label;
 

src/core/Resources/assets/css/admin.scss

@@ -12,6 +12,17 @@ $pagination-active-bg: #343a40 !default;
 
 $sidebar-width: 260px !default;
 
+$input-border-color: map-get($theme-colors, 'dark-blue');
+$input-btn-focus-color: $input-border-color;
+
+$component-active-color: map-get($theme-colors, 'dark-blue');
+
+$nav-tabs-link-active-bg: map-get($theme-colors, 'dark-blue');
+$nav-pills-link-active-bg:  map-get($theme-colors, 'dark-blue');
+$nav-tabs-link-active-color: lighten(map-get($theme-colors, 'dark-blue'), 100%);
+$nav-pills-link-active-color: lighten(map-get($theme-colors, 'dark-blue'), 100%);
+$input-focus-border-color: lighten(map-get($theme-colors, 'dark-blue'), 80%);
+
 @import "~choices.js/src/styles/choices.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 @import "~@fortawesome/fontawesome-free/css/all.css";
@@ -19,9 +30,29 @@ $sidebar-width: 260px !default;
 @import '~grapesjs/dist/css/grapes.min.css';
 @import '~grapesjs-component-code-editor/dist/grapesjs-component-code-editor.min.css';
 
-@for $i from 1 through 100 {
-  .miw-#{$i*5} {
-    min-width: $i * 5px;
+@for $i from 1 through 400 {
+  .miw-#{$i}, .min-width-#{$i} {
+    min-width: #{$i}px;
+  }
+
+  .min-width-#{$i}p {
+    min-width: #{$i}#{"%"};
+  }
+
+  .maw-#{$i}, .max-width-#{$i} {
+    max-width: #{$i}px;
+  }
+
+  .max-width-#{$i}p {
+    max-width: #{$i}#{"%"};
+  }
+
+  .width-#{$i} {
+    width: #{$i}px;
+  }
+
+  .width-#{$i}p {
+    width: #{$i}#{"%"};
   }
 }
 
@@ -110,6 +141,7 @@ body {
 .table .thead-light {
   a, th {
     color: map-get($theme-colors, 'dark-blue');
+    background: lighten(map-get($theme-colors, 'dark-blue'), 80%);
   }
 }
 
@@ -672,6 +704,16 @@ form {
   }
 }
 
+label.required::after {
+  content: '*';
+  margin-left: 3px;
+  color: #b41215;
+}
+
+.invalid-feedback {
+  margin-top: -3px;
+}
+
 .gjs-editor-cont {
   border-radius: 10px;
   overflow: hidden !important;

src/core/Resources/views/admin/crud/index.html.twig

@@ -144,7 +144,7 @@
                                 {% endblock %}
                             {% endfor %}
                             {% if configuration.showActions %}
-                                <th class="crud-action-column col-2 miw-100 text-right">
+                                <th class="crud-action-column miw-100 text-right">
                                     {{ 'Actions'|trans }}
                                 </th>
                             {% endif %}

src/core/Resources/views/form/bootstrap_4_form_theme.html.twig

@@ -254,3 +254,51 @@
         {{- form_help(form) -}}
     </{{ element|default('div') }}>
 {%- endblock form_row %}
+
+
+{% block form_label -%}
+    {% if label is not same as(false) -%}
+        {%- if compound is defined and compound -%}
+            {%- set element = 'legend' -%}
+            {%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' col-form-label')|trim}) -%}
+        {%- else -%}
+            {%- set label_attr = label_attr|merge({for: id}) -%}
+        {%- endif -%}
+        {% if required -%}
+            {% set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' required')|trim}) %}
+        {%- endif -%}
+        {% if label is empty -%}
+            {%- if label_format is not empty -%}
+                {% set label = label_format|replace({
+                    '%name%': name,
+                    '%id%': id,
+                }) %}
+            {%- else -%}
+                {% set label = name|humanize %}
+            {%- endif -%}
+        {%- endif -%}
+        <{{ element|default('label') }}{% if label_attr %}{% with { attr: label_attr } %}{{ block('attributes') }}{% endwith %}{% endif %}>
+        {%- if translation_domain is same as(false) -%}
+            {%- if label_html is same as(false) -%}
+                {{- label -}}
+            {%- else -%}
+                {{- label|raw -}}
+            {%- endif -%}
+        {%- else -%}
+            {%- if label_html is same as(false) -%}
+                {{- label|trans(label_translation_parameters, translation_domain) -}}
+            {%- else -%}
+                {{- label|trans(label_translation_parameters, translation_domain)|raw -}}
+            {%- endif -%}
+        {%- endif -%}
+        </{{ element|default('label') }}>
+        {% block form_label_errors %}{{- form_errors(form) -}}{% endblock form_label_errors %}
+    {%- else -%}
+        {%- if errors|length > 0 -%}
+        <div id="{{ id }}_errors" class="mb-2">
+            {{- form_errors(form) -}}
+        </div>
+        {%- endif -%}
+    {%- endif -%}
+{%- endblock form_label %}
+