about summary refs log tree commit diff
path: root/app/javascript
diff options
context:
space:
mode:
Diffstat (limited to 'app/javascript')
-rw-r--r--app/javascript/mastodon/components/status.js2
-rw-r--r--app/javascript/styles/components.scss29
2 files changed, 17 insertions, 14 deletions
diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index a3b9c477b..44645d7d1 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -166,7 +166,7 @@ class StatusUnextended extends ImmutablePureComponent {
   }
 
   handleExpandedToggle = () => {
-    this.setState({ isExpanded: !this.state.isExpanded });
+    if (!this.state.isCollapsed) this.setState({ isExpanded: !this.state.isExpanded });
   };
 
   handleCollapsedClick = () => {
diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss
index 017d1bdb0..15bae3dee 100644
--- a/app/javascript/styles/components.scss
+++ b/app/javascript/styles/components.scss
@@ -504,15 +504,6 @@
     }
   }
 
-  .status__content__spoiler-link {
-    background: lighten($ui-base-color, 30%);
-
-    &:hover {
-      background: lighten($ui-base-color, 33%);
-      text-decoration: none;
-    }
-  }
-
   .status__content__text {
     display: none;
 
@@ -525,15 +516,27 @@
 .status__content__spoiler-link {
   display: inline-block;
   border-radius: 2px;
-  background: transparent;
-  border: 0;
+  background: lighten($ui-base-color, 30%);
+  border: 1px lighten($ui-base-color, 30%) solid;
   color: lighten($ui-base-color, 8%);
   font-weight: 500;
   font-size: 11px;
-  padding: 0 6px;
+  padding: 0 5px;
   text-transform: uppercase;
-  line-height: inherit;
+  line-height: 18px;
   cursor: pointer;
+  transition: background-color .3s, color .3s;
+
+    &:hover {
+      background: lighten($ui-base-color, 33%);
+      text-decoration: none;
+    }
+
+  .status-collapsed &, .status-collapsed &:hover {
+    background: transparent;
+    color: lighten($ui-base-color, 30%);
+    vertical-align: bottom;
+  }
 }
 
 .status__prepend-icon-wrapper {