Use prettier for SCSS (#3895)
[GitHub/WoltLab/WCF.git] / wcfsetup / install / files / style / bbcode / code.scss
index 008a89391781ffdb8d75932b67fc78b71a88e59c..510d83918caab665ecc4ead090bd7663d8377fcf 100644 (file)
@@ -1,16 +1,16 @@
 .redactor-layer pre {
        background-color: rgb(255, 255, 255) !important;
-       box-shadow: 0 0 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
+       box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
        border-radius: 2px;
        color: rgb(68, 68, 68) !important;
-       font-family: Consolas, 'Courier New', monospace;
+       font-family: Consolas, "Courier New", monospace;
        margin: 1em 0;
        padding: 10px 20px;
        position: relative;
        white-space: pre-wrap;
        word-break: break-all;
        word-wrap: break-word;
-       
+
        &:not(.redactorCalcHeight)::before,
        &.woltlabHtml::before {
                color: $wcfContentLink;
                display: block;
                font-family: $wcfFontFamily;
                margin-bottom: 20px;
-               
+
                @include wcfFontHeadline;
        }
-       
+
        &.woltlabHtml {
                &::before {
                        margin-bottom: 30px;
                }
-               
+
                &::after {
                        color: $wcfContentDimmedText;
                        content: attr(data-description);
@@ -36,7 +36,7 @@
                        font-family: $wcfFontFamily;
                        position: absolute;
                        top: 32px;
-                       
+
                        @include wcfFontSmall;
                }
        }
 
 .codeBox {
        background-color: $wcfContentBackground;
-       box-shadow: 0 0 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
+       box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
        border-radius: 2px;
        clear: both;
        margin: 1em 0;
        padding: 10px;
        position: relative;
-       
+
        &.collapsed {
                .codeBoxCode {
                        max-height: 200px;
                        overflow: hidden;
                }
-               
+
                > .toggleButton {
                        bottom: 0;
                        left: 0;
                        position: absolute;
                        right: 0;
                        z-index: 1;
-                       
+
                        &::before {
-                               background-image: linear-gradient(to top, opacify($wcfContentBackground, .9), transparentize($wcfContentBackground, 1));
+                               background-image: linear-gradient(
+                                       to top,
+                                       opacify($wcfContentBackground, 0.9),
+                                       transparentize($wcfContentBackground, 1)
+                               );
                                content: "";
                                height: 60px;
                                left: 0;
@@ -77,7 +81,7 @@
                        }
                }
        }
-       
+
        .codeBoxHeader {
                position: sticky;
                top: 50px;
                padding: 10px 10px 10px;
                margin: -10px -10px 0;
                background-color: $wcfContentBackground;
-               
+
                align-items: center;
                display: flex;
-               
+
                /* required to avoid layout jumping caused by the dynamically added 24px button */
                min-height: 24px;
-               
+
                > .codeBoxHeadline {
                        flex: 1 1 auto;
                        padding: 0 10px;
-                       
+
                        @include wcfFontHeadline;
                }
        }
-       
+
        .codeBoxCode {
                position: relative;
                padding-left: 7ch;
-               
+
                > code {
                        display: block;
                        overflow-x: auto;
-                       font-family: Consolas, 'Courier New', monospace;
-                       
+                       font-family: Consolas, "Courier New", monospace;
+
                        .codeBoxLine {
                                display: block;
-                               
+
                                > a {
                                        margin-left: -7ch;
                                        overflow: hidden;
                                        white-space: nowrap;
                                        /* No one has line numbers greater than 999999 */
                                        width: 6ch;
-       
+
                                        &::before {
                                                content: attr(title);
                                        }
                                }
-                               
+
                                > span {
                                        white-space: pre-wrap;
                                        word-break: break-all;
                                }
-                               
+
                                &:target {
                                        background-color: rgba(255, 255, 102, 1);
                                }
                        }
                }
        }
-       
+
        > .toggleButton {
-               background-color: opacify($wcfContentBackground, .9);
+               background-color: opacify($wcfContentBackground, 0.9);
                cursor: pointer;
                display: block;
                padding: 10px 20px 0 10px;
                text-align: center;
-               
+
                @include wcfFontSmall;
        }
 }
        position: static;
 }
 
-
 /* PrismJS 1.15.0
 https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript&plugins=autoloader */
 /**
@@ -167,76 +170,75 @@ https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javasc
  * Based on dabblet (http://dabblet.com)
  * @author Lea Verou
  */
- .token.comment,
- .token.prolog,
- .token.doctype,
- .token.cdata {
-        color: slategray;
- }
- .token.punctuation {
-        color: #999;
- }
- .namespace {
-        opacity: .7;
- }
- .token.property,
- .token.tag,
- .token.boolean,
- .token.number,
- .token.constant,
- .token.symbol,
- .token.deleted {
-        color: #905;
- }
- .token.selector,
- .token.attr-name,
- .token.string,
- .token.char,
- .token.builtin,
- .token.inserted {
-        color: #690;
- }
- .token.operator,
- .token.entity,
- .token.url,
- .language-css .token.string,
- .style .token.string {
-        color: #9a6e3a;
-        background: hsla(0, 0%, 100%, .5);
- }
- .token.atrule,
- .token.attr-value,
- .token.keyword {
-        color: #07a;
- }
- .token.function,
- .token.class-name {
-        color: #DD4A68;
- }
- .token.regex,
- .token.important,
- .token.variable {
-        color: #e90;
- }
- .token.important,
- .token.bold {
-        font-weight: 600;
- }
- .token.italic {
-        font-style: italic;
- }
- .token.entity {
-        cursor: help;
- }
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+       color: slategray;
+}
+
+.token.punctuation {
+       color: #999;
+}
+
+.namespace {
+       opacity: 0.7;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+       color: #905;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+       color: #690;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+       color: #9a6e3a;
+       background: hsla(0, 0%, 100%, 0.5);
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+       color: #07a;
+}
+
+.token.function,
+.token.class-name {
+       color: #dd4a68;
+}
+
+.token.regex,
+.token.important,
+.token.variable {
+       color: #e90;
+}
+
+.token.important,
+.token.bold {
+       font-weight: 600;
+}
+.token.italic {
+       font-style: italic;
+}
+
+.token.entity {
+       cursor: help;
+}