about summary refs log tree commit diff
path: root/app/assets/stylesheets
diff options
context:
space:
mode:
Diffstat (limited to 'app/assets/stylesheets')
-rw-r--r--app/assets/stylesheets/application.scss29
-rw-r--r--app/assets/stylesheets/components.scss135
-rw-r--r--app/assets/stylesheets/stream_entries.scss8
3 files changed, 154 insertions, 18 deletions
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
index c4c876e30..c590f7038 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/application.scss
@@ -256,6 +256,35 @@ button:focus {
   }
 }
 
+.compact-header {
+  h1 {
+    font-size: 24px;
+    line-height: 28px;
+    color: $color3;
+    overflow: hidden;
+    font-weight: 500;
+    margin-bottom: 20px;
+
+    a {
+      color: inherit;
+      text-decoration: none;
+    }
+
+    small {
+      font-weight: 400;
+      color: $color2;
+    }
+
+    img {
+      display: inline-block;
+      margin-bottom: -5px;
+      margin-right: 15px;
+      width: 36px;
+      height: 36px;
+    }
+  }
+}
+
 @import 'forms';
 @import 'accounts';
 @import 'stream_entries';
diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss
index 6bb683f17..f0948b0f3 100644
--- a/app/assets/stylesheets/components.scss
+++ b/app/assets/stylesheets/components.scss
@@ -34,6 +34,7 @@
 
 .column-icon {
   color: $color3;
+  background: lighten($color1, 4%);
 
   &:hover {
     color: lighten($color3, 7%);
@@ -187,7 +188,7 @@
 a.status__content__spoiler-link {
   display: inline-block;
   border-radius: 2px;
-  color: lighten($color1, 6%);
+  color: lighten($color1, 8%);
   font-weight: 500;
   font-size: 11px;
   padding: 0px 6px;
@@ -200,7 +201,7 @@ a.status__content__spoiler-link {
   padding-left: 68px;
   position: relative;
   min-height: 48px;
-  border-bottom: 1px solid lighten($color1, 6%);
+  border-bottom: 1px solid lighten($color1, 8%);
   cursor: default;
 
   .status__relative-time {
@@ -226,6 +227,8 @@ a.status__content__spoiler-link {
 }
 
 .detailed-status {
+  background: lighten($color1, 4%);
+
   .status__content {
     font-size: 19px;
     line-height: 24px;
@@ -237,12 +240,19 @@ a.status__content__spoiler-link {
   }
 }
 
+.detailed-status__meta {
+  margin-top: 15px;
+  color: lighten($color1, 26%);
+  font-size: 14px;
+  line-height: 18px;
+}
+
 .detailed-status__action-bar {
   background: lighten($color1, 4%);
   display: flex;
   flex-direction: row;
-  border-top: 1px solid lighten($color1, 6%);
-  border-bottom: 1px solid lighten($color1, 6%);
+  border-top: 1px solid lighten($color1, 8%);
+  border-bottom: 1px solid lighten($color1, 8%);
   padding: 10px 0;
 }
 
@@ -257,7 +267,7 @@ a.status__content__spoiler-link {
 
 .account {
   padding: 10px;
-  border-bottom: 1px solid lighten($color1, 6%);
+  border-bottom: 1px solid lighten($color1, 8%);
 
   .account__display-name {
     flex: 1 1 auto;
@@ -298,6 +308,7 @@ a.status__content__spoiler-link {
   word-wrap: break-word;
   font-weight: 400;
   overflow: hidden;
+  color: $color3;
 
   p {
     margin-bottom: 20px;
@@ -325,8 +336,8 @@ a.status__content__spoiler-link {
 }
 
 .account__action-bar {
-  border-top: 1px solid lighten($color1, 6%);
-  border-bottom: 1px solid lighten($color1, 6%);
+  border-top: 1px solid lighten($color1, 8%);
+  border-bottom: 1px solid lighten($color1, 8%);
   line-height: 36px;
   overflow: hidden;
   flex: 0 0 auto;
@@ -337,7 +348,7 @@ a.status__content__spoiler-link {
   text-decoration: none;
   overflow: hidden;
   width: 80px;
-  border-left: 1px solid lighten($color1, 6%);
+  border-left: 1px solid lighten($color1, 8%);
   padding: 10px 5px;
 
   & > span {
@@ -412,8 +423,9 @@ a.status__content__spoiler-link {
     opacity: 0.5;
   }
 
-  .status__content__spoiler-link {
+  a.status__content__spoiler-link {
     background: lighten($color1, 26%);
+    color: lighten($color1, 4%);
 
     &:hover {
       background: lighten($color1, 29%);
@@ -422,6 +434,20 @@ a.status__content__spoiler-link {
   }
 }
 
+.notification__message {
+  margin-left: 68px;
+  padding: 8px 0;
+  padding-bottom: 0;
+  cursor: default;
+  color: $color3;
+  font-size: 15px;
+  position: relative;
+
+  .fa {
+    color: $color4;
+  }
+}
+
 .notification__display-name {
   color: inherit;
   text-decoration: none;
@@ -646,7 +672,7 @@ a.status__content__spoiler-link {
 
 .tabs-bar {
   display: flex;
-  background: lighten($color1, 6%);
+  background: lighten($color1, 8%);
   flex: 0 0 auto;
   overflow-y: auto;
 }
@@ -660,7 +686,7 @@ a.status__content__spoiler-link {
   text-align: center;
   font-size:12px;
   font-weight: 500;
-  border-bottom: 2px solid lighten($color1, 6%);
+  border-bottom: 2px solid lighten($color1, 8%);
 
   &.active {
     border-bottom: 2px solid $color4;
@@ -850,7 +876,8 @@ a.status__content__spoiler-link {
 }
 
 .column-link {
-  background: lighten($color1, 6%);
+  background: lighten($color1, 8%);
+  color: $color5;
 
   &:hover {
     background: lighten($color1, 11%);
@@ -883,6 +910,7 @@ a.status__content__spoiler-link {
 
 .autosuggest-textarea__textarea {
   height: 100px;
+  background: $color5;
 }
 
 .autosuggest-textarea__suggestions {
@@ -968,11 +996,40 @@ button.active i.fa-retweet {
 }
 
 .status-card {
+  display: flex;
+  cursor: pointer;
+  font-size: 14px;
+  border: 1px solid lighten($color1, 8%);
+  border-radius: 4px;
+  color: lighten($color1, 26%);
+  margin-top: 14px;
+  text-decoration: none;
+  overflow: hidden;
+
   &:hover {
-    background: lighten($color1, 6%);
+    background: lighten($color1, 8%);
   }
 }
 
+.status-card__title {
+  display: block;
+  font-weight: 500;
+  margin-bottom: 5px;
+  color: $color3;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.status-card__description {
+  color: $color3;
+}
+
+.status-card__image {
+  flex: 0 0 100px;
+  background: lighten($color1, 8%);
+}
+
 .load-more {
   display: block;
   color: lighten($color1, 26%);
@@ -981,7 +1038,7 @@ button.active i.fa-retweet {
   text-decoration: none;
 
   &:hover {
-    background: lighten($color1, 6%);
+    background: lighten($color1, 8%);
   }
 }
 
@@ -1020,3 +1077,53 @@ button.active i.fa-retweet {
   font-size: 14px;
   margin: 0;
 }
+
+.loading-indicator {
+  color: $color2;
+}
+
+.collapsable-collapsed {
+  color: $color3;
+  background: lighten($color1, 4%);
+}
+
+.collapsable {
+  color: $color5;
+  background: lighten($color1, 8%);
+}
+
+.media-spoiler {
+  background: $color8;
+  color: $color5;
+}
+
+.modal-container--preloader {
+  background: lighten($color1, 8%);
+}
+
+.account--panel {
+  background: lighten($color1, 4%);
+  border-top: 1px solid lighten($color1, 8%);
+  border-bottom: 1px solid lighten($color1, 8%);
+}
+
+.column-settings--outer {
+  background: lighten($color1, 8%);
+}
+
+.column-settings--section {
+  color: $color3;
+}
+
+.modal-container--nav {
+  color: $color5;
+}
+
+.account--follows-info {
+  color: $color5;
+}
+
+.setting-toggle {
+  color: $color3;
+}
+
diff --git a/app/assets/stylesheets/stream_entries.scss b/app/assets/stylesheets/stream_entries.scss
index 595275527..d427c1466 100644
--- a/app/assets/stylesheets/stream_entries.scss
+++ b/app/assets/stylesheets/stream_entries.scss
@@ -5,24 +5,24 @@
   .entry {
     background: lighten($color2, 8%);
 
-    &, .detailed-status.light {
+    .detailed-status.light, .status.light {
       border-bottom: 1px solid $color2;
     }
 
     &:last-child {
-      &, .detailed-status.light {
+      &, .detailed-status.light, .status.light {
         border-bottom: 0;
         border-radius: 0 0 4px 4px;
       }
     }
 
     &:first-child {
-      &, .detailed-status.light {
+      &, .detailed-status.light, .status.light {
         border-radius: 4px 4px 0 0;
       }
 
       &:last-child {
-        &, .detailed-status.light {
+        &, .detailed-status.light, .status.light {
           border-radius: 4px;
         }
       }
generated by cgit-pink (git 2.37.1) at 2024-07-06 01:23:10 +0000