decidim-core 0.20.1 → 0.23.1

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

@@ -0,0 +1,53 @@
+.process-stats{
+  overflow: hidden;
+  margin: 2rem 0;
+  display: flex;
+  flex-wrap: wrap;
+
+  &__title{
+    color: $muted;
+    font-size: .9rem;
+    letter-spacing: .01em;
+    text-transform: uppercase;
+    font-weight: 600;
+    margin-bottom: 0;
+  }
+
+  &__data{
+    text-align: center;
+    padding: 1rem .25rem;
+    width: calc(50% - 1rem);
+    margin: .5rem;
+    position: relative;
+
+    &::after{
+      content: "";
+      display: inline-block;
+      border-left: 2px solid $primary;
+      height: 2rem;
+      position: absolute;
+      left: 0;
+      top: calc(50% - 1rem);
+    }
+
+    @include breakpoint(medium down){
+      &:nth-child(odd)::after{
+        border: none;
+      }
+    }
+
+    @include breakpoint(mediumlarge){
+      width: calc(25% - 1rem);
+
+      &:nth-child(4n + 1)::after{
+        border: none;
+      }
+    }
+  }
+
+  &__number{
+    font-weight: 800;
+    font-size: 2rem;
+    line-height: 1;
+  }
+}

data/app/assets/stylesheets/decidim/modules/_progress-bar.scss

@@ -4,7 +4,6 @@
 
   .progress__bar__title{
     color: $muted;
-    text-transform: uppercase;
     font-size: .875rem;
 
     .progress__bar__number{
@@ -64,6 +63,11 @@
       @extend .extra__suport-text;
 
       font-weight: 600;
+      text-transform: uppercase;
     }
   }
+
+  &.progress__bar--horizontal{
+    margin-bottom: .35rem;
+  }
 }

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

@@ -21,6 +21,17 @@
 
 .reveal__footer{
   border-top: $border;
+
+  .buttons{
+    display: flex;
+    justify-content: center;
+    padding: 10px 0 50px; // bottom padding is needed to avoid hiding buttons on mobiles because of https://stackoverflow.com/questions/37112218/css3-100vh-not-constant-in-mobile-browser
+
+    @include breakpoint(medium){
+      padding-bottom: 0;
+      margin-bottom: -1rem;
+    }
+  }
 }
 
 .reveal__bg{

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

@@ -31,7 +31,8 @@
     height: 3rem;
   }
 
-  legend{
+  h3{
+    display: table;
     font-size: 1.25em;
     line-height: 1.2;
     margin-bottom: 1.5rem;
@@ -61,7 +62,7 @@
 
 .user-nickname{
   label .row{
-    div:first-of-type{
+    > span:first-of-type{
       // this is the prefix div
       @extend .input-group-label;
 
@@ -78,7 +79,7 @@
       }
     }
 
-    div:last-of-type{
+    > span:last-of-type{
       // this is the input div
       @extend .input-group-field;
 
@@ -95,13 +96,13 @@
   label.is-invalid-label .row{
     margin-bottom: $form-spacing;
 
-    div:first-of-type{
+    > span:first-of-type{
       // this is the prefix div
       background-color: mix($input-background-invalid, $light-gray, 8%);
       border-color: $input-error-color;
     }
 
-    div:last-of-type{
+    > span:last-of-type{
       // this is the input div
       height: 4.2rem;
 

data/app/assets/stylesheets/decidim/modules/_static-pages.scss

@@ -19,7 +19,6 @@
   }
 
   ul{
-    text-transform: uppercase;
     margin-left: .5rem;
   }
 

data/app/assets/stylesheets/decidim/modules/_status-labels.scss

@@ -11,7 +11,8 @@
 }
 
 .proposal-status,
-.collaborative-draft-status{
+.collaborative-draft-status,
+.project-status{
   float: left;
   margin-right: .5rem;
 }
@@ -25,3 +26,8 @@
 .label.light{
   color: $white;
 }
+
+.label.muted{
+  background: $muted;
+  color: $white;
+}

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

@@ -0,0 +1,5 @@
+.sticky{
+  .card{
+    width: 100%;
+  }
+}

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

@@ -16,9 +16,13 @@ $tags-border: $border;
   }
 
   a{
-    display: block;
+    display: inline-block;
     border: $tags-border;
     padding: 0 .5rem;
+
+    &:hover{
+      text-decoration: underline;
+    }
   }
 }
 
@@ -29,3 +33,9 @@ $tags-border: $border;
 .tags--inline{
   display: inline;
 }
+
+.tags--list{
+  li{
+    display: block;
+  }
+}

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

@@ -1,4 +1,3 @@
-
 /* Variables */
 
 $timeline-color: var(--primary);
@@ -151,8 +150,8 @@ $timeline-padding: 1rem;
 
 .timeline__item-text{
   display: block;
-  text-transform: uppercase;
   letter-spacing: .03em;
+  text-transform: uppercase;
   font-size: 90%;
   color: $body-font-color;
   font-weight: 600;

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

@@ -6,12 +6,42 @@ input{
   font-family: inherit;
 }
 
+a{
+  color: $anchor-color;
+
+  &:hover{
+    color: $anchor-color-hover;
+    text-decoration: underline;
+    text-decoration-skip-ink: auto;
+  }
+
+  &:focus{
+    outline: $anchor-outline-focus;
+    outline-offset: $anchor-outline-offset;
+  }
+}
+
+button{
+  &:focus{
+    outline: $button-outline-focus;
+    // outline-color: var(--highlight);
+  }
+}
+
 @mixin heading($heading){
   line-height: 1.2;
-  font-size: map-get(map-get(map-get($header-styles, small), $heading), 'font-size') / 16 + em;
+  font-size:
+    map-get(
+      map-get(map-get($header-styles, small), $heading),
+      "font-size"
+    ) / 16 + em;
 
   @include breakpoint(medium){
-    font-size: map-get(map-get(map-get($header-styles, medium), $heading), 'font-size') / 16 + em;
+    font-size:
+      map-get(
+        map-get(map-get($header-styles, medium), $heading),
+        "font-size"
+      ) / 16 + em;
   }
 }
 
@@ -74,18 +104,19 @@ hr{
   position: relative;
   margin-bottom: 1rem;
   font-weight: 600;
-  text-transform: uppercase;
   font-size: 1.125em;
   letter-spacing: .05em;
+  text-transform: uppercase;
 
   &::before{
     content: "";
     display: inline-block;
     width: 4px;
-    height: .8em;
+    height: 1.35em;
     background-color: var(--primary);
     margin-right: .5rem;
-    margin-bottom: -.1rem;
+    margin-bottom: -.5rem;
+    vertical-align: top;
   }
 
   &.collapse{
@@ -99,9 +130,9 @@ hr{
 
 .mini-title{
   color: $muted;
-  text-transform: uppercase;
   font-size: .9rem;
   letter-spacing: .01em;
+  text-transform: uppercase;
   font-weight: 600;
   margin-bottom: 0;
 
@@ -116,8 +147,44 @@ hr{
   }
 }
 
+.data-title{
+  &__over{
+    color: $muted;
+    font-size: .9rem;
+    letter-spacing: .01em;
+    text-transform: uppercase;
+    font-weight: 800;
+    margin-bottom: .5rem;
+  }
+
+  &__main{
+    font-size: 2rem;
+    line-height: 1;
+    letter-spacing: .01em;
+    text-transform: uppercase;
+    font-weight: 800;
+    margin-bottom: 0;
+  }
+
+  &__sub{
+    color: $muted;
+    font-size: .9rem;
+    letter-spacing: .01em;
+    text-transform: uppercase;
+    line-height: 1;
+  }
+}
+
+.page-title-wrapper{
+  text-align: center;
+}
+
 .page-title{
   margin-bottom: 3rem;
+
+  a:hover{
+    text-decoration: underline;
+  }
 }
 
 .text-highlight{
@@ -139,7 +206,12 @@ hr{
 }
 
 // text status-color
-$map: map-merge($foundation-palette, (muted: $muted));
+$map: map-merge(
+  $foundation-palette,
+  (
+    muted: $muted,
+  )
+);
 
 @each $key, $value in $map{
   .text-#{$key}{
@@ -157,12 +229,14 @@ $map: map-merge($foundation-palette, (muted: $muted));
 
 .text-medium{
   font-size: 90%;
-  color: $muted;
 }
 
 .text-small{
   font-size: 80%;
-  color: $muted;
+}
+
+.text-sm{
+  font-size: 80%;
 }
 
 .text-uppercase{
@@ -218,5 +292,15 @@ textarea,
 time,
 tt,
 var{
-  @include modifiers(color, (muted: $muted));
+  @include modifiers(
+    color,
+    (
+      muted: $muted,
+    )
+  );
+}
+
+ul.no-bullet-indented,
+ol.no-bullet-indented{
+  list-style-type: none;
 }

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

@@ -1,6 +1,5 @@
 .diff-direction-label{
   display: block;
-  text-transform: uppercase;
   font-size: 85%;
   line-height: 1;
   margin-bottom: .25rem;

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

@@ -27,3 +27,13 @@
     font-url('decidim/Source_Sans_Pro_900.woff') format('woff'),
     font-url('decidim/Source_Sans_Pro_900.ttf') format('truetype');
 }
+
+@font-face{
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 900;
+  src:
+    asset-data-url('decidim/Roboto-Regular.woff2') format('woff2'),
+    font-url('decidim/Roboto-Regular.woff') format('woff'),
+    font-url('decidim/Roboto-Regular.ttf') format('truetype');
+}

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

@@ -136,3 +136,11 @@
     }
   }
 }
+
+.pull-left{
+  float: left;
+}
+
+.pull-right{
+  float: right;
+}

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

@@ -80,7 +80,6 @@ $palette: (
       margin-right: 0;
     }
   }
-
   @else if $dir == column{
     & > *{
       margin: $gap/2 0;
@@ -94,7 +93,6 @@ $palette: (
       margin-bottom: 0;
     }
   }
-
   @else if $dir == row-reverse{
     & > *{
       margin: 0 $gap/2;
@@ -108,7 +106,6 @@ $palette: (
       margin-right: 0;
     }
   }
-
   @else if $dir == column-reverse{
     & > *{
       margin: $gap/2 0;
@@ -131,7 +128,7 @@ $palette: (
   line-height: $global-lineheight;
 }
 
-@mixin inline-separator($char: ' '){
+@mixin inline-separator($char: " "){
   > *:not(:last-child)::after{
     content: $char;
   }
@@ -144,7 +141,7 @@ $palette: (
 }
 
 @mixin spinner($size, $orbit, $satellite, $time){
-  @include animation( animation-spin $time infinite linear );
+  @include animation(animation-spin $time infinite linear);
   @include square($size);
 
   box-sizing: border-box;
@@ -164,10 +161,92 @@ $palette: (
   @include size($size, $size);
 }
 
+@mixin skip-button(){
+  left: -999px;
+  position: absolute;
+  top: auto;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  z-index: -999;
+
+  &:focus,
+  &:active{
+    background-color: $primary;
+    color: $white;
+    left: 0;
+    top: 0;
+    width: auto;
+    height: auto;
+    overflow: auto;
+    margin: 10px;
+    padding: 5px;
+    font-size: 1.4em;
+    z-index: 999;
+    outline: $button-outline-focus;
+    // outline-color: var(--highlight);
+    position: absolute;
+  }
+}
+
+@mixin button-hollow-variant($color, $hover-text-color: $white){
+  background-color: $color;
+
+  &.hover,
+  &:hover,
+  &.focus,
+  &:focus{
+    background-color: $color;
+  }
+
+  &.disabled,
+  &[disabled]{
+    &,
+    &:active,
+    &:hover,
+    &:focus{
+      background-color: $color;
+    }
+  }
+
+  &.hollow{
+    background-color: transparent;
+    color: $color;
+    border-color: $color;
+
+    &.hover,
+    &:hover,
+    &.focus,
+    &:focus{
+      border-color: $color;
+      background-color: $color;
+      color: $hover-text-color;
+    }
+
+    &.disabled,
+    &[disabled]{
+      &,
+      &:active,
+      &:hover,
+      &:focus{
+        background-color: transparent;
+        border-color: $color;
+        color: $color;
+        box-shadow: none;
+        text-decoration: none;
+      }
+    }
+  }
+}
+
 @keyframes animation-spin{
-  to{ transform: rotate(1turn); }
+  to{
+    transform: rotate(1turn);
+  }
 }
 
 @-webkit-keyframes animation-spin{
-  to{ -webkit-transform: rotate(1turn); }
+  to{
+    -webkit-transform: rotate(1turn);
+  }
 }