decidim 0.0.6 → 0.0.7

data/decidim-admin/app/assets/stylesheets/decidim/admin/modules/_callouts.scss

@@ -0,0 +1,32 @@
+.callout.callout--full{
+  border: 0;
+  margin-bottom: 0;
+  background-color: $primary-color;
+  font-weight: 600;
+  color: $white;
+  &.warning{
+    background-color: $warning-color;
+  }
+  &.success{
+    background-color: $success-color;
+  }
+  &.alert{
+    background-color: $alert-color;
+  }
+
+  p:last-of-type{
+    margin-bottom: 0;
+  }
+
+  .close-button{
+    color: white;
+  }
+}
+
+
+.has-process-title .callout-wrapper{
+  @include breakpoint(large){
+    padding-top: $process-title-height;
+    margin-bottom: -$process-title-height;
+  }
+}

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

@@ -0,0 +1,36 @@
+.card-title{
+  @include smallcaps;
+  font-size: 1rem;
+  @include clearfix;
+}
+
+.card-footer{
+  padding: $card-padding;
+  border-top: 1px solid rgba(black, .1);
+  .button--remove{
+    margin-left: auto;
+  }
+}
+
+.card__filter{
+  margin-bottom: 0;
+  @include breakpoint(mediumlarge){
+    float: right;
+  }
+}
+
+.card__icon-open{
+  display: none;
+}
+.card--collapsed{
+  .card-section,
+  .card-footer{
+    display: none;
+  }
+  .card__icon-close{
+    display: none;
+  }
+  .card__icon-open{
+    display: block;
+  }
+}

data/decidim-admin/app/assets/stylesheets/decidim/admin/modules/_char-counter.scss

@@ -0,0 +1,20 @@
+.textarea-char-counter{
+  position: relative;
+  textarea{
+    padding-bottom: 2.2rem;
+  }
+}
+
+.char-counter{
+  position: absolute;
+  color: $muted;
+  background-color: $white;
+  padding: .3rem .5rem;
+  left: .5rem;
+  right: .5rem;
+  bottom: 1px;
+  text-align: right;
+}
+.char-counter--excess{
+  color: $alert-color;
+}

data/decidim-admin/app/assets/stylesheets/decidim/admin/modules/_component-counter.scss

@@ -0,0 +1,17 @@
+.component-counter{
+  background-color: $medium-gray;
+  color: $white;
+  padding: .1em .5em;
+  min-width: 2em;
+  text-align: center;
+  border-radius: 10px;
+  line-height: 1;
+  font-size: .7rem;
+  float: right;
+  margin-top: .4em;
+}
+
+.component-counter--off{
+  background-color: $light-gray;
+  color: $body-font-color;
+}

data/decidim-admin/app/assets/stylesheets/decidim/admin/modules/_forms.scss

@@ -0,0 +1,80 @@
+$input-margin: 1.5rem;
+
+button,
+input,
+textarea{
+  font-family: inherit;
+}
+
+.form{
+  input[type="text"],
+  input[type="email"],
+  input[type="date"],
+  input[type="tel"],
+  input[type="password"],
+  select{
+    height: 3rem;
+  }
+  input,
+  select,
+  textarea,
+  .check-radio,
+  .input-field{
+    margin-bottom: $input-margin;
+  }
+  .check-radio-group{
+    margin-bottom: 1rem;
+    .check-radio{
+      margin-bottom: .5rem;
+    }
+  }
+
+  label{
+    font-weight: 600;
+  }
+}
+
+.legend{
+  @include smallcaps;
+  margin-bottom: 1rem;
+}
+
+.form-group{
+  background-color: $lighter-gray;
+  padding: 1.5rem 1rem .5rem;
+  margin-bottom: 1.5rem;
+}
+
+
+.form-submit .button{
+  margin-bottom: 0;
+}
+
+.form-general-submit{
+  margin-top: 3rem;
+  justify-content: center;
+}
+
+.check-radio{
+  label{
+    font-weight: normal;
+    display: inline-flex;
+    align-items: center;
+  }
+  input{
+    margin-bottom: 0;
+  }
+}
+
+.form-error{
+  margin-top: -$input-margin;
+  margin-bottom: $input-margin;
+}
+
+.custom-error{
+  @extend .form-error;
+}
+
+.is-custom-error-visible{
+  display: block;
+}

data/decidim-admin/app/assets/stylesheets/decidim/admin/modules/_icons.scss

@@ -0,0 +1,65 @@
+.icon{
+  width: 14px;
+  height: 14px;
+  fill: currentColor;
+}
+
+.icon--outline{
+  fill: transparent;
+  stroke: currentColor;
+  stroke-width: .5px;
+}
+
+.icon--small{
+  width: 10px;
+  height: 10px;
+}
+
+.icon--action{
+  fill: rgba(black, .2);
+}
+
+.icon--action:hover,
+a:hover .icon--action{
+  fill: currentColor;
+}
+
+.icon--after{
+  margin-left: .3rem;
+}
+.icon--before{
+  margin-right: .3rem;
+}
+
+.icon--share{
+  margin-bottom: -2px;
+  width: 12px;
+  height: 12px;
+}
+
+.icon-highlight{
+  color: $warning-color;
+  margin-right: .3rem;
+}
+
+.icon-unpublished{
+  color: $alert-color;
+}
+
+.icon-active{
+  background-color: $success-color;
+  display: inline-block;
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  margin-right: .5rem;
+  vertical-align: middle;
+}
+
+.icon--component{
+  width: 1.5em;
+  height: 1.5em;
+  vertical-align: -.45em;
+  margin-right: .2em;
+  color: $medium-gray;
+}

data/decidim-admin/app/assets/stylesheets/decidim/admin/modules/_layout.scss

@@ -0,0 +1,67 @@
+html{
+  height: 100%;
+}
+
+body{
+  min-height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.main{
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  & > .row{
+    width: 100%;
+    flex-grow: 1;
+    @include breakpoint(medium){
+      display: flex;
+    }
+  }
+}
+
+.layout-wrapper{
+  display: flex;
+  flex-grow: 1;
+  @include clearfix;
+  position: relative;
+}
+
+.layout-nav{
+  max-width: 340px;
+  flex-shrink: 0;
+  @include breakpoint(mediumlarge down){
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    transform: translateX(-100%);
+    transition: transform .3s;
+    z-index: 1;
+  }
+  @include breakpoint(small down){
+    max-width: 100%;
+    width: 100%;
+    transform: translateX(-100%);
+    .secondary-nav{
+      width: calc(100% - 120px);
+    }
+  }
+  &.is-nav-open{
+    transform: translateX(0);
+  }
+}
+
+.layout-content{
+  flex-grow: 1;
+  max-width: 100%;
+}
+
+
+.container{
+  padding: 1rem;
+  max-width: 1200px;
+  @include breakpoint(mediumlarge){
+    padding: 2rem;
+  }
+}

data/decidim-admin/app/assets/stylesheets/decidim/admin/modules/_main-nav.scss

@@ -0,0 +1,41 @@
+.main-nav{
+  width: 120px;
+  min-height: 100%;
+  background-color: $dark-gray;
+  float: left;
+  text-align: center;
+}
+
+.main-nav ul{
+  list-style: none;
+  margin-left: 0;
+  a{
+    padding-top: 1rem;
+    padding-bottom: .8rem;
+    border-bottom: 1px solid rgba(white, .2);
+    li:first-child > &{
+      border-top: 1px solid rgba(white, .2);
+    }
+    display: block;
+    color: $medium-gray;
+    font-size: .7rem;
+    text-transform: uppercase;
+    &:hover{
+      background-color: lighten($dark-gray, 10);
+    }
+  }
+  .is-active a{
+    color: $body-font-color;
+    background-color: $white;
+    box-shadow: inset 5px 0 0 $brand;
+    border-bottom-color: $dark-gray;
+  }
+
+  .icon{
+    width: 24px;
+    height: 24px;
+    display: block;
+    margin: 0 auto;
+    opacity: .5;
+  }
+}

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

@@ -0,0 +1,24 @@
+//Basics
+@import "typography";
+@import "icons";
+@import "buttons";
+@import "forms";
+@import "tabs";
+
+//General layout
+@import "layout";
+@import "title-bar";
+@import "user-login";
+@import "main-nav";
+@import "secondary-nav";
+
+//Process
+@import "process-header";
+
+//Contents
+@import "callouts";
+@import "cards";
+@import "table-list";
+@import "action-icon";
+@import "char-counter";
+@import "component-counter";

data/decidim-admin/app/assets/stylesheets/decidim/admin/modules/_process-header.scss

@@ -0,0 +1,11 @@
+.process-header__title{
+  text-transform: uppercase;
+  font-size: .8rem;
+  margin-bottom: 1rem;
+  color: $muted;
+}
+
+.process-title-summary{
+  @extend .card-title;
+  margin-bottom: 2rem;
+}

data/decidim-admin/app/assets/stylesheets/decidim/admin/modules/_secondary-nav.scss

@@ -0,0 +1,95 @@
+//Vars
+$process-title-height: 3rem;
+
+//Styles
+.secondary-nav{
+  width: 220px;
+  min-height: 100%;
+  float: left;
+  background-color: $white;
+  box-shadow: 6px 6px 10px rgba(black, .04);
+
+  ul{
+    list-style: none;
+    margin-left: 0;
+  }
+  li > a{
+    display: block;
+    padding: .5rem 1rem;
+    margin: 0 .5rem;
+    color: $body-font-color;
+    &:hover,
+    &:focus{
+      color: lighten($body-font-color, 20);
+    }
+  }
+  li.is-active > a{
+    background-color: $lighter-gray;
+    border-radius: $global-radius;
+  }
+  li > ul{
+    margin-left: 1rem;
+    font-size: 90%;
+    a{
+      padding-top: .2rem;
+      padding-bottom: .2rem;
+    }
+    li.is-active a{
+      font-weight: 600;
+      background-color: transparent;
+    }
+  }
+}
+
+.secondary-nav--subnav{
+  padding-top: 2rem;
+
+  @include breakpoint(large){
+    min-height: calc(100% - #{$process-title-height});
+    margin-top: $process-title-height;
+  }
+}
+
+.secondary-nav__title,
+.process-title-content{
+  margin-bottom: 1.5rem;
+  text-transform: uppercase;
+  font-size: .8rem;
+  letter-spacing: .1em;
+  font-weight: bold;
+  white-space: nowrap;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.secondary-nav__title{
+  padding: 1rem 1rem;
+  margin-bottom: 2rem;
+}
+
+.secondary-nav__actions{
+  padding: 1rem 1rem;
+  margin-top: 2rem;
+}
+
+
+.process-title{
+  @include breakpoint(large){
+    margin-bottom: $process-title-height;
+  }
+}
+
+.process-title-content{
+  @include breakpoint(large){
+    position: absolute;
+    left: 120px;
+    right: 0;
+    top: 0;
+    z-index: -1;
+    background-color: $white;
+    padding: 1rem 1.5rem;
+    height: $process-title-height;
+    box-shadow: 0 6px 10px rgba(black, .04);
+  }
+}