Modularize syntax theme
Change-Id: I682bdbeb6b8bd4dbb4b389c52043db4b6c19286e
diff --git a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html
index e09e125..72afd4a 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html
+++ b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html
@@ -21,6 +21,7 @@
<link rel="import" href="../gr-diff-comment-thread/gr-diff-comment-thread.html">
<link rel="import" href="../gr-diff-highlight/gr-diff-highlight.html">
<link rel="import" href="../gr-diff-selection/gr-diff-selection.html">
+<link rel="import" href="../gr-syntax-themes/gr-theme-default.html">
<dom-module id="gr-diff">
<template>
@@ -140,83 +141,8 @@
content: '\00BB';
position: absolute;
}
-
- /* Syntax highlights */
- /* Highlight.js emits the following classes that do not have styles here:
- subst, symbol, class, function, doctag, meta-string, section,
- builtin-name, bulletm, code, formula, quote, addition, deletion
- See:
- http://highlightjs.readthedocs.io/en/latest/css-classes-reference.html
- */
- .gr-syntax-literal,
- .gr-syntax-keyword,
- .gr-syntax-selector-tag {
- font-weight: bold;
- color: #00f;
- }
- .gr-syntax-built_in {
- color: #555;
- }
- .gr-syntax-type,
- .gr-syntax-selector-pseudo,
- .gr-syntax-template-variable {
- color: #ff00e7;
- }
- .gr-syntax-number {
- color: violet;
- }
- .gr-syntax-regexp,
- .gr-syntax-variable,
- .gr-syntax-selector-attr,
- .gr-syntax-template-tag {
- color: #FA8602;
- }
- .gr-syntax-string,
- .gr-syntax-selector-id {
- color: #018846;
- }
- .gr-syntax-title {
- color: teal;
- }
- .gr-syntax-params {
- color: red;
- }
- .gr-syntax-comment {
- color: #af72a9;
- font-style: italic;
- }
- .gr-syntax-meta {
- color: #0091AD;
- }
- .gr-syntax-meta-keyword {
- color: #00426b;
- font-weight: bold;
- }
- .gr-syntax-tag {
- color: #DB7C00;
- }
- .gr-syntax-name { /* XML/HTML Tag Name */
- color: brown;
- }
- .gr-syntax-attr { /* XML/HTML Attribute */
- color: #8C7250;
- }
- .gr-syntax-attribute { /* CSS Property */
- color: #299596;
- }
- .gr-syntax-emphasis {
- font-style: italic;
- }
- .gr-syntax-strong {
- font-weight: bold;
- }
- .gr-syntax-link {
- color: blue;
- }
- .gr-syntax-selector-class {
- color: #1F71FF;
- }
</style>
+ <style include="gr-theme-default"></style>
<div class$="[[_computeContainerClass(_loggedIn, viewMode)]]"
on-tap="_handleTap">
<gr-diff-selection>
diff --git a/polygerrit-ui/app/elements/diff/gr-syntax-themes/gr-theme-default.html b/polygerrit-ui/app/elements/diff/gr-syntax-themes/gr-theme-default.html
new file mode 100644
index 0000000..e2abc52
--- /dev/null
+++ b/polygerrit-ui/app/elements/diff/gr-syntax-themes/gr-theme-default.html
@@ -0,0 +1,97 @@
+<!--
+Copyright (C) 2016 The Android Open Source Project
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+<dom-module id="gr-theme-default">
+ <template>
+ <style>
+ /**
+ * @overview Highlight.js emits the following classes that do not have
+ * styles here:
+ * subst, symbol, class, function, doctag, meta-string, section,
+ * builtin-name, bulletm, code, formula, quote, addition, deletion
+ * @see {@link http://highlightjs.readthedocs.io/en/latest/css-classes-reference.html}
+ */
+
+ .gr-syntax-literal,
+ .gr-syntax-keyword,
+ .gr-syntax-selector-tag {
+ font-weight: bold;
+ color: #00f;
+ }
+ .gr-syntax-built_in {
+ color: #555;
+ }
+ .gr-syntax-type,
+ .gr-syntax-selector-pseudo,
+ .gr-syntax-template-variable {
+ color: #ff00e7;
+ }
+ .gr-syntax-number {
+ color: violet;
+ }
+ .gr-syntax-regexp,
+ .gr-syntax-variable,
+ .gr-syntax-selector-attr,
+ .gr-syntax-template-tag {
+ color: #FA8602;
+ }
+ .gr-syntax-string,
+ .gr-syntax-selector-id {
+ color: #018846;
+ }
+ .gr-syntax-title {
+ color: teal;
+ }
+ .gr-syntax-params {
+ color: red;
+ }
+ .gr-syntax-comment {
+ color: #af72a9;
+ font-style: italic;
+ }
+ .gr-syntax-meta {
+ color: #0091AD;
+ }
+ .gr-syntax-meta-keyword {
+ color: #00426b;
+ font-weight: bold;
+ }
+ .gr-syntax-tag {
+ color: #DB7C00;
+ }
+ .gr-syntax-name { /* XML/HTML Tag Name */
+ color: brown;
+ }
+ .gr-syntax-attr { /* XML/HTML Attribute */
+ color: #8C7250;
+ }
+ .gr-syntax-attribute { /* CSS Property */
+ color: #299596;
+ }
+ .gr-syntax-emphasis {
+ font-style: italic;
+ }
+ .gr-syntax-strong {
+ font-weight: bold;
+ }
+ .gr-syntax-link {
+ color: blue;
+ }
+ .gr-syntax-selector-class {
+ color: #1F71FF;
+ }
+ </style>
+ </template>
+</dom-module>
\ No newline at end of file
