Browse Source

enable hljs theme and styles on reveal.js

Yuki Takei 7 years ago
parent
commit
a4d56551b1

+ 2 - 0
src/client/styles/scss/_admin.scss

@@ -16,6 +16,8 @@
   }
   }
 
 
   .admin-customize {
   .admin-customize {
+    @import 'hljs';
+
     .ss-container img {
     .ss-container img {
       padding: .5em;
       padding: .5em;
       background-color: #ddd;
       background-color: #ddd;

+ 35 - 0
src/client/styles/scss/_hljs.scss

@@ -0,0 +1,35 @@
+pre.hljs {
+  // override Highlight Js Style Border
+  border-radius: 3px;
+  &.hljs-no-border {
+    border: none;
+  }
+
+  position: relative;
+
+  cite {
+    position: absolute;
+    top: 0;
+    right: 0;
+    padding: 0 4px;
+    background: #ccc;
+    color: #333;
+    font-style: normal;
+    font-weight: bold;
+    opacity: 0.6;
+  }
+}
+
+// styles for highlightjs-line-numbers
+.hljs-ln td.hljs-ln-numbers {
+  user-select: none;
+
+  text-align: center;
+  color: #ccc;
+  border-right: 1px solid #CCC;
+  vertical-align: top;
+  padding-right: 5px;
+}
+.hljs-ln td.hljs-ln-code {
+  padding-left: 10px;
+}

+ 0 - 9
src/client/styles/scss/_override-hljs.scss

@@ -1,9 +0,0 @@
-// override Highlight Js Style Border
-.wiki, .admin-customize {
-  pre.hljs {
-    border-radius: 3px;
-    &.hljs-no-border {
-      border: none;
-    }
-  }
-}

+ 5 - 30
src/client/styles/scss/_wiki.scss

@@ -2,6 +2,11 @@ div.body {
   padding: 10px;
   padding: 10px;
 }
 }
 
 
+// hljs
+.wiki {
+  @import 'hljs';
+}
+
 .wiki {
 .wiki {
   line-height: 1.8em;
   line-height: 1.8em;
   font-size: 15px;
   font-size: 15px;
@@ -108,36 +113,6 @@ div.body {
     }
     }
   }
   }
 
 
-  pre.hljs {
-    position: relative;
-
-    cite {
-      position: absolute;
-      top: 0;
-      right: 0;
-      padding: 0 4px;
-      background: #ccc;
-      color: #333;
-      font-style: normal;
-      font-weight: bold;
-      opacity: 0.6;
-    }
-  }
-
-  // styles for highlightjs-line-numbers
-  .hljs-ln td.hljs-ln-numbers {
-    user-select: none;
-
-    text-align: center;
-    color: #ccc;
-    border-right: 1px solid #CCC;
-    vertical-align: top;
-    padding-right: 5px;
-  }
-  .hljs-ln td.hljs-ln-code {
-    padding-left: 10px;
-  }
-
   p code {  // only inline code blocks
   p code {  // only inline code blocks
     font-family: $font-family-monospace-not-strictly;
     font-family: $font-family-monospace-not-strictly;
   }
   }

+ 0 - 3
src/client/styles/scss/style-app.scss

@@ -8,9 +8,6 @@
 // vendor
 // vendor
 @import 'vendor';
 @import 'vendor';
 
 
-// override highlightJsStyle
-@import 'override-hljs';
-
 // override react-bootstrap-typeahead styles
 // override react-bootstrap-typeahead styles
 @import 'override-rbt';
 @import 'override-rbt';
 
 

+ 5 - 0
src/client/styles/scss/style-presentation.scss

@@ -4,6 +4,11 @@
 @import "~reveal.js/css/reveal.css";
 @import "~reveal.js/css/reveal.css";
 @import "~reveal.js/css/theme/black.css";
 @import "~reveal.js/css/theme/black.css";
 
 
+// hljs
+.reveal {
+  @import 'hljs';
+}
+
 .reveal {
 .reveal {
   font-size: 32px;
   font-size: 32px;
   section * {
   section * {

+ 1 - 0
src/server/views/page_presentation.html

@@ -32,6 +32,7 @@
     <title>{{ path|path2name }} | {{ path }}</title>
     <title>{{ path|path2name }} | {{ path }}</title>
 
 
     {{ cdnStyleTagsByGroup('basis') }}
     {{ cdnStyleTagsByGroup('basis') }}
+    {{ cdnHighlightJsStyleTag(highlightJsStyle()) }}
 
 
     <style>
     <style>
       {{ customCss() }}
       {{ customCss() }}