comunit-base 0.37.200628.0

data/app/assets/stylesheets/comunit/base/albums.scss

@@ -0,0 +1,101 @@
+@import "biovision/base/default";
+@import "default";
+
+@mixin image-texts {
+  background: rgba(255, 255, 255, .75);
+  bottom: 0;
+  left: 0;
+  padding: .8rem;
+  position: absolute;
+  right: 0;
+  transition: .2s;
+
+  .title {
+    font-size: $font-size-increased;
+    line-height: 2.4rem;
+
+    a:link,
+    a:visited {
+      color: #0000ff;
+      text-decoration: none;
+    }
+
+    a:hover {
+      text-decoration: underline;
+    }
+  }
+}
+
+.list-of-albums {
+  margin: 0 auto;
+  padding: 0;
+  width: 66rem;
+
+  li {
+    box-shadow: $block-shadow;
+    list-style: none;
+    margin: .8rem auto;
+    padding: 0;
+    position: relative;
+
+    .image {
+      height: 44rem;
+      overflow: hidden;
+      width: 100%;
+
+      img {
+        height: 100%;
+        object-fit: cover;
+        transform: scale(1.25);
+        transition: 2s;
+        width: 100%;
+      }
+    }
+
+    .texts {
+      @include image-texts;
+    }
+
+    &:hover {
+      .image {
+        img {
+          transform: scale(1);
+        }
+      }
+
+      .texts {
+        background: rgba(255, 255, 255, .9);
+      }
+    }
+  }
+}
+
+article.album {
+  ul {
+    margin: 0 auto;
+    padding: 0;
+    width: 48rem;
+
+    li {
+      list-style: none;
+      margin: .8rem;
+      padding: 0;
+      box-shadow: $block-shadow;
+      position: relative;
+
+      .image {
+        width: 100%;
+        overflow: hidden;
+
+        img {
+          max-width: 100%;
+          max-height: 100%;
+        }
+      }
+
+      .texts {
+        @include image-texts;
+      }
+    }
+  }
+}

data/app/assets/stylesheets/comunit/base/components.scss

@@ -0,0 +1,8 @@
+@import "comunit/base/components/forms";
+@import "comunit/base/components/deeds";
+@import "comunit/base/components/campaigns";
+@import "comunit/base/components/calendar";
+@import "comunit/base/components/carousel";
+@import "comunit/base/components/posts";
+@import "biovision/vote/vote";
+@import "biovision/comment/comments";

data/app/assets/stylesheets/comunit/base/components/calendar.scss

@@ -0,0 +1,62 @@
+@import "comunit/base/default";
+
+$calendar_heading_weekend_background: #fc605c !default;
+$calendar_heading_weekend_color: #fc605c !default;
+$calendar_weekend_color: #ffbfb2 !default;
+$calendar_today: #34c749 !default;
+
+table.calendar {
+  margin: var(--spacer-s) auto;
+  border-spacing: 0;
+  font-size: var(--font-size-normal);
+  box-shadow: 0 0 .1rem .1rem rgba(0, 0, 0, .1);
+
+  caption {
+    color: #777;
+  }
+
+  thead {
+    tr {
+      background: linear-gradient(to top, $row_background_even, #fff);
+    }
+  }
+
+  td,
+  th {
+    text-align: center;
+    padding: 0.2rem;
+    font-weight: normal;
+
+    > div {
+      border: solid #eee 0.1rem;
+      padding: 0 0.4rem;
+      line-height: 1.5;
+    }
+  }
+
+  th:nth-of-type(6), th:nth-of-type(7) {
+    //background: linear-gradient(to top, $calendar_heading_weekend_background, #fff);
+    color: $calendar_heading_weekend_color;
+  }
+
+  td:nth-of-type(6), td:nth-of-type(7) {
+    color: $calendar_heading_weekend_background;
+
+    &.outer {
+      color: $calendar_weekend_color;
+    }
+  }
+
+  .today {
+    font-weight: bold;
+
+    > div {
+      border: solid 0.2rem;
+      color: $calendar_today;
+    }
+  }
+
+  .outer {
+    color: #ccc;
+  }
+}

data/app/assets/stylesheets/comunit/base/components/campaigns.scss

@@ -0,0 +1 @@
+@import "comunit/base/components/campaigns/candidates";

data/app/assets/stylesheets/comunit/base/components/campaigns/candidates.scss

@@ -0,0 +1,16 @@
+@import "comunit/base/default";
+@import "biovision/base/default";
+
+.candidate-image {
+  margin-bottom: var(--spacer-m);
+
+  .image {
+    margin: 0 auto;
+    max-width: 40rem;
+  }
+
+  figcaption {
+    font-size: var(--font-size-large);
+    text-align: center;
+  }
+}

data/app/assets/stylesheets/comunit/base/components/carousel.scss

@@ -0,0 +1,36 @@
+.js-biovision-carousel {
+  width: 100%;
+}
+
+.carousel-container {
+  width: 100%;
+}
+
+.posts-featured {
+  .carousel-item {
+    width: 100%;
+  }
+}
+
+.posts-carousel {
+  .carousel-item {
+    padding: var(--spacer-xxs);
+    width: calc(100% / 3);
+  }
+}
+
+@media (max-width: 720px) {
+  .posts-carousel {
+    .carousel-item {
+      width: 50%;
+    }
+  }
+}
+
+@media (max-width: 440px) {
+  .posts-carousel {
+    .carousel-item {
+      width: 100%;
+    }
+  }
+}

data/app/assets/stylesheets/comunit/base/components/deeds.scss

@@ -0,0 +1,2 @@
+@import "comunit/base/components/deeds/preview";
+@import "comunit/base/components/deeds/form";

data/app/assets/stylesheets/comunit/base/components/deeds/form.scss

@@ -0,0 +1,26 @@
+.deed-form {
+  max-width: 64rem;
+}
+
+.deed-form_categories {
+  box-shadow: inset 0 0 .2rem rgba(0, 0, 0, .5);
+  height: 32rem;
+  margin: var(--spacer-m) 0;
+  overflow: scroll;
+  padding: var(--spacer-s);
+
+  ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  li {
+    margin: 0;
+    padding: 0;
+
+    li {
+      padding-left: var(--spacer-s);
+    }
+  }
+}

data/app/assets/stylesheets/comunit/base/components/deeds/preview.scss

@@ -0,0 +1,11 @@
+.deed-preview {
+  border-bottom: var(--border-secondary);
+  margin-bottom: var(--spacer-xs);
+  padding-bottom: var(--spacer-xs);
+
+  figcaption {
+    font-family: var(--font-family-heading);
+    font-size: var(--font-size-increased);
+    padding: var(--spacer-xxs);
+  }
+}

data/app/assets/stylesheets/comunit/base/components/forms.scss

@@ -0,0 +1,24 @@
+@import "comunit/base/components/forms/inputs";
+
+.fields {
+  dd {
+    margin: 0;
+    padding: 0;
+  }
+
+  input[type=text]:not([size]),
+  input[type=email]:not([size]),
+  input[type=tel]:not([size]),
+  textarea {
+    width: 100%;
+  }
+}
+
+form {
+  .fields {
+    > div {
+      margin-bottom: var(--spacer-xs);
+      padding: var(--spacer-xxs);
+    }
+  }
+}

data/app/assets/stylesheets/comunit/base/components/forms/inputs.scss

@@ -0,0 +1,32 @@
+$input-border: .1rem solid #777 !default;
+$input-shadow-focus: inset 0 0 .4rem rgba(64, 64, 96, .5) !default;
+
+.input-text {
+  border: $input-border;
+  border-radius: .2rem;
+  font-size: var(--font-size-normal);
+  margin: 0;
+  padding: var(--spacer-xs);
+
+  &:focus {
+    box-shadow: $input-shadow-focus;
+    outline: none;
+  }
+}
+
+select.select {
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  appearance: none;
+  background: image_url('comunit/base/icons/dropdown.svg') no-repeat center right var(--spacer-xs);
+  border: $input-border;
+  border-radius: .2rem;
+  font-size: var(--font-size-normal);
+  margin: 0;
+  padding: var(--spacer-xs) 3.2rem var(--spacer-xs) var(--spacer-xs);
+
+  &:focus {
+    box-shadow: $input-shadow-focus;
+    outline: none;
+  }
+}

data/app/assets/stylesheets/comunit/base/components/posts.scss

@@ -0,0 +1,28 @@
+@import "comunit/base/default";
+@import "comunit/base/components/posts/my-form";
+@import "comunit/base/components/posts/preview";
+@import "comunit/base/components/posts/featured";
+@import "comunit/base/components/posts/list";
+@import "comunit/base/components/posts/item";
+
+.post-counters {
+  align-items: center;
+  color: #656565;
+  display: flex;
+  font-size: var(--font-size-small);
+  justify-content: flex-end;
+
+  span {
+    margin: var(--spacer-xxxs);
+  }
+
+  .views {
+    background: image_url('comunit/base/icons/view.svg') no-repeat left center / 1.2rem auto;
+    padding-left: 1.6rem;
+  }
+
+  .comments {
+    background: image_url('comunit/base/icons/comment.svg') no-repeat left center / 1.2rem auto;
+    padding-left: 1.6rem;
+  }
+}

data/app/assets/stylesheets/comunit/base/components/posts/featured.scss

@@ -0,0 +1,86 @@
+@import "comunit/base/default";
+
+.posts-featured-in-carousel {
+  display: grid;
+  grid-gap: var(--spacer-xs);
+  grid-template-columns: 2fr 3fr;
+  grid-template-rows: minmax(3rem, 1fr) auto;
+  height: 100%;
+
+  a {
+    color: inherit;
+  }
+
+  figure {
+    grid-column: 1;
+    grid-row: 1 / -1;
+
+    a {
+      background: linear-gradient(to top, #eee, #fff);
+      display: block;
+      height: 100%;
+      overflow: hidden;
+      width: 100%;
+    }
+  }
+
+  img {
+    height: 100%;
+    object-fit: contain;
+    width: 100%;
+  }
+
+  .title {
+    font-family: var(--font-family-heading);
+    font-size: var(--font-size-large);
+    padding: var(--spacer-xxs) var(--spacer-xs);
+  }
+
+  time {
+    color: var(--text-color-secondary);
+    display: block;
+    font-size: var(--font-size-decreased);
+    padding: 0 var(--spacer-xs);
+    text-align: right;
+  }
+
+  p {
+    margin: 0;
+    padding: var(--spacer-s);
+  }
+
+  .text {
+    grid-column: 2;
+    grid-row: 1;
+  }
+
+  .footer {
+    grid-column: 2;
+    grid-row: 2;
+    padding: var(--spacer-xxs);
+  }
+}
+
+@media (max-width: 640px) {
+  .posts-featured-in-carousel {
+    display: flex;
+    flex-direction: column;
+
+    figure {
+      margin-bottom: var(--spacer-s);
+
+      a {
+        margin: 0 auto;
+        max-width: 32rem;
+      }
+    }
+
+    p {
+      padding: var(--spacer-s) var(--spacer-xs);
+    }
+
+    .footer {
+      margin-top: auto;
+    }
+  }
+}