decidim-core 0.14.4 → 0.15.0

data/app/assets/stylesheets/decidim/_decidim.scss

@@ -12,3 +12,4 @@
 @import "modules/modules";
 @import "layouts/*";
 @import "extras/*";
+@import "vizzs/*";

data/app/assets/stylesheets/decidim/modules/_cards.scss

@@ -715,6 +715,7 @@ $datetime-bg: $primary;
 // card status
 .card__status{
   .card-data__item{
+    flex-basis: 20%;
     flex-basis: initial;
     padding: 1em .5em;
 

data/app/assets/stylesheets/decidim/modules/_conference-diploma.scss

@@ -0,0 +1,75 @@
+.conference-diploma{
+  text-align: center;
+
+  .diploma__border{
+    margin: 4 * $global-margin;
+
+    /* Border pattern */
+    // $motif_frontcolor: #979797;
+    // $motif_backcolor: $white;
+    //
+    // background-color: $motif_frontcolor;
+    // background-image:
+    //   radial-gradient(circle at 100% 150%, $motif_frontcolor 24%, $motif_backcolor 25%, $motif_backcolor 28%, $motif_frontcolor 29%, $motif_frontcolor 36%, $motif_backcolor 36%, $motif_backcolor 40%, transparent 40%, transparent),
+    //   radial-gradient(circle at 0    150%, $motif_frontcolor 24%, $motif_backcolor 25%, $motif_backcolor 28%, $motif_frontcolor 29%, $motif_frontcolor 36%, $motif_backcolor 36%, $motif_backcolor 40%, transparent 40%, transparent),
+    //   radial-gradient(circle at 50%  100%, $motif_backcolor 10%, $motif_frontcolor 11%, $motif_frontcolor 23%, $motif_backcolor 24%, $motif_backcolor 30%, $motif_frontcolor 31%, $motif_frontcolor 43%, $motif_backcolor 44%, $motif_backcolor 50%, $motif_frontcolor 51%, $motif_frontcolor 63%, $motif_backcolor 64%, $motif_backcolor 71%, transparent 71%, transparent),
+    //   radial-gradient(circle at 100% 50%, $motif_backcolor 5%, $motif_frontcolor 6%, $motif_frontcolor 15%, $motif_backcolor 16%, $motif_backcolor 20%, $motif_frontcolor 21%, $motif_frontcolor 30%, $motif_backcolor 31%, $motif_backcolor 35%, $motif_frontcolor 36%, $motif_frontcolor 45%, $motif_backcolor 46%, $motif_backcolor 49%, transparent 50%, transparent),
+    //   radial-gradient(circle at 0    50%, $motif_backcolor 5%, $motif_frontcolor 6%, $motif_frontcolor 15%, $motif_backcolor 16%, $motif_backcolor 20%, $motif_frontcolor 21%, $motif_frontcolor 30%, $motif_backcolor 31%, $motif_backcolor 35%, $motif_frontcolor 36%, $motif_frontcolor 45%, $motif_backcolor 46%, $motif_backcolor 49%, transparent 50%, transparent);
+    // background-size: 16px 8px;
+
+    -moz-border-image: image-url("pattern.png") 20 repeat;
+    -webkit-border-image: image-url("pattern.png") 20 repeat;
+    -o-border-image: image-url("pattern.png") 20 repeat;
+    border-image: image-url("pattern.png") 20 repeat;
+    border-style: solid;
+    border-width: 1rem;
+
+    .diploma__content{
+      padding: 3 * $global-padding;
+    }
+  }
+
+  .diploma__attendance{
+    > *{
+      display: block;
+    }
+
+    text-align: center;
+    font-size: rem-calc(14);
+  }
+
+  .diploma__name{
+    margin-top: 4 * $global-margin;
+    font-size: rem-calc(18);
+
+    p{
+      margin-top: $global-margin;
+    }
+  }
+
+  .diploma__logo{
+    border: $border;
+    padding: 2 * $global-padding;
+  }
+}
+
+@media print{
+  @page{
+    size: A4 landscape;
+    max-height: 100%;
+    max-width: 100%;
+    margin: 0;
+  }
+
+  .conference-diploma{
+    .diploma__border{
+      margin: 0;
+      -moz-border-image: image-url("pattern.png") 20 repeat;
+      -webkit-border-image: image-url("pattern.png") 20 repeat;
+      -o-border-image: image-url("pattern.png") 20 repeat;
+      border-image: image-url("pattern.png") 20 repeat;
+      border-style: solid;
+      border-width: 1rem;
+    }
+  }
+}

data/app/assets/stylesheets/decidim/modules/_conference-media.scss

@@ -0,0 +1,44 @@
+.conference-media{
+  .media-links{
+    li{
+      color: $secondary;
+      margin-bottom: $global-margin;
+      align-items: baseline;
+
+      @include flexgap($global-margin);
+
+      > :first-child{
+        flex-shrink: 0;
+      }
+    }
+
+    a{
+      font-size: rem-calc(18);
+    }
+  }
+
+  .media-pictures{
+    article{
+      cursor: pointer;
+    }
+
+    .picture__content{
+      padding: $global-padding;
+
+      img{
+        margin-bottom: $global-margin;
+        object-fit: cover;
+
+        @include size(100%, 100% / (4/3));
+      }
+    }
+  }
+}
+
+[data-reveal].picture__modal{
+  img{
+    margin-bottom: $global-margin;
+
+    @include square(100%);
+  }
+}

data/app/assets/stylesheets/decidim/modules/_conference-programme.scss

@@ -103,8 +103,12 @@
       }
     }
 
-    span{
+    .row:not(.speakers-list) span{
       opacity: .6;
     }
+
+    .speakers-list{
+      min-height: 35px;
+    }
   }
 }

data/app/assets/stylesheets/decidim/modules/_conference-registration.scss

@@ -0,0 +1,34 @@
+.conference-registration{
+  @extend .card;
+
+  padding: $global-padding;
+
+  .registration__text{
+    > *{
+      display: block;
+    }
+
+    strong{
+      font-size: rem-calc(18);
+    }
+
+    span{
+      font-size: rem-calc(14);
+      color: $muted;
+    }
+  }
+
+  .registration__buttons{
+    @include flexgap($global-margin);
+
+    @include breakpoint(medium down){
+      margin-top: $global-margin;
+    }
+
+    flex-shrink: 0;
+
+    > :first-child{
+      border: $border;
+    }
+  }
+}

data/app/assets/stylesheets/decidim/modules/_list-request.scss

@@ -0,0 +1,16 @@
+.list-request{
+  border-top: $border;
+
+  p{
+    margin-top: $global-margin;
+  }
+
+  > div{
+    padding: $global-padding / 2 0;
+    border-bottom: $border;
+
+    &:first-of-type{
+      border-top: $border;
+    }
+  }
+}

data/app/assets/stylesheets/decidim/modules/_modules.scss

@@ -47,6 +47,7 @@
 @import "orgchart";
 @import "badges";
 @import "hover-section";
+@import "list-request";
 
 //Process elements
 @import "process-header";
@@ -64,15 +65,14 @@
 @import "conference-nav";
 @import "conference-speaker";
 @import "conference-programme";
+@import "conference-registration";
+@import "conference-diploma";
+@import "conference-media";
 
 //User interface
 @import "user-form";
 @import "signup";
 
-//Visualizations
-@import "areachart";
-@import "chart-tooltip";
-
 //Additional elements
 @import "share";
 @import "help";

data/app/assets/stylesheets/decidim/modules/_process-phase.scss

@@ -124,6 +124,7 @@
 .process-header__button{
   .button{
     border-color: $primary;
+    text-transform: uppercase;
   }
 }
 

data/app/assets/stylesheets/decidim/modules/_reveal.scss

@@ -36,11 +36,12 @@
 
   li{
     @extend .p-s;
+
+    display: flex;
   }
 
   li.selected{
     background-color: rgba($warning, .3);
-    display: flex;
     justify-content: space-between;
 
     svg{
@@ -57,3 +58,7 @@
     border-bottom: $border;
   }
 }
+
+.reveal__trigger{
+  cursor: pointer;
+}

data/app/assets/stylesheets/decidim/utils/_helpers.scss

@@ -80,7 +80,7 @@
   align-items: baseline;
 }
 
-// flex--fsb:
+// flex--cb:
 // justify-content: center;
 // align-items: baseline;
 .flex--cb{

data/app/assets/stylesheets/decidim/{modules → vizzs}/_areachart.scss

@@ -1,8 +1,9 @@
 .areachart{
   //common
   svg{
-    background-color: rgba($primary, .1);
+    background-color: darken($light-gray, 2.5);
     overflow: visible;
+    border-radius: 3px;
   }
 
   .title{
@@ -12,17 +13,17 @@
   }
 
   .area{
-    fill: lighten($primary, 25%);
+    fill: rgba($primary, .05);
   }
 
   .line{
     fill: none;
-    stroke: $primary;
+    stroke: rgba($primary, .2);
     stroke-width: 4px;
   }
 
   .circle{
-    fill: $primary;
+    fill: rgba($primary, .2);
   }
 
   .tick{
@@ -43,20 +44,16 @@
 
   @each $key, $value in $map{
     &.#{$key}{
-      svg{
-        background-color: rgba($value, .1);
-      }
-
       .area{
-        fill: lighten($value, 25%);
+        fill: rgba($value, .05);
       }
 
       .line{
-        stroke: $value;
+        stroke: rgba($value, .2);
       }
 
       .circle{
-        fill: $value;
+        fill: rgba($value, .2);
       }
     }
   }

data/app/assets/stylesheets/decidim/vizzs/_linechart.scss

@@ -0,0 +1,115 @@
+.linechart{
+  //common
+  svg{
+    overflow: visible;
+  }
+
+  .background{
+    fill: darken($body-background, 2.5);
+  }
+
+  .title{
+    fill: $muted;
+    text-transform: uppercase;
+    font-weight: 600;
+    font-size: rem-calc(24);
+  }
+
+  .subtitle{
+    fill: $muted;
+    font-size: rem-calc(14);
+  }
+
+  .tick{
+    opacity: .5;
+
+    .dashed{
+      stroke-dasharray: 3;
+    }
+  }
+
+  .line{
+    fill: none;
+    stroke-width: 3px;
+  }
+
+  // helper to colors
+  @mixin loop-colors-types($color, $max: 12){
+    @for $i from 0 through ($max - 1){
+      $interval: ($i % 4) * 24 + 1;
+      $tints: tint($color, $interval);
+      $shades: shade($color, $interval);
+      $adjusts: adjust-color($color, $lightness: $interval, $hue: -$interval);
+
+      .type-#{$i}:not(.legend){
+        @if $i < 4{
+          stroke: $tints;
+
+          &:hover{
+            cursor: pointer;
+            stroke: complement($tints);
+          }
+        }
+
+        @else if $i >= 4 and $i < 8{
+          stroke: $shades;
+
+          &:hover{
+            cursor: pointer;
+            stroke: complement($shades);
+          }
+        }
+
+        @else{
+          stroke: $adjusts;
+
+          &:hover{
+            cursor: pointer;
+            stroke: complement($adjusts);
+          }
+        }
+      }
+
+      .type-#{$i}:not(.line){
+        @if $i < 4{
+          fill: $tints;
+
+          &:hover{
+            cursor: pointer;
+            fill: complement($tints);
+          }
+        }
+
+        @else if $i >= 4 and $i < 8{
+          fill: $shades;
+
+          &:hover{
+            cursor: pointer;
+            fill: complement($shades);
+          }
+        }
+
+        @else{
+          fill: $adjusts;
+
+          &:hover{
+            cursor: pointer;
+            fill: complement($adjusts);
+          }
+        }
+      }
+    }
+  }
+
+  // default color
+  @include loop-colors-types($proposals);
+
+  // colors modifiers
+  $map: $foundation-palette;
+
+  @each $key, $value in $map{
+    &.#{$key}{
+      @include loop-colors-types($value);
+    }
+  }
+}