decidim-core 0.29.1 → 0.30.0.rc1

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

@@ -98,3 +98,22 @@
     @apply rounded-full bg-secondary text-white inline-grid place-items-center h-[18px] w-[18px] ml-2 text-xs;
   }
 }
+
+.layout-main__buttons {
+  .button {
+    &__sm {
+      @apply text-2xl [&:not([class*="button\\_\\_text"])]:px-1.5 [&:not([class*="button\\_\\_text"])]:py-1.5 gap-1.5
+      lg:text-sm lg:[&:not([class*="button\\_\\_text"])]:px-4;
+
+      span {
+        @apply hidden lg:flex;
+      }
+    }
+
+    &__transparent {
+      &-secondary {
+        @apply p-0 border-0 lg:border lg:border-secondary;
+      }
+    }
+  }
+}

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

@@ -19,7 +19,7 @@
   }
 
   > svg {
-    @apply w-8 h-8 flex-none text-secondary fill-current;
+    @apply w-6 h-6 flex-none text-secondary fill-current;
   }
 
   &[aria-expanded="false"] > svg:last-of-type,

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

@@ -2,44 +2,50 @@
   @apply space-y-3 opacity-0 -translate-y-full invisible transition-all absolute;
 
   &__text {
-    @apply text-sm text-gray-2;
+    @apply text-md text-gray-2 ml-4 leading-normal;
+
+    a {
+      @apply text-md;
+    }
   }
 
   &__grid {
     @apply flex flex-wrap gap-y-3;
   }
 
-  &__avatar,
-  &__counter {
+  &__avatar {
     @apply rounded-full overflow-hidden border border-white inline-grid w-6 h-6;
   }
 
-  &__counter {
-    @apply bg-background place-items-center text-secondary text-xs font-semibold transition;
-  }
-
   &__button {
     @apply block ml-auto text-right text-xs text-secondary cursor-pointer;
   }
 
-  &__trigger {
-    @apply flex justify-start -space-x-4;
-  }
-
-  &__trigger:hover &__counter,
-  &__trigger[aria-expanded="true"] &__counter {
-    @apply text-white bg-secondary border-secondary;
-  }
-
-  &__trigger[data-target*="dropdown"] {
-    @apply p-0 w-auto;
+  &__container {
+    @apply w-full flex justify-start -space-x-4 p-0 gap-2;
 
     > span {
       @apply inline-grid;
     }
   }
 
-  &[id*="dropdown-menu"][aria-hidden="false"] {
-    @apply opacity-100 visible translate-y-0 transition-all relative;
+  &__modal {
+    .list-item__author {
+      @apply flex w-full justify-between;
+
+      .author__avatar-container {
+        @apply w-8 h-8;
+      }
+
+      .button {
+        @apply [&>svg]:hidden;
+      }
+    }
+
+    .list-item__author + .list-item__author {
+      --vertical-spacing: 1rem;
+
+      @apply mt-[var(--vertical-spacing)];
+    }
   }
 }

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

@@ -79,10 +79,10 @@
 }
 
 .form__wrapper {
-  @apply flex flex-col py-10 gap-10 last:pb-0;
+  @apply flex flex-col pt-10 pb-4 gap-10 last:pb-0;
 
   &-block {
-    @apply py-10 last:pb-0 border-t-2 border-background flex flex-col gap-4 only:[&_*]:ml-auto [&_p]:text-gray-2;
+    @apply py-10 last:pb-0 border-background flex flex-col gap-4 [&_p]:text-gray-2;
   }
 
   &-checkbox-label {

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

@@ -115,7 +115,7 @@ 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 pl-4 border-l border-gray-3;
+        @apply flex flex-col items-center text-secondary cursor-pointer md:pl-4 md:border-l border-gray-3;
 
         svg {
           @apply w-6 h-6 fill-current;
@@ -175,14 +175,16 @@ header {
       }
 
       &__login {
-        @apply w-20 h-full flex flex-row items-center relative text-secondary gap-1;
+        @apply w-auto h-full flex flex-row items-center relative text-secondary gap-1 pl-2 pr-2;
 
         svg {
           @apply w-8 h-6 fill-current;
         }
 
         svg + span {
-          @apply text-sm first-letter:uppercase pr-4 w-16;
+          @apply text-sm first-letter:uppercase w-auto;
+
+          flex-shrink: 0;
         }
       }
     }

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

@@ -6,7 +6,7 @@
   --warning: #ad4910;
   --bg-warning: #ffeebd;
 
-  @apply bg-background text-gray-2 rounded inline-flex items-center gap-1 px-2 font-semibold text-sm;
+  @apply bg-background text-gray-2 rounded inline-flex items-center gap-1 px-2 py-1 h-min font-semibold text-sm;
 
   &.success {
     @apply bg-[var(--bg-success)] text-[var(--success)];

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

@@ -51,7 +51,7 @@
 }
 
 .layout-item {
-  @apply container grid grid-cols-1 lg:grid-cols-12 py-4 lg:py-24 gap-12 lg:gap-x-0;
+  @apply container grid grid-cols-1 lg:grid-cols-12 py-4 lg:py-24 gap-12 lg:gap-x-0 pt-12;
 
   &__main {
     @apply xl:col-start-2 lg:col-span-8 xl:col-span-7 relative;
@@ -59,6 +59,10 @@
 
   &__aside {
     @apply lg:col-start-10 xl:col-start-10 lg:col-span-3 xl:col-span-2;
+
+    &--footer {
+      @apply order-last;
+    }
   }
 
   &__back {
@@ -92,10 +96,36 @@
 
 .layout-main__heading {
   @apply space-y-8;
+
+  .layout-author.has_status {
+    @apply mt-6;
+
+    &:last-of-type {
+      @apply mt-2;
+    }
+  }
 }
 
 .layout-author {
   @apply flex items-center gap-4;
+
+  /* overwrite default dropdown styles */
+  [data-target*="dropdown"] {
+    @apply w-auto cursor-pointer text-secondary text-2xl flex;
+  }
+
+  /* overwrite default dropdown styles */
+  [id*="dropdown-menu"][aria-hidden="true"] {
+    @apply md:hidden;
+  }
+
+  .dropdown__bottom {
+    @apply [&>li]:pl-0;
+
+    .button {
+      @apply [&>svg]:order-1 [&>span]:order-2;
+    }
+  }
 }
 
 .layout-aside__buttons {
@@ -103,7 +133,7 @@
 }
 
 .layout-main__buttons {
-  @apply flex gap-x-1 items-center;
+  @apply flex gap-x-4 items-center;
 }
 
 .layout-aside__ctas-buttons {

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

@@ -1,6 +1,11 @@
+$facebook_background: #0866ff;
+$facebook_background_hover: #155cba; // 30% opacity
+$google_background: #f2f2f2;
+$google_background_hover: #dcdcdc; // 30% opacity
+
 .login {
   &__info {
-    @apply text-gray-2 text-lg space-y-4 mb-10 prose-a:text-secondary prose-a:underline;
+    @apply text-gray-2 text-lg space-y-4 mt-10 prose-a:text-secondary prose-a:underline;
   }
 
   &__info-required {
@@ -12,18 +17,50 @@
   }
 
   &__omniauth {
-    @apply flex flex-col items-center gap-8 text-gray-2 font-semibold w-fit mx-auto mt-10;
+    @apply flex flex-row items-center gap-8 text-gray-2 font-semibold w-fit mx-auto mt-10 [&>a]:w-auto;
 
     &-button {
-      @apply button button__xl border border-gray shadow-[0_4px_6px_rgba(211,211,211,0.25)] justify-start gap-8 text-lg w-full;
+      @apply button__lg border border-gray shadow-[0_4px_6px_rgba(211,211,211,0.25)] justify-start gap-8 text-lg w-full rounded;
 
       svg {
-        @apply w-6 h-6 fill-current flex-none;
+        @apply w-6 h-6 flex-none fill-white;
+      }
+
+      span {
+        @apply hidden 2xl:inline;
+      }
+
+      &--developer {
+        @apply flex;
+      }
+
+      &--facebook {
+        @apply flex flex-row text-white border border-background;
+
+        background-color: $facebook_background;
+      }
+
+      &--facebook:hover {
+        background-color: $facebook_background_hover;
+      }
+
+      &--x {
+        @apply flex flex-row text-white bg-black;
+      }
+
+      &--google {
+        @apply flex flex-row text-black border border-background;
+
+        background-color: $google_background;
+      }
+
+      &--google:hover {
+        background-color: $google_background_hover;
       }
     }
 
     &-separator {
-      @apply mt-10 flex items-center justify-center gap-12 after:content-[''] before:content-[''] after:h-px before:h-px after:bg-background before:bg-background after:grow before:grow;
+      @apply mt-10 flex items-center justify-center gap-8 after:content-[''] before:content-[''] after:h-0.5 before:h-0.5 after:bg-background before:bg-background after:grow before:grow;
     }
 
     &__horizontal {
@@ -32,7 +69,7 @@
   }
 
   &__links {
-    @apply flex flex-col gap-4 py-10 border-t-2 border-background;
+    @apply flex flex-col gap-4 pb-10 border-background items-center;
 
     a {
       @apply w-fit text-secondary hover:underline;
@@ -40,10 +77,20 @@
   }
 
   &__modal {
+    @apply p-8;
+
     &-links {
       @apply flex flex-col md:flex-row gap-4 justify-between items-start md:items-center [&>a]:text-secondary;
     }
 
+    &-remember {
+      @apply flex flex-row justify-between;
+
+      a {
+        @apply underline;
+      }
+    }
+
     [data-announcement] {
       @apply mt-4;
     }

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

@@ -42,4 +42,46 @@
       @apply w-full md:w-auto;
     }
   }
+
+  &[data-drawer] {
+    & > * {
+      @apply h-full max-h-full w-0 inset-0 translate-x-0 translate-y-0 right-0 left-auto max-w-[90%] lg:max-w-[900px] transition-none transition-[width] duration-500 overflow-visible;
+    }
+
+    &[aria-hidden="false"] {
+      > * {
+        @apply w-[60%];
+      }
+    }
+
+    [data-dialog-container] {
+      @apply grid-cols-none;
+
+      &.layout-content {
+        @apply bg-white;
+
+        > .spinner-container {
+          @apply sticky h-screen;
+        }
+      }
+    }
+
+    [data-dialog-closable] {
+      @apply absolute top-0 right-auto -left-10 p-4 py-2 bg-white rounded-bl;
+    }
+
+    .form-defaults {
+      h1 {
+        @apply text-2xl font-semibold text-black my-10 mx-4 border-b border-gray border-b-[1px] pb-8;
+
+        > .button {
+          @apply text-sm float-right;
+        }
+      }
+    }
+
+    .card {
+      @apply p-4 my-4 bg-background-2;
+    }
+  }
 }

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

@@ -3,4 +3,8 @@
   [data-dialog-actions] {
     @apply flex-nowrap;
   }
+
+  a {
+    @apply underline text-secondary;
+  }
 }

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

@@ -19,6 +19,52 @@
     > [id^="html-block"] {
       @apply w-full prose max-w-none [&+*]:border-t-0;
     }
+
+    .content-block {
+      @apply gap-0;
+
+      &__title {
+        @apply pb-8;
+      }
+
+      .documents {
+        &__container > div {
+          @apply border-b border-[#D3D5D9] border-t-0 pb-4 pt-6;
+        }
+
+        &__dropdown-container {
+          @apply border-b border-[#D3D5D9];
+        }
+
+        &__collection-trigger {
+          @apply bg-transparent max-w-full mt-0 pb-4 pt-6 px-0 rounded-none;
+
+          .documents-details {
+            @apply flex flex-col gap-2.5;
+
+            span {
+              @apply flex items-center text-lg leading-6 text-[var(--secondary)] font-semibold gap-1.5;
+            }
+          }
+        }
+
+        &__collection-content {
+          @apply w-auto ml-6 my-4 pl-4 lg:pl-8 border-l border-[#D3D5D9];
+
+          p {
+            @apply pt-4;
+          }
+
+          & > .documents__container {
+            @apply border-t-0 pt-0 mt-0;
+
+            & > :last-child {
+              @apply border-b-0;
+            }
+          }
+        }
+      }
+    }
   }
 
   &__content-block {

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

@@ -45,7 +45,7 @@
 
   &__actions {
     &-main {
-      @apply w-fit grid grid-cols-2 md:grid-cols-1 mx-auto gap-x-4 gap-y-6 md:gap-4;
+      @apply w-fit mx-auto gap-x-4 gap-y-6 md:gap-4;
 
       &__dropdown {
         @apply divide-y divide-gray-3 z-20 w-64;
@@ -166,7 +166,7 @@
       }
 
       &-container {
-        @apply w-12 h-12 relative flex-none;
+        @apply w-20 h-20 relative flex-none mr-4;
       }
 
       &-badge {

data/app/packs/stylesheets/decidim/_progress-bar.scss

@@ -29,7 +29,7 @@
   }
 
   &__sm {
-    @apply w-16;
+    @apply w-16 pt-2;
   }
 
   &__sm &__number {

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

@@ -0,0 +1,64 @@
+.success-image {
+  --success: #28a745;
+
+  width: 100px;
+  height: 100px;
+  margin: auto;
+
+  .animation-success__checkmark {
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    display: block;
+    stroke-width: 5;
+    stroke: var(--success);
+    stroke-miterlimit: 10;
+    box-shadow: inset 0 0 0 #4bb71b;
+    animation: fill 0.4s ease-in-out 0.4s forwards,
+      scale 0.3s ease-in-out 0.09s both;
+    position: relative;
+    top: 5px;
+    right: 5px;
+    margin: 0 auto;
+  }
+
+  .animation-success__checkmark__circle {
+    stroke-dasharray: 166;
+    stroke-dashoffset: 166;
+    stroke-width: 5;
+    stroke-miterlimit: 10;
+    stroke: var(--success);
+    fill: #fff;
+    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
+  }
+
+  .animation-success__checkmark__check {
+    transform-origin: 50% 50%;
+    stroke-dasharray: 48;
+    stroke-dashoffset: 48;
+    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
+  }
+
+  @keyframes stroke {
+    100% {
+      stroke-dashoffset: 0;
+    }
+  }
+
+  @keyframes scale {
+    0%,
+    100% {
+      transform: none;
+    }
+
+    50% {
+      transform: scale3d(1.1, 1.1, 1);
+    }
+  }
+
+  @keyframes fill {
+    100% {
+      box-shadow: inset 0 0 0 30 var(--success);
+    }
+  }
+}

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

@@ -0,0 +1,36 @@
+.tribute-container {
+  @apply w-full relative;
+
+  #results {
+    @apply absolute max-h-[225px] top-full left-0 right-0 p-0 my-2 rounded z-50 overflow-y-scroll bg-white border border-gray-3;
+
+    li {
+      @apply flex items-center gap-2 cursor-pointer px-4 py-2;
+    }
+
+    li:hover {
+      @apply cursor-pointer bg-background;
+    }
+
+    img {
+      @apply rounded-full w-6 h-6 object-cover;
+    }
+
+    span,
+    strong {
+      @apply font-semibold text-sm text-secondary;
+    }
+
+    small {
+      @apply font-normal text-gray-2 text-xs;
+    }
+
+    svg {
+      @apply w-4 h-4 text-primary fill-current;
+    }
+
+    .is-group {
+      @apply ml-auto flex items-center gap-1;
+    }
+  }
+}

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

@@ -58,6 +58,7 @@
   @import "stylesheets/decidim/_hero.scss";
   @import "stylesheets/decidim/_actions.scss";
   @import "stylesheets/decidim/_emoji.scss";
+  @import "stylesheets/decidim/_success_image.scss";
 }
 
 @import "stylesheets/decidim/vendor/datepicker_light.scss";

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

@@ -0,0 +1,5 @@
+.geocoding-container {
+  .user-device-location button {
+    @apply mt-4;
+  }
+}

data/app/packs/stylesheets/decidim/legacy/conference-diploma.scss

@@ -37,7 +37,6 @@
 }
 
 .conference-diploma .diploma__logo {
-  border: 1px solid #333;
   padding: 2rem;
 }
 
@@ -47,10 +46,12 @@
     max-height: 100%;
     max-width: 100%;
     margin: 0;
+    padding-top: 10%;
   }
 
   .conference-diploma .diploma__border {
     margin: 0;
+    margin-top: 15%;
     -moz-border-image: url("../images/decidim/pattern.png") 20 repeat;
     -webkit-border-image: url("../images/decidim/pattern.png") 20 repeat;
     -o-border-image: url("../images/decidim/pattern.png") 20 repeat;

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

@@ -1,13 +1,6 @@
-/*
-  NOTE: Bad practice. These dependencies should not be loaded in this way (as static files),
-  but leaflet makes use of image files, which are being wrong resolved by webpack,
-  as currently is missing the "file-loader" in the webpack.config.js
-
-  See https://github.com/Leaflet/Leaflet/issues/4849 for further info
-*/
-@import "stylesheets/decidim/legacy/leaflet";
-@import "stylesheets/decidim/legacy/MarkerCluster";
-@import "stylesheets/decidim/legacy/MarkerCluster.Default";
+@import "leaflet/dist/leaflet";
+@import "leaflet.markercluster/dist/MarkerCluster";
+@import "leaflet.markercluster/dist/MarkerCluster.Default";
 
 /* overwrite leaflet and card styles */
 .leaflet-popup-content-wrapper {
@@ -30,6 +23,10 @@
       @apply font-sans text-white;
     }
 
+    &-metadata svg {
+      @apply fill-current;
+    }
+
     &-title {
       @apply truncate;
     }

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

@@ -0,0 +1,31 @@
+.resource_history {
+  @apply flex flex-col gap-3.5 lg:gap-[20px] p-4;
+
+  &__item {
+    @apply flex flex-row gap-2.5;
+
+    &_icon {
+      @apply w-8 h-8 rounded-full border-secondary border flex justify-center items-center;
+
+      &-creation {
+        @apply bg-secondary w-6 h-6 rounded-full flex justify-center items-center;
+      }
+    }
+
+    &_content {
+      @apply flex flex-col lg:items-center lg:flex-row lg:gap-1;
+    }
+
+    &_date {
+      @apply text-sm text-gray-2;
+    }
+  }
+
+  &_text {
+    @apply flex flex-col lg:flex-none lg:block relative;
+  }
+
+  &__line {
+    @apply absolute -left-[26px] lg:-left-[130px] top-3.5 lg:top-[26px] w-px h-full bg-secondary;
+  }
+}

data/app/permissions/decidim/permissions.rb

@@ -24,6 +24,7 @@ module Decidim
       user_group_action?
       user_group_invitations_action?
       apply_endorsement_permissions if permission_action.subject == :endorsement
+      show_my_location_button?
 
       permission_action
     end
@@ -56,7 +57,6 @@ module Decidim
 
       return allow! if component.published?
       return allow! if user_can_preview_component?
-      return allow! if user_can_admin_component?
       return allow! if user_can_admin_component_via_space?
 
       disallow!
@@ -163,7 +163,7 @@ module Decidim
     end
 
     def user_can_preview_component?
-      return allow! if context[:share_token].present? && Decidim::ShareToken.use!(token_for: component, token: context[:share_token])
+      context[:share_token].present? && Decidim::ShareToken.use!(token_for: component, token: context[:share_token], user:)
     rescue ActiveRecord::RecordNotFound, StandardError
       nil
     end
@@ -193,6 +193,12 @@ module Decidim
       end
     end
 
+    def show_my_location_button?
+      return unless permission_action.action == :locate && permission_action.subject == :geolocation
+
+      allow!
+    end
+
     def not_already_active?(authorization)
       Verifications::Authorizations.new(organization: user.organization, user:, name: authorization.name).none?
     end