Updated attachment links to have dropdown for open type

[bookstack] / resources / sass / _text.scss

diff --git a/resources/sass/_text.scss b/resources/sass/_text.scss
index e629724978b6933afbeba7a37d6a6c3f0523ff8f..51f3156143c381271eec6e3f8b839fe6ca1daab0 100644 (file)
--- a/resources/sass/_text.scss
+++ b/resources/sass/_text.scss
@@ -96,9 +96,6 @@ a {
   text-decoration: none;
   transition: filter ease-in-out 80ms;
   line-height: 1.6;
   text-decoration: none;
   transition: filter ease-in-out 80ms;
   line-height: 1.6;

-  @include whenDark {
-    filter: brightness(1.3) saturate(0.7);
-  }

   &:hover {
     text-decoration: underline;
   }
   &:hover {
     text-decoration: underline;
   }


@@ -115,6 +112,13 @@ a {
   }
 }
 
   }
 }
 

+a.no-link-style {
+  color: inherit;
+  &:hover {
+    text-decoration: none;
+  }
+}
+

 .blended-links a {
   color: inherit;
   svg {
 .blended-links a {
   color: inherit;
   svg {


@@ -133,11 +137,14 @@ p, ul, ol, pre, table, blockquote {
 hr {
   border: 0;
   height: 1px;
 hr {
   border: 0;
   height: 1px;

-  @include lightDark(background, #eaeaea, #222);
+  @include lightDark(background, #eaeaea, #555);

   margin-bottom: $-l;
   &.faded {
     background-image: linear-gradient(to right, #FFF, #e3e0e0 20%, #e3e0e0 80%, #FFF);
   }
   margin-bottom: $-l;
   &.faded {
     background-image: linear-gradient(to right, #FFF, #e3e0e0 20%, #e3e0e0 80%, #FFF);
   }

+  &.darker {
+    @include lightDark(background, #DDD, #666);
+  }

   &.margin-top, &.even {
     margin-top: $-l;
   }
   &.margin-top, &.even {
     margin-top: $-l;
   }


@@ -156,7 +163,6 @@ em, i, .italic {
 
 small, p.small, span.small, .text-small {
   font-size: 0.75rem;
 
 small, p.small, span.small, .text-small {
   font-size: 0.75rem;

-  @include lightDark(color, #5e5e5e, #999);

 }
 
 sup, .superscript {
 }
 
 sup, .superscript {


@@ -204,8 +210,9 @@ blockquote {
   display: block;
   position: relative;
   border-left: 4px solid var(--color-primary);
   display: block;
   position: relative;
   border-left: 4px solid var(--color-primary);

-  background-color: #F8F8F8;
+  @include lightDark(background-color, #f8f8f8, #333);

   padding: $-s $-m $-s $-xl;
   padding: $-s $-m $-s $-xl;

+  overflow: auto;

   &:before {
     content: "\201C";
     font-size: 2em;
   &:before {
     content: "\201C";
     font-size: 2em;


@@ -233,7 +240,7 @@ blockquote {
   font-size: 0.84em;
   border: 1px solid #DDD;
   border-radius: 3px;
   font-size: 0.84em;
   border: 1px solid #DDD;
   border-radius: 3px;

-  @include lightDark(background-color, #f8f8f8f, #2b2b2b);
+  @include lightDark(background-color, #f8f8f8, #2b2b2b);

   @include lightDark(border-color, #DDD, #444);
 }
 
   @include lightDark(border-color, #DDD, #444);
 }
 


@@ -272,13 +279,9 @@ ul, ol {
   }
 }
 ul {
   }
 }
 ul {

-  padding-left: $-m * 1.3;
-  padding-right: $-m * 1.3;

   list-style: disc;
   ul {
     list-style: circle;
   list-style: disc;
   ul {
     list-style: circle;

-    margin-top: 0;
-    margin-bottom: 0;

   }
   label {
     margin: 0;
   }
   label {
     margin: 0;


@@ -287,23 +290,34 @@ ul {
 
 ol {
   list-style: decimal;
 
 ol {
   list-style: decimal;

-  padding-left: $-m * 2;
-  padding-right: $-m * 2;
+}
+
+ol, ul {
+  padding-left: $-m * 2.0;
+  padding-right: $-m * 2.0;
+}
+
+li > ol, li > ul {
+  margin-top: 0;
+  margin-bottom: 0;
+  margin-block-end: 0;
+  margin-block-start: 0;
+  padding-block-end: 0;
+  padding-block-start: 0;
+  padding-left: $-m * 1.2;
+  padding-right: $-m * 1.2;

 }
 
 li.checkbox-item, li.task-list-item {
 }
 
 li.checkbox-item, li.task-list-item {

+  display: list-item;

   list-style: none;
   list-style: none;

-  margin-left: - ($-m * 1.3);
+  margin-left: -($-m * 1.2);

   input[type="checkbox"] {
     margin-right: $-xs;
   }
   input[type="checkbox"] {
     margin-right: $-xs;
   }

-}
-
-li > ol, li > ul {
-  margin-block-end: 0px;
-  margin-block-start: 0px;
-  padding-block-end: 0px;
-  padding-block-start: 0px;
+  li.checkbox-item, li.task-list-item {
+    margin-left: $-xs;
+  }

 }
 
 /*
 }
 
 /*


@@ -354,12 +368,21 @@ li > ol, li > ul {
   overflow-wrap: break-word;
 }
 
   overflow-wrap: break-word;
 }
 

-.limit-text {
+.text-limit-lines-1 {

   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 

+.text-limit-lines-2 {
+  // -webkit use here is actually standardised cross-browser:
+  // https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+}
+

 /**
  * Grouping
  */
 /**
  * Grouping
  */