thredded 0.2.2 → 0.3.0

data/app/assets/stylesheets/thredded/components/_topic-header.scss

@@ -1,6 +1,10 @@
 &--topic-header {
   margin-bottom: $thredded-large-spacing;
   margin-top: $thredded-base-spacing;
+  @include thredded-media-mobile {
+    margin-bottom: $thredded-small-spacing;
+    margin-top: 0;
+  }
 }
 
 &--topic-header--title {
@@ -12,9 +16,15 @@
 
 &--topic-header--started-by {
   font-size: $thredded-font-size-small;
-  color: lighten($thredded-base-font-color, 30%);
+  color: $thredded-secondary-text-color;
   font-style: normal;
   a {
     @extend %thredded--link;
   }
 }
+
+&--topic-header--edit-topic {
+  @extend %thredded--link;
+  font-size: $thredded-font-size-small;
+  margin-left: 0.4rem;
+}

data/app/assets/stylesheets/thredded/components/_topics.scss

@@ -15,7 +15,7 @@
 
   a {
     @extend %thredded--link;
-    color: $thredded-base-font-color;
+    color: $thredded-text-color;
     display: inline;
 
     &:hover {
@@ -34,9 +34,9 @@
   li {
     font-size: .5rem;
     display: inline-block;
-    color: $thredded-base-font-color;
-    background-color: lighten($thredded-base-font-color, 55%);
-    box-shadow: inset 0 -1px 0 lighten($thredded-base-font-color, 40%);
+    color: $thredded-text-color;
+    background-color: lighten($thredded-text-color, 55%);
+    box-shadow: inset 0 -1px 0 lighten($thredded-text-color, 40%);
     padding: 1px 6px;
     border-radius: 2px;
     text-transform: lowercase;
@@ -47,13 +47,13 @@
 
 &--topics--started-by,
 &--topics--updated-by {
-  color: lighten($thredded-base-font-color, 30%);
+  color: $thredded-secondary-text-color;
   font-size: $thredded-font-size-small;
   font-style: normal;
 
   a {
     @extend %thredded--link;
-    color: lighten($thredded-base-font-color, 20%);
+    color: lighten($thredded-text-color, 20%);
 
     &:hover {
 
@@ -90,7 +90,6 @@
 
 &--topics--posts-count {
   border-radius: 50%;
-  color: white;
   display: inline-block;
   font-weight: 900;
   font-size: 0.8rem;
@@ -102,12 +101,15 @@
   text-align: center;
   top: 0;
   width: 2rem;
+  transition: background 0.1s linear, color 0.1s linear;
 }
 
-&--topic--unread > &--topics--posts-count {
-  background: $thredded-action-color;
+&--topic-unread > &--topics--posts-count {
+  background: $thredded-badge-active-background;
+  color: $thredded-badge-active-color;
 }
 
-&--topic--read > &--topics--posts-count {
-  background: lighten($thredded-base-font-color, 45%);
+&--topic-read > &--topics--posts-count {
+  background: $thredded-badge-inactive-background;
+  color: $thredded-badge-inactive-color;
 }

data/app/assets/stylesheets/thredded/layout/_main-container.scss

@@ -1,15 +1,15 @@
 &--main-container {
   @include thredded--clearfix;
   -webkit-font-smoothing: antialiased;
-  color: $thredded-base-font-color;
+  color: $thredded-text-color;
   font-family: $thredded-base-font-family;
   font-size: $thredded-base-font-size;
   line-height: $thredded-base-line-height;
   margin: 0 auto;
   max-width: $thredded-grid-container-max-width;
-  padding: 1rem;
+  padding: 0;
 
   @include thredded-media-tablet-and-up {
-    padding: 2rem;
+    padding: 0 2rem $thredded-small-spacing 2rem;
   }
 }

data/app/assets/stylesheets/thredded/layout/_main-navigation.scss

@@ -1,30 +1,30 @@
 &--main-navigation {
   @extend %thredded--list-unstyled;
   @include thredded--clearfix;
-  border-bottom: $thredded-base-border;
   display: block;
-  margin: $thredded-small-spacing 0;
+  @include thredded-media-tablet-and-up {
+    margin-top: $thredded-small-spacing;
+  }
 }
 
 &--navigation-breadcrumbs {
   @extend %thredded--list-unstyled;
-  margin-bottom: $thredded-small-spacing;
-
-  @include thredded-media-tablet-and-up {
-    float: left;
-    margin-bottom: 0;
-    padding-bottom: $thredded-small-spacing;
-  }
 
   li {
     display: inline-block;
+    font-weight: bold;
+
+    a {
+      display: inline-block;
+      padding: $thredded-small-spacing 0;
+    }
 
     &:after {
       background: image-url("thredded/breadcrumb-chevron.svg") no-repeat center center;
       content: "";
       display: inline-block;
       height: 10px;
-      margin: 0 $thredded-small-spacing;
+      margin: 0 ($thredded-small-spacing - 0.3rem) 0 $thredded-small-spacing;
       width: 6px;
     }
 
@@ -34,12 +34,6 @@
   }
 
   a {
-    @extend %thredded--link;
-    color: $thredded-base-font-color;
-    font-weight: bold;
-
-    &:hover {
-      color: $thredded-action-color;
-    }
+    @extend %thredded--nav-link;
   }
 }

data/app/assets/stylesheets/thredded/layout/_navigation.scss

@@ -0,0 +1,72 @@
+&--navigation {
+  margin-bottom: $thredded-small-spacing;
+  position: relative;
+  .thredded--icon {
+    display: none;
+  }
+}
+
+@include thredded-media-mobile {
+  &--navigation {
+    display: table;
+    position: relative;
+    width: 100%;
+  }
+  &--main-navigation {
+    position: relative;
+    border: none;
+  }
+  &--navigation-breadcrumbs {
+    font-size: $thredded-font-size-small;
+    padding-right: 5rem;
+  }
+  &--navigation--search {
+    display: none;
+    .thredded--messageboards-index &,
+    .thredded--topics-index &,
+    .thredded--topic-search-results & {
+      display: block;
+    }
+  }
+  &--user-navigation {
+    display: table-footer-group;
+    &-standalone {
+      display: block;
+      margin-bottom: 0;
+    }
+    %icon-nav-item {
+      margin-right: 0;
+      padding: 0;
+      position: absolute;
+      top: (0.8rem - $thredded-small-spacing);
+      z-index: 2;
+      a {
+        display: block;
+        padding: ($thredded-small-spacing / 2) 0 ($thredded-small-spacing / 2) 0;
+        font-size: 0;
+      }
+      .thredded--icon {
+        display: block;
+        width: 2rem;
+        height: 2rem;
+      }
+    }
+    &--settings {
+      @extend %icon-nav-item;
+      right: 2.6rem;
+    }
+    &--private-topics {
+      @extend %icon-nav-item;
+      right: 0;
+      top: 1px;
+      a {
+        position: relative;
+      }
+      &--unread {
+        bottom: 0.3rem;
+        position: absolute;
+        right: -0.2rem;
+      }
+    }
+  }
+}

data/app/assets/stylesheets/thredded/layout/_search-navigation.scss

@@ -0,0 +1,66 @@
+&--navigation--search {
+  margin-right: 0;
+  padding: 0;
+  position: absolute;
+  top: 0;
+  right: 0;
+
+  @include thredded-media-mobile {
+    position: initial;
+  }
+
+  label {
+    display: none;
+  }
+
+  input[type="search"] {
+    box-shadow: none;
+    transition: all 0.15s ease-out 0s;
+    width: 100%;
+
+    @include thredded-media-tablet-and-up {
+      background: transparent;
+      border-color: transparent;
+      font-size: $thredded-font-size-small;
+      min-width: 12.8125rem;
+      margin-right: -$thredded-base-spacing;
+      text-align: right;
+      width: auto;
+      padding: 0.90625rem 0.75rem 0.8125rem 0.75rem;
+
+      &:focus {
+        background: $thredded-background-color;
+        box-shadow: none;
+        min-width: 290px;
+        text-align: left;
+        transition: all 0.15s ease-out 0s;
+        margin-right: 0;
+      }
+
+      &:hover {
+        border-color: transparent;
+        box-shadow: none;
+      }
+
+      &::placeholder {
+        color: $thredded-secondary-nav-color;
+      }
+
+      &:hover:not(:focus) {
+        cursor: pointer;
+        &::placeholder {
+          color: $thredded-nav-hover-color;
+          transition: color 0.1s linear;
+        }
+      }
+
+      &:focus {
+        border-color: $thredded-base-border-color;
+      }
+    }
+  }
+
+  [type="submit"] {
+    display: none;
+  }
+}

data/app/assets/stylesheets/thredded/layout/_user-navigation.scss

@@ -1,87 +1,61 @@
 &--user-navigation {
   @extend %thredded--list-unstyled;
   @include thredded--clearfix;
-  font-size: 0.875em;
+  border-bottom: $thredded-base-border;
   margin-bottom: 1rem;
-  text-align: center;
+  text-align: left;
 
   @include thredded-media-tablet-and-up {
+    font-size: $thredded-font-size-small;
     margin-bottom: 0;
     margin-top: $thredded-large-spacing;
-    text-align: left;
   }
 
   a {
-    @extend %thredded--link;
-    color: lighten($thredded-base-font-color, 30%);
+    @extend %thredded--nav-link;
+    color: $thredded-secondary-nav-color;
   }
-}
 
-&--user-navigation--actions {
-  @extend %thredded--list-unstyled;
-  padding: $thredded-small-spacing 0;
-
-  @include thredded-media-tablet-and-up {
-    float: left;
+  > ul {
+    @extend %thredded--list-unstyled;
   }
+}
 
-  li {
-    display: inline-block;
-    margin-right: $thredded-base-spacing;
+&--user-navigation--item {
+  display: inline-block;
+  margin-right: 1rem;
 
-    &:last-child {
-      margin-right: 0;
-    }
+  a {
+    padding: $thredded-small-spacing 0;
   }
-}
 
-&--user-navigation--search {
-  @include thredded-media-mobile {
-    margin-bottom: 0.5rem;
+  &:last-child {
+    margin-right: 0;
   }
 
-  label {
-    display: none;
+  @include thredded-media-tablet-and-up {
+    padding: $thredded-small-spacing 0;
   }
+}
 
-  input[type="search"] {
-    box-shadow: none;
-    font-size: $thredded-font-size-small;
-    transition: all 0.15s ease-out 0s;
-    width: 100%;
-
-    @include thredded-media-tablet-and-up {
-      border-color: transparent;
-      float: right;
-      min-width: 200px;
-      margin-right: -$thredded-base-spacing;
-      text-align: right;
-      width: auto;
-
-      &:focus {
-        box-shadow: none;
-        min-width: 290px;
-        text-align: left;
-        transition: all 0.15s ease-out 0s;
-        margin-right: 0;
-      }
-
-      &:hover {
-        border-color: transparent;
-        box-shadow: none;
-      }
-    }
-
-    &:hover::placeholder {
-      color: $thredded-action-color;
-    }
+.thredded--preferences &--user-navigation--settings,
+.thredded--new-private-topic &--user-navigation--private-topics,
+.thredded--private-topics-index &--user-navigation--private-topics,
+.thredded--private-topic-show &--user-navigation--private-topics {
+  border-bottom: 1px solid $thredded-action-color;
+  margin-bottom: -1px;
 
-    &:focus {
-      border-color: $thredded-base-border-color;
-    }
+  a {
+    @extend %thredded--nav-link-current;
   }
+}
 
-  input[type="submit"] {
-    display: none;
-  }
+&--user-navigation--private-topics--unread {
+  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;
 }

data/app/commands/thredded/at_notification_extractor.rb

@@ -1,3 +1,4 @@
+# frozen_string_literal: true
 module Thredded
   class AtNotificationExtractor
     def initialize(content)

data/app/commands/thredded/members_marked_notified.rb

@@ -1,3 +1,4 @@
+# frozen_string_literal: true
 module Thredded
   class MembersMarkedNotified
     def initialize(post, members)

data/app/commands/thredded/messageboard_destroyer.rb

@@ -1,3 +1,4 @@
+# frozen_string_literal: true
 module Thredded
   class MessageboardDestroyer
     def initialize(messageboard_name)
@@ -24,9 +25,13 @@ module Thredded
 
     def destroy_all_lower_dependencies
       say 'Destroying lower level dependencies ...'
-      [PostNotification.joins(:non_private_post), UserTopicRead.joins(:post)].each do |child_t|
-        child_t.merge(Post.where(messageboard_id: messageboard.id)).delete_all
+      [PostNotification.joins(non_private_post: :postable), UserTopicReadState.joins(:postable)].each do |child_t|
+        child_t.merge(Topic.where(messageboard_id: messageboard.id)).delete_all
       end
+
+      Thredded::MessageboardUser
+        .where(thredded_messageboard_id: messageboard.id)
+        .delete_all
     end
 
     def destroy_all_posts