decidim-core 0.28.1 → 0.29.0.rc1

data/app/packs/stylesheets/decidim/_header.scss

@@ -20,8 +20,26 @@ header {
     }
   }
 
+  #flash-messages-container {
+    @apply mt-28 md:mt-0;
+  }
+
+  &.with-admin-bar {
+    #flash-messages-container {
+      @apply mt-40 md:mt-0;
+    }
+
+    #menu-bar-container {
+      @apply mt-[140px] md:mt-0;
+    }
+  }
+
+  #sticky-header-container {
+    @apply fixed w-full top-0 shadow-lg z-40 bg-white md:relative transition-top duration-300;
+  }
+
   .main-bar {
-    @apply container grid grid-cols-4 md:grid-cols-8 lg:grid-cols-12 gap-4 items-center py-5;
+    @apply container grid grid-cols-4 md:grid-cols-8 lg:grid-cols-12 gap-4 items-center py-5 h-24;
 
     &__container {
       @apply relative w-full;
@@ -31,6 +49,14 @@ header {
       @apply col-span-3 xl:col-span-2 prose prose-img:max-h-16 prose-img:my-0;
     }
 
+    &__logo-desktop {
+      @apply hidden lg:block;
+    }
+
+    &__logo-mobile {
+      @apply lg:hidden;
+    }
+
     &__search {
       @apply hidden md:block col-span-2 col-start-5 xl:col-start-4;
 
@@ -43,10 +69,14 @@ header {
       }
 
       button[type="submit"] {
-        @apply absolute right-2 inset-y-2 text-secondary;
+        @apply absolute ltr:right-2 rtl:left-2 inset-y-2 text-secondary;
       }
     }
 
+    &__menu-mobile {
+      @apply lg:hidden flex flex-row-reverse items-center;
+    }
+
     &__links-desktop,
     > *:last-child {
       @apply col-span-1 md:col-start-8 lg:col-start-8 lg:col-span-5 justify-self-end;
@@ -61,6 +91,10 @@ header {
         &-wrapper {
           @apply flex gap-x-4 xl:gap-x-6;
         }
+
+        &-account {
+          @apply w-6 h-6 flex items-center justify-center bg-secondary text-white rounded-full text-xs font-bold mr-2;
+        }
       }
 
       /* overwrite default dropdown styles */
@@ -81,10 +115,10 @@ header {
       @apply fixed bottom-0 left-0 z-40 bg-white w-full px-4 py-3 flex justify-between text-secondary shadow-[0_-4px_6px_rgba(198,198,198,0.25)];
 
       &__trigger {
-        @apply flex flex-col items-center text-secondary cursor-pointer p-2;
+        @apply flex flex-col items-center text-secondary cursor-pointer pl-4 border-l border-gray-3;
 
         svg {
-          @apply w-5 h-5 fill-current;
+          @apply w-6 h-6 fill-current;
         }
 
         span {
@@ -96,6 +130,10 @@ header {
         @apply absolute top-full left-0 z-30 bg-white;
       }
 
+      &__dropdown-before {
+        @apply before:block before:absolute before:-top-10 before:right-12 before:content-[""] before:bg-white before:w-24 before:h-12 before:-mt-8;
+      }
+
       &__account {
         @apply fixed top-0 left-0 w-full h-full z-30 bg-white;
 
@@ -118,46 +156,33 @@ header {
         .main-bar__avatar {
           @apply w-12 h-12;
         }
-      }
-
-      &__search {
-        @apply fixed top-0 left-0 w-full h-full z-30 bg-white;
 
-        &-block {
-          @apply container h-full flex flex-col justify-center;
+        .main-bar__avatar-name {
+          @apply w-12 h-12 text-2xl;
         }
 
-        .main-bar {
-          @apply border-b border-gray;
+        .account-container {
+          @apply before:block before:absolute before:top-16 before:right-14 before:content-[""] before:bg-white before:w-2 before:h-12 before:-mt-8;
         }
+      }
 
-        label {
-          @apply block mb-4 text-black;
-        }
+      &__item {
+        @apply relative;
+      }
 
-        form {
-          @apply relative;
-        }
+      &__search {
+        @apply fixed top-0 left-0 w-full h-full z-30 bg-white;
       }
 
-      &__item {
-        @apply w-1/4 flex flex-col items-center relative;
+      &__login {
+        @apply w-20 h-full flex flex-row items-center relative text-secondary gap-1;
 
         svg {
-          @apply w-8 h-8 fill-current;
+          @apply w-8 h-6 fill-current;
         }
 
         svg + span {
-          @apply text-sm first-letter:uppercase;
-        }
-
-        /* overwrite default dropdown styles */
-        &[data-target*="dropdown"] {
-          @apply p-0 gap-0;
-
-          > span {
-            @apply block font-normal text-sm first-letter:uppercase;
-          }
+          @apply text-sm first-letter:uppercase pr-4 w-16;
         }
       }
     }
@@ -179,11 +204,11 @@ header {
     }
 
     &__notification {
-      @apply w-2.5 h-2.5 rounded-full block absolute -top-0.5 right-0 bg-primary;
+      @apply w-2.5 h-2.5 rounded-full block absolute -top-0.5 right-1.5 bg-primary;
     }
 
     &__avatar {
-      @apply block w-8 h-8 rounded-full border border-secondary overflow-hidden;
+      @apply block w-6 h-6 rounded-full border border-secondary overflow-hidden mr-2;
 
       span {
         @apply w-full h-full rounded-full overflow-hidden;
@@ -194,6 +219,10 @@ header {
       }
     }
 
+    &__avatar-name {
+      @apply w-6 h-6 flex items-center justify-center bg-secondary text-white rounded-full text-xs font-bold mr-2;
+    }
+
     /* overwrite default dropdown styles */
     [id*="dropdown-menu"] {
       @apply py-0 mx-0 w-full;
@@ -202,14 +231,10 @@ header {
         @apply md:hidden;
       }
     }
-
-    [data-target*="dropdown"] {
-      @apply last-of-type:[&>svg]:block;
-    }
   }
 
   .menu-bar {
-    @apply container h-full flex justify-between items-center lg:relative;
+    @apply container h-full flex justify-between items-center lg:relative last-of-type:[&>svg]:hidden;
 
     &__container {
       @apply bg-primary relative h-14;
@@ -235,10 +260,10 @@ header {
       }
 
       &__dropdown-content {
-        @apply absolute z-20 top-full left-8 cursor-auto;
+        @apply absolute z-20 top-full cursor-auto;
 
         &-secondary {
-          @apply absolute z-20 top-[calc(100%+12px)] left-0;
+          @apply absolute z-20 top-[calc(100%+12px)];
         }
       }
 
@@ -342,22 +367,17 @@ header {
       }
     }
 
+    &__language-chooser {
+      @apply absolute top-full left-0 bg-white rounded w-full bg-gray-5;
+    }
+
     &__main-dropdown {
-      @apply bg-white divide-y divide-gray-3 rounded-b shadow-lg text-black w-full lg:w-[1280px];
+      @apply bg-white divide-y divide-gray-3 rounded-b shadow-lg text-black w-full lg:w-[1280px] h-screen md:h-auto;
 
       &__bottom,
       &__top {
         @apply flex flex-col md:flex-row justify-between p-4 md:p-8 gap-x-8;
 
-        &-left {
-          @apply w-full md:w-1/2;
-
-          /* Overwrite default size */
-          .card__highlight-text {
-            @apply text-md;
-          }
-        }
-
         &-right {
           @apply hidden md:block md:w-1/2;
         }

data/app/packs/stylesheets/decidim/_home.scss

@@ -37,7 +37,7 @@
     @apply mb-6 md:mb-8 flex flex-col md:flex-row gap-y-6 md:gap-y-0 gap-x-1 items-start md:items-center;
 
     .button {
-      @apply md:ml-auto;
+      @apply ltr:md:ml-auto rtl:md:mr-auto;
     }
   }
 

data/app/packs/stylesheets/decidim/_layout.scss

@@ -6,7 +6,7 @@
   }
 
   [data-content] {
-    @apply min-h-[60vh] relative flex flex-col;
+    @apply relative flex flex-col;
   }
 }
 
@@ -31,14 +31,14 @@
 }
 
 .layout-2col {
-  @apply md:grid grid-cols-12 container grow min-h-[60vh];
+  @apply md:grid grid-cols-12 container grow auto-rows-max;
 
   &__aside {
     @apply col-span-4 lg:col-span-3 md:pr-16 py-6 md:py-12 gap-6 md:gap-12 flex flex-col justify-between items-start md:justify-start before:content-[''] before:absolute before:top-0 before:left-0 before:h-full before:w-1/2 before:-z-10 md:before:bg-background;
   }
 
   &__main {
-    @apply col-span-8 lg:col-span-9 bg-white md:pl-16 py-6 md:py-12;
+    @apply col-span-8 lg:col-span-9 bg-white md:pl-16 py-6 md:py-12 min-h-[60vh];
   }
 
   &__reverse &__aside {
@@ -105,3 +105,16 @@
 .layout-main__buttons {
   @apply flex gap-x-1 items-center;
 }
+
+.layout-aside__ctas-buttons {
+  @apply fixed md:relative inset-x-0 bottom-0 z-30 md:z-0 flex flex-row-reverse md:flex-col items-center md:items-stretch last:[&>button]:font-semibold first:[&>button]:text-lg justify-around bg-white md:bg-transparent gap-4 md:gap-0 p-4 md:p-0 shadow-inner md:shadow-none first:[&>*]:grow md:first:[&>*]:grow-0 last:[&>*]:w-1/2 md:last:[&>*]:w-auto h-20 md:h-fit first:[&>button]:py-3;
+
+  .meeting__aside-progress,
+  .proposals__aside-progress {
+    @apply flex flex-col-reverse md:flex-col md:w-auto;
+  }
+}
+
+.survey-section-buttons {
+  @apply flex-row last:[&>button]:font-semibold md:[&>button]:font-normal last:[&>button]:text-lg md:last:[&>button]:text-sm md:first:[&>button]:text-sm last:[&>button]:py-3 md:last:[&>button]:py-1.5 md:first:[&>button]:py-1.5;
+}

data/app/packs/stylesheets/decidim/_modal.scss

@@ -2,7 +2,7 @@
   @apply invisible opacity-0 fixed z-50 inset-0 bg-[rgba(0,0,0,0.25)] transition duration-300;
 
   & > * {
-    @apply absolute inset-1/2 -translate-x-1/2 -translate-y-1/2 w-[90%] lg:max-w-[900px] max-h-[95vh] h-fit overflow-y-auto p-6 bg-white z-50 rounded shadow-[0_4px_6px_rgba(211,211,211,0.25)];
+    @apply absolute inset-1/2 ltr:-translate-x-1/2 rtl:translate-x-1/2 -translate-y-1/2 w-[90%] lg:max-w-[900px] max-h-[95vh] h-fit overflow-y-auto p-6 bg-white z-50 rounded shadow-[0_4px_6px_rgba(211,211,211,0.25)];
 
     & > svg:only-child {
       @apply w-8 h-8 mx-auto text-gray-2 fill-current animate-spin;

data/app/packs/stylesheets/decidim/_modal_update.scss

@@ -7,7 +7,7 @@
     }
 
     &-container {
-      @apply mt-4 md:mt-12 space-y-4;
+      @apply space-y-4;
     }
 
     &-placeholder {
@@ -28,9 +28,7 @@
           @apply w-24 flex-none flex justify-center;
         }
 
-        img:not([src^="data:image"]):not(
-            [src^="data:application/octet-stream"]
-          ) {
+        img[src="data:,"] {
           @apply hidden;
         }
 

data/app/packs/stylesheets/decidim/_notifications.scss

@@ -20,6 +20,10 @@
       @apply prose-a:font-semibold hover:prose-a:underline prose-a:text-secondary;
     }
 
+    &-actions {
+      @apply pt-4;
+    }
+
     &-resource {
       @apply text-sm text-gray-2 flex items-center gap-1;
 

data/app/packs/stylesheets/decidim/_tabs_x.scss

@@ -6,13 +6,17 @@
   }
 
   &[aria-expanded="true"],
-  &:hover {
+  &:hover[disabled="false"] {
     @apply text-secondary border-secondary;
 
     svg {
       @apply text-secondary;
     }
   }
+
+  &[disabled] {
+    @apply opacity-50 cursor-not-allowed;
+  }
 }
 
 .tabs-1 {

data/app/packs/stylesheets/decidim/application.scss

@@ -57,8 +57,12 @@
   @import "stylesheets/decidim/_toggle_switch.scss";
   @import "stylesheets/decidim/_hero.scss";
   @import "stylesheets/decidim/_actions.scss";
+  @import "stylesheets/decidim/_emoji.scss";
 }
 
+@import "stylesheets/decidim/vendor/datepicker_light.scss";
+@import "stylesheets/decidim/datepicker.scss";
+
 // On the other hand, the following styles match with specific routes
 @import "stylesheets/decidim/_header.scss";
 @import "stylesheets/decidim/_footer.scss";

data/app/packs/stylesheets/decidim/legacy/leaflet.scss

@@ -43,7 +43,7 @@
   display: block;
 }
 
-/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
+/* .leaflet-container svg: reset svg max-width declaration shipped in Joomla! (joomla.org) 3.x */
 
 /* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
 .leaflet-container .leaflet-overlay-pane svg {

data/app/packs/stylesheets/decidim/vendor/_datepicker_light.scss

@@ -0,0 +1,228 @@
+// Extracted from wc-datepicker
+// https://github.com/Sqrrl/wc-datepicker
+// Copyright @Sqrrl (c) 2022 - MIT License
+
+.sc-wc-datepicker-h,
+.sc-wc-datepicker-h *,
+.sc-wc-datepicker-h *::before,
+.sc-wc-datepicker-h *::after {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+.sc-wc-datepicker-h {
+  display: inline-flex;
+}
+
+.wc-datepicker {
+  display: block;
+  width: min-content;
+  min-width: 17rem;
+  max-width: 24rem;
+  border: 0.0625rem solid #f2f3f5;
+  color: #111;
+  background-color: #fff;
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
+    "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+}
+
+.wc-datepicker--disabled *:disabled {
+  opacity: 0.5;
+  cursor: default;
+}
+
+.wc-datepicker--disabled .wc-datepicker__weekday {
+  color: #767676;
+}
+
+.wc-datepicker--disabled .wc-datepicker__date:focus > * {
+  outline: none;
+}
+
+.wc-datepicker--disabled .wc-datepicker__date {
+  cursor: default;
+  opacity: 0.5;
+}
+
+.wc-datepicker--disabled .wc-datepicker__date:hover > * {
+  background-color: transparent;
+}
+
+.wc-datepicker--disabled .wc-datepicker__date--in-range:hover > * {
+  background-color: #f2f3f5;
+}
+
+.wc-datepicker--disabled .wc-datepicker__date--selected:hover > * {
+  color: #fff;
+  background-color: #00f;
+}
+
+.wc-datepicker__header {
+  display: flex;
+  padding: 0.75rem;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.wc-datepicker__current-month {
+  display: flex;
+  flex-grow: 1;
+  gap: 0.5rem;
+}
+
+.wc-datepicker__month-select,
+.wc-datepicker__year-select {
+  display: flex;
+  height: 2rem;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+  align-items: center;
+  border: none;
+  border-radius: 0.25rem;
+  color: #111;
+  background: #f2f3f5;
+  font: inherit;
+  line-height: 1.125;
+}
+
+.wc-datepicker__month-select {
+  flex-grow: 1;
+  cursor: pointer;
+  appearance: none;
+}
+
+.wc-datepicker__year-select {
+  max-width: 5rem;
+}
+
+.wc-datepicker__previous-month-button,
+.wc-datepicker__next-month-button,
+.wc-datepicker__previous-year-button,
+.wc-datepicker__next-year-button {
+  display: inline-flex;
+  width: 2rem;
+  height: 2rem;
+  padding: 0.375rem;
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  border: none;
+  border-radius: 0.25rem;
+  color: #111;
+  background-color: transparent;
+  background-color: #f2f3f5;
+  cursor: pointer;
+}
+
+.wc-datepicker__body {
+  padding-right: 0.75rem;
+  padding-bottom: 0.75rem;
+  padding-left: 0.75rem;
+}
+
+.wc-datepicker__calendar {
+  width: 100%;
+  table-layout: fixed;
+  border-collapse: collapse;
+}
+
+.wc-datepicker__weekday > span {
+  display: flex;
+  padding: 0.125rem;
+  justify-content: center;
+  align-items: center;
+  font-weight: 600;
+  aspect-ratio: 1;
+}
+
+.wc-datepicker__date {
+  padding: 0.125rem;
+  text-align: center;
+  cursor: pointer;
+}
+
+.wc-datepicker__date:focus {
+  outline: none;
+}
+
+.wc-datepicker__date:focus > * {
+  outline: 0.125rem solid #00f;
+}
+
+.wc-datepicker__date:hover > * {
+  background-color: #f2f3f5;
+}
+
+.wc-datepicker__date > * {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 0.25rem;
+  aspect-ratio: 1;
+}
+
+.wc-datepicker__date--today > * {
+  font-weight: 700;
+  font-style: normal;
+}
+
+.wc-datepicker__date--in-range > * {
+  background-color: #f2f3f5;
+}
+
+.wc-datepicker__date--selected > *,
+.wc-datepicker__date--selected:hover > * {
+  color: #fff;
+  background-color: #00f;
+  font-weight: 500;
+}
+
+.wc-datepicker__date--disabled {
+  color: #767676;
+  cursor: default;
+}
+
+.wc-datepicker__date--disabled:not(.wc-datepicker__date--selected):not(
+    .wc-datepicker__date--in-range
+  ):hover
+  > * {
+  background-color: transparent;
+}
+
+.wc-datepicker__date--disabled.wc-datepicker__date--in-range:not(
+    .wc-datepicker__date--selected
+  ):not(.wc-datepicker__date--in-range)
+  > * {
+  background-color: transparent;
+}
+
+.wc-datepicker__footer {
+  display: flex;
+  padding-right: 0.75rem;
+  padding-bottom: 0.75rem;
+  padding-left: 0.75rem;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.wc-datepicker__clear-button,
+.wc-datepicker__today-button {
+  display: inline-flex;
+  height: 2rem;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+  justify-content: center;
+  align-items: center;
+  border: none;
+  border-radius: 0.25rem;
+  color: #111;
+  background-color: #f2f3f5;
+  font: inherit;
+  line-height: 1;
+  cursor: pointer;
+}

data/app/permissions/decidim/default_permissions.rb

@@ -1,9 +1,9 @@
 # frozen_string_literal: true
 
 module Decidim
-  # Default permissions class for all components and spaces. It disauthorizes all
+  # Default permissions class for all components and spaces. It deauthorizes all
   # actions by any kind of user. Also works as a default implementation so other
-  # components can inherit from it and get some cenvenience methods.
+  # components can inherit from it and get some convenience methods.
   class DefaultPermissions
     def initialize(user, permission_action, context = {})
       @user = user

data/app/presenters/decidim/admin_log/organization_presenter.rb

@@ -15,7 +15,7 @@ module Decidim
       private
 
       def diff_fields_mapping
-        return { external_domain_whitelist: :string } if action == "update_external_domain"
+        return { external_domain_allowlist: :string } if action == "update_external_domain"
 
         settings_attributes_mapping
           .merge(omnipresent_banner_attributes_mapping)
@@ -26,7 +26,7 @@ module Decidim
 
       def settings_attributes_mapping
         {
-          name: :string,
+          name: :i18n,
           default_locale: :locale,
           reference_prefix: :string,
           twitter_handler: :string,

data/app/presenters/decidim/admin_log/static_page_presenter.rb

@@ -24,7 +24,7 @@ module Decidim
 
       # Private: Caches the object that will be responsible of presenting the static page.
       # Overwrites the method so that we can use a custom presenter to show the correct
-      # path for ther page.
+      # path for their page.
       #
       # Returns an object that responds to `present`.
       def resource_presenter

data/app/presenters/decidim/authorization_transfer_presenter.rb

@@ -37,7 +37,7 @@ module Decidim
     # Returns an array of the translated record counts containing only the
     # texts to be displayed for the user.
     #
-    # @return [Array<String>] The translated records names with their coutns.
+    # @return [Array<String>] The translated records names with their counts.
     def translated_record_texts
       translated_record_counts.values
     end