threddedDANIEL 0.14.5

data/app/assets/stylesheets/thredded/_thredded.scss

@@ -0,0 +1,33 @@
+@import "base";
+
+@import "utilities/is-compact";
+@import "utilities/is-expanded";
+
+@import "layout/main-container";
+@import "layout/main-navigation";
+@import "layout/search-navigation";
+@import "layout/user-navigation";
+@import "layout/navigation";
+@import "layout/moderation";
+@import "layout/user";
+
+@import "components/base";
+@import "components/alerts";
+@import "components/icons";
+@import "components/currently-online";
+@import "components/empty";
+@import "components/flash-message";
+@import "components/following";
+@import "components/form-list";
+@import "components/main-section";
+@import "components/mention-autocomplete";
+@import "components/messageboard";
+@import "components/pagination";
+@import "components/post";
+@import "components/post-form";
+@import "components/preferences";
+@import "components/topic-delete";
+@import "components/topic-header";
+@import "components/topics";
+@import "components/preview_area";
+@import "components/onebox";

data/app/assets/stylesheets/thredded/base/_alerts.scss

@@ -0,0 +1,44 @@
+@mixin thredded-alert($font-color, $background-color, $border-color: lighten($font-color, 50%)) {
+  background: $background-color;
+  border-color: $border-color;
+  color: $font-color;
+
+  a {
+    color: darken($font-color, 10%);
+    text-decoration: underline;
+
+    &:focus,
+    &:hover {
+      color: darken($font-color, 15%);
+    }
+  }
+}
+
+%thredded--alert {
+  border: solid 1px;
+  border-radius: 3px;
+  margin-bottom: $thredded-small-spacing;
+  padding: $thredded-small-spacing;
+  text-decoration: none;
+
+  @include thredded-media-desktop-and-up {
+    margin-bottom: $thredded-base-spacing;
+  }
+}
+
+%thredded--alert--success {
+  @include thredded-alert($thredded-alert-success-color, $thredded-alert-success-background);
+}
+
+%thredded--alert--danger {
+  @include thredded-alert($thredded-alert-danger-color, $thredded-alert-danger-background);
+}
+
+%thredded--alert--info {
+  @include thredded-alert($thredded-alert-info-color, $thredded-alert-info-background);
+}
+
+%thredded--alert--warning {
+  @include thredded-alert($thredded-alert-warning-color, $thredded-alert-warning-background);
+}
+

data/app/assets/stylesheets/thredded/base/_buttons.scss

@@ -0,0 +1,73 @@
+%thredded--button {
+  appearance: none;
+  -webkit-font-smoothing: antialiased;
+  background: $thredded-button-background;
+  border-radius: $thredded-button-border-radius;
+  border: none;
+  color: $thredded-button-color;
+  cursor: pointer;
+  display: inline-block;
+  font-family: $thredded-button-font-family;
+  font-size: $thredded-button-font-size;
+  font-weight: $thredded-button-font-weight;
+  line-height: $thredded-button-line-height;
+  padding: 0.75em 1em;
+  text-decoration: none;
+  user-select: none;
+  vertical-align: middle;
+  white-space: nowrap;
+
+  &:hover,
+  &:focus {
+    background-color: $thredded-button-hover-background;
+    color: $thredded-button-hover-color;
+    text-decoration: none;
+  }
+
+  &:focus {
+    box-shadow: 0 0 3px $thredded-button-background;
+    outline: none;
+  }
+
+  &:disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+
+    &:hover {
+      background: $thredded-button-background;
+    }
+  }
+}
+
+.thredded--button-light {
+  background-color: $thredded-button-light-background;
+  color: $thredded-button-light-color;
+
+  &:hover,
+  &:active,
+  &:focus {
+    background-color: $thredded-button-light-hover-background;
+    color: $thredded-button-light-hover-color;
+  }
+}
+
+.thredded--button-wide {
+  display: block;
+  text-align: center;
+}
+
+%thredded--buttons-list {
+  text-align: center;
+  a, .button_to {
+    display: block;
+    margin-top: $thredded-small-spacing;
+  }
+  @include thredded-media-tablet-and-up {
+    a, .button_to {
+      display: inline-block;
+    }
+    a + a, .button_to + .button_to {
+      margin-left: $thredded-small-spacing;
+    }
+  }
+}

data/app/assets/stylesheets/thredded/base/_dropdown-menu.scss

@@ -0,0 +1,83 @@
+%thredded--dropdown-menu--container {
+  position: relative;
+  display: inline-block;
+  cursor: pointer;
+
+  &:hover {
+    %thredded--dropdown-menu--toggle {
+      color: $thredded-action-hover-color;
+    }
+
+    %thredded--dropdown-menu--actions {
+      transform: scale(1);
+      opacity: 1;
+    }
+  }
+}
+
+%thredded--dropdown-menu--toggle {
+  color: $thredded-action-color;
+}
+
+%thredded--dropdown-menu--actions {
+  position: absolute;
+  background-color: $thredded-overlay-background-color;
+  border-radius: 2px;
+  overflow: hidden;
+  min-width: 8.5rem;
+  z-index: 3;
+  cursor: pointer;
+  box-shadow: $thredded-overlay-box-shadow;
+  transform: scale(0);
+  opacity: 0;
+  transition: transform .3s cubic-bezier(.4, 0, .2, 1), opacity .2s cubic-bezier(.4, 0, .2, 1);
+  will-change: transform;
+}
+
+%thredded--dropdown-menu--actions-bottom-left {
+  @extend %thredded--dropdown-menu--actions;
+  right: 0;
+  transform-origin: 100% 0;
+}
+
+%thredded--dropdown-menu--actions-bottom-right {
+  @extend %thredded--dropdown-menu--actions;
+  left: 0;
+  transform-origin: 0 0;
+}
+
+%thredded--dropdown-menu--actions--item,
+// This specific selector protects from global button rules
+form.button_to > %thredded--dropdown-menu--actions--item {
+  // Override potential global rules
+  background: none;
+  border-radius: 0;
+  border: 0;
+  box-sizing: border-box;
+  font: inherit;
+  margin: 0;
+  text-align: left;
+  transition: none;
+  width: 100%;
+
+  font-size: $thredded-font-size-small;
+  color: $thredded-text-color;
+  text-decoration: none;
+  padding: 1rem 0.75rem;
+  display: block;
+  white-space: nowrap;
+
+  &:active,
+  &:focus,
+  &:hover {
+    background-color: $thredded-button-background;
+    color: $thredded-button-color;
+    text-decoration: none;
+    cursor: pointer;
+  }
+
+  &:active,
+  &:focus {
+    outline: none;
+  }
+}

data/app/assets/stylesheets/thredded/base/_forms.scss

@@ -0,0 +1,84 @@
+%thredded--form--input {
+  background: $thredded-form-background;
+  border: $thredded-form-border;
+  box-shadow: $thredded-form-box-shadow;
+  color: $thredded-form-color;
+  font-family: $thredded-base-font-family;
+  font-size: $thredded-base-font-size;
+  padding: $thredded-small-spacing;
+  transition: border-color;
+
+  &:hover {
+    border-color: $thredded-form-border-hover-color;
+  }
+
+  &:focus {
+    border-color: $thredded-form-border-focus-color;
+    box-shadow: $thredded-form-box-shadow, 0 0 3px $thredded-action-color;
+    outline: none;
+  }
+}
+
+%thredded--form {
+  fieldset {
+    background-color: $thredded-background-color;
+    border: $thredded-base-border;
+    margin: 0 0 $thredded-small-spacing;
+    padding: $thredded-base-spacing;
+  }
+
+  input,
+  label,
+  select {
+    display: block;
+    font-family: $thredded-base-font-family;
+    font-size: $thredded-base-font-size;
+  }
+
+  label {
+    font-weight: 600;
+    margin-bottom: $thredded-small-spacing / 2;
+
+    &.required::after {
+      content: "*";
+    }
+
+    abbr {
+      display: none;
+    }
+  }
+
+  [type='color'], [type='date'], [type='datetime'], [type='datetime-local'], [type='email'], [type='month'],
+  [type='number'], [type='password'], [type='search'], [type='tel'], [type='text'], [type='time'], [type='url'],
+  [type='week'], input:not([type]), textarea, select[multiple=multiple] {
+    @extend %thredded--form--input;
+    box-sizing: border-box;
+    width: 100%;
+  }
+
+  textarea {
+    line-height: $thredded-base-line-height;
+    resize: vertical;
+  }
+
+  input[type="search"] {
+    appearance: none;
+  }
+
+  input[type="checkbox"],
+  input[type="radio"] {
+    display: inline;
+    margin-right: $thredded-small-spacing / 2;
+  }
+
+  input[type="file"] {
+    padding-bottom: $thredded-small-spacing;
+    width: 100%;
+  }
+
+  select {
+    margin-bottom: $thredded-small-spacing;
+    max-width: 100%;
+    width: auto;
+  }
+}

data/app/assets/stylesheets/thredded/base/_grid.scss

@@ -0,0 +1,58 @@
+@mixin thredded-media-mobile {
+  @media (max-width: map-get($thredded-grid-breakpoint-max-widths, mobile)) {
+    @content;
+  }
+}
+
+@mixin thredded-media-tablet-and-down {
+  @media (max-width: map-get($thredded-grid-breakpoint-max-widths, tablet)) {
+    @content;
+  }
+}
+
+@mixin thredded-media-tablet-and-up {
+  @media (min-width: map-get($thredded-grid-breakpoint-max-widths, mobile) + 0.00001rem) {
+    @content;
+  }
+}
+
+@mixin thredded-media-tablet {
+  @include thredded-media-tablet-and-up {
+    @include thredded-media-tablet-and-down {
+      @content;
+    }
+  }
+}
+
+@mixin thredded-media-desktop-and-up {
+  @media (min-width: map-get($thredded-grid-breakpoint-max-widths, tablet) + 0.00001rem) {
+    @content;
+  }
+}
+
+@mixin thredded-media-content-breakout {
+  @media (min-width: $thredded-grid-container-max-width + $thredded-content-breakout-min-width + 0.00001rem) {
+    @content;
+  }
+}
+
+@mixin thredded-media-content-no-breakout {
+  @media (max-width: $thredded-grid-container-max-width + $thredded-content-breakout-min-width) {
+    @content;
+  }
+}
+
+@mixin thredded-media-avatar-breakout {
+  @warn "thredded-media-avatar-breakout is deprecated, use thredded-media-content-breakout instead";
+  @include thredded-media-content-breakout {
+    @content;
+  }
+}
+
+@mixin thredded--clearfix {
+  &::after {
+    clear: both;
+    content: "";
+    display: block;
+  }
+}

data/app/assets/stylesheets/thredded/base/_lists.scss

@@ -0,0 +1,31 @@
+%thredded--list-unstyled {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
+
+%thredded--default-ul {
+  list-style-type: disc;
+  margin-bottom: $thredded-small-spacing;
+  padding-left: $thredded-base-spacing;
+}
+
+%thredded--default-ol {
+  list-style-type: decimal;
+  margin-bottom: $thredded-small-spacing;
+  padding-left: $thredded-base-spacing;
+}
+
+%thredded--dl {
+  margin-bottom: $thredded-small-spacing;
+
+  dt {
+    font-weight: bold;
+    margin-top: $thredded-small-spacing;
+  }
+
+  dd {
+    margin: 0;
+  }
+}
+

data/app/assets/stylesheets/thredded/base/_nav.scss

@@ -0,0 +1,67 @@
+%thredded--nav-link {
+  color: $thredded-nav-color;
+  text-decoration: none;
+  transition: $thredded-action-transition;
+
+  &:active,
+  &:focus,
+  &:hover {
+    color: $thredded-nav-hover-color;
+    text-decoration: none;
+  }
+
+  &:active,
+  &:focus {
+    outline: none;
+  }
+}
+
+%thredded--nav-link-current {
+  color: $thredded-nav-current-color;
+}
+
+
+%thredded--nav-tabs {
+  @extend %thredded--list-unstyled;
+  @include thredded--clearfix;
+  border-bottom: $thredded-base-border;
+  font-size: $thredded-font-size-small;
+  margin-left: 0;
+  text-align: left;
+  list-style-type: none;
+}
+
+%thredded--nav-tabs--item {
+  display: inline-block;
+  margin-right: 1rem;
+
+  a {
+    @extend %thredded--nav-link;
+    display: inline-block;
+    color: $thredded-secondary-nav-color;
+    padding: $thredded-small-spacing 0;
+  }
+
+  &:last-child {
+    margin-right: 0;
+  }
+}
+
+%thredded--nav-tabs--item-current {
+  border-bottom: 1px solid $thredded-action-color;
+  margin-bottom: -1px;
+
+  a {
+    @extend %thredded--nav-link-current;
+  }
+}
+
+%thredded--nav-tabs--item--badge {
+  background: $thredded-badge-active-background;
+  border-radius: 10px;
+  color: $thredded-badge-active-color;
+  font-size: 0.75rem; // 12px
+  line-height: 1;
+  margin-left: 0.4rem;
+  padding: 2px 6px;
+}