commit b8868d8788677f37127ad0e248306622e89069f0
parent 22a404a1b6a9e67206f219537eef1568f419d818
Author: bdmfegys@duck.com <bdmfegys@duck.com>
Date: Fri, 10 May 2024 23:00:33 -0400
joplin-userchrome.css: fix curly braces for wallust new_engine option
Diffstat:
| M | joplin-userchrome.css | | | 318 | ++++++++++++++++++++++++++++++++++++++++---------------------------------------- |
1 file changed, 159 insertions(+), 159 deletions(-)
diff --git a/joplin-userchrome.css b/joplin-userchrome.css
@@ -2,30 +2,30 @@
/* designed originally by uxamanda (https://discourse.joplinapp.org/u/uxamanda). latest version https://github.com/amandamcg/joplin-theme */
/* Redesigned by Stephen (robotcorner) https://https://github.com/robotcorner/joplin-theme-dark-gruvbox */
-:root {{
- --white: {color7};
- --dark-white: {color15};
- --light-grey: {color7};
- --grey: {color15};
- --dark-grey: {color8};
- --darker-grey: {color8};
- --black: {color0};
- --red: {color1};
- --red-dark: {color9};
- --green: {color2};
- --green-dark: {color10};
- --yellow:{color3};
- --yellow-dark: {color11};
- --yellow-darkest: {color11};
- --blue: {color4};
- --blue-dark: {color12};
- --purple: {color5};
- --purple-dark: {color13};
- --aqua: {color6};
- --aqua-dark: {color14};
- --aqua-very-dark: {color14};
- --orange: {color3};
- --orange-dark: {color11};
+:root {
+ --white: {{color7}};
+ --dark-white: {{color15}};
+ --light-grey: {{color7}};
+ --grey: {{color15}};
+ --dark-grey: {{color8}};
+ --darker-grey: {{color8}};
+ --black: {{color0}};
+ --red: {{color1}};
+ --red-dark: {{color9}};
+ --green: {{color2}};
+ --green-dark: {{color10}};
+ --yellow:{{color3}};
+ --yellow-dark: {{color11}};
+ --yellow-darkest: {{color11}};
+ --blue: {{color4}};
+ --blue-dark: {{color12}};
+ --purple: {{color5}};
+ --purple-dark: {{color13}};
+ --aqua: {{color6}};
+ --aqua-dark: {{color14}};
+ --aqua-very-dark: {{color14}};
+ --orange: {{color3}};
+ --orange-dark: {{color11}};
--base-size-1: 1px;
--base-size-4: 5px;
@@ -49,196 +49,196 @@
--font-line-height: 1.4em;
--font-size: var(--base-size-16);
--icon-size: var(--font-size);
-}}
+}
-* {{
+* {
font-family: var(--font-sans) !important;
font-weight: var(--font-weight-base) !important;
font-size: var(--font-size) !important;
line-height: var(--font-line-height) !important;
-}}
+}
-.fa, .far, .fas {{
+.fa, .far, .fas {
font-weight: 900 !important;
font-family: "Font Awesome 5 Free" !important;
font-size: var(--icon-size) !important;
-}}
+}
-body {{
+body {
background-color: var(--black) !important;
font-size: var(--base-size-16) !important;
-}}
+}
-.noteTextViewer {{
+.noteTextViewer {
border-left: var(--base-size-1) solid var(--dark-grey) !important;
-}}
+}
-#react-root>div>div>div:last-child {{
+#react-root>div>div>div:last-child {
border-left: none !important;
background-color: var(--black)
-}}
+}
-#react-root>div>div>div:last-child>div>div {{
+#react-root>div>div>div:last-child>div>div {
border-bottom: var(--base-size-1) solid var(--dark-grey) !important;
-}}
+}
-#react-root>div>div>div:last-child>div>div>span {{
+#react-root>div>div>div:last-child>div>div>span {
padding: 0 18px 4px 4px !important;
-}}
+}
-#react-root>div>div>div:last-child>div>div>div .editor-toolbar {{
+#react-root>div>div>div:last-child>div>div>div .editor-toolbar {
border-bottom: var(--base-size-1) solid var(--dark-grey) !important;
margin-bottom: 0 !important;
border-top: none !important;
-}}
+}
-#react-root>div>div>div:last-child>div>div .editor-toolbar {{
+#react-root>div>div>div:last-child>div>div .editor-toolbar {
border-bottom: none !important;
-}}
+}
-#react-root>div>div>div:last-child>div>div>div>div:last-child>div:last-child {{
+#react-root>div>div>div:last-child>div>div>div>div:last-child>div:last-child {
border: none !important;
-}}
+}
/* markdown */
-.ace_text-layer {{
+.ace_text-layer {
padding: 3%;
-}}
+}
-.ace_content {{
+.ace_content {
background-color: var(--black) !important;
-}}
+}
-.ace_editor div, .ace_editor span {{
+.ace_editor div, .ace_editor span {
font-family: var(--font-mono) !important;
font-weight: --font-weight-base;
color: var(--dark-white);
-}}
+}
-.ace_heading {{
+.ace_heading {
/*color: var(--white) !important;*/
color: var(--yellow) !important;
-}}
+}
/*Bold*/
-.ace_string.ace_strong {{
+.ace_string.ace_strong {
color: var(--green-dark) !important;
font-weight: bold !important;
-}}
+}
/* Italics */
-.ace_string.ace_emphasis {{
+.ace_string.ace_emphasis {
color: var(--green-dark) !important;
font-style: italic !important;
-}}
+}
/* Line Breaks */
-.ace_constant.ace_language.ace_escape {{
+.ace_constant.ace_language.ace_escape {
color: gold !important;
-}}
+}
-.ace_variable {{
+.ace_variable {
color: var(--white) !important;
-}}
+}
/* Lists and Checkboxes */
-.ace_list {{
+.ace_list {
/*color: var(--light-grey) !important;*/
color: palegoldenrod !important;
-}}
+}
/* Inline Codes and Codeblocks */
-.ace_support.ace_function {{
+.ace_support.ace_function {
color: var(--aqua) !important;
-}}
+}
-.ace_string {{
+.ace_string {
color: var(--primary) !important;
-}}
+}
-.ace_cursor {{
+.ace_cursor {
border-left: var(--base-size-1) solid var(--orange) !important;
-}}
+}
/* prevent cursor from blinking */
/* https://discourse.joplinapp.org/t/share-your-css/1730/17 */
-.ace_cursor-layer:not(.ace_hidden-cursors) .ace_cursor {{
+.ace_cursor-layer:not(.ace_hidden-cursors) .ace_cursor {
opacity: 1 !important;
-}}
+}
/* gui */
-.side-bar {{
+.side-bar {
background-color: var(--black) !important;
opacity: 0.8;
-}}
+}
-.side-bar .folders {{}}
+.side-bar .folders {}
-.side-bar .folders .list-item, .side-bar div, .side-bar span {{
+.side-bar .folders .list-item, .side-bar div, .side-bar span {
color: var(--dark-white) !important;
font-weight: var(--font-weight-base) !important;
font-size: var(--font-size) !important;
margin-bottom: var(--base-size-1);
-}}
+}
-.side-bar div div {{
+.side-bar div div {
font-size: var(--font-size) !important;
-}}
+}
/* making icons the same width so text aligns */
-.side-bar .fas:first-of-type {{
+.side-bar .fas:first-of-type {
width: var(--base-size-18)
-}}
+}
-.list-item div {{
+.list-item div {
margin-left: auto !important;
padding-right: var(--base-size-14) !important;
opacity: 0.3 !important;
-}}
+}
-.synchronize-button {{}}
+.synchronize-button {}
-.note-list {{
+.note-list {
background-color: var(--black);
padding: var(--base-size-8) 0;
opacity: 0.7;
-}}
+}
-.note-list input[type="checkbox"i] {{
+.note-list input[type="checkbox"i] {
opacity: 0.5 !important;
-}}
+}
-.note-list div {{
+.note-list div {
border-bottom: 0 !important;
-}}
+}
-.note-list input[type="checkbox"i] {{
+.note-list input[type="checkbox"i] {
margin-right: 1em !important;
-}}
+}
-.note-list a.list-item span, .tags .list-item {{
+.note-list a.list-item span, .tags .list-item {
/* font-family: "IBM Plex Mono" !important; */
/* font-size: 12px !important; */
color: var(--dark-white) !important;
-}}
+}
-.tag-list {{
+.tag-list {
order: 4;
-}}
+}
/* icons */
-.fa, .far, .fas {{
+.fa, .far, .fas {
color: var(--light-grey) !important;
padding-right: var(--base-size-4);
padding-left: var(--base-size-4)
-}}
+}
-#react-root>div {{
+#react-root>div {
background-color: var(--dark-grey) !important;
-}}
+}
-#react-root div div div:last-child div input {{
+#react-root div div div:last-child div input {
margin: 0 !important;
margin-right: var(--base-size-18) !important;
margin-bottom: 4px !important;
@@ -248,88 +248,88 @@ body {{
font-family: var(--font-mono);
font-weight: var(--font-weight-light);
background-color: var(--black) !important
-}}
+}
-.editor-toolbar .button {{
+.editor-toolbar .button {
height: var(--base-size-40)
-}}
+}
-.editor-toolbar .button:not(.disabled):hover, .header .button:not(.disabled):hover{{
+.editor-toolbar .button:not(.disabled):hover, .header .button:not(.disabled):hover{
color: var(--white) !important;
background-color: var(--yellow-darkest) !important;
border: 1px solid var(--yellow-darkest) !important;
-}}
+}
-.editor-toolbar .button, .header .button {{
+.editor-toolbar .button, .header .button {
border: 0 !important;
-}}
+}
-.editor-toolbar .button i {{
+.editor-toolbar .button i {
font-size: var(--icon-size) !important;
-}}
+}
-.editor-toolbar .fa, .editor-toolbar .fas {{
+.editor-toolbar .fa, .editor-toolbar .fas {
padding-right: 4;
-}}
+}
-.header {{
+.header {
border-bottom: var(--base-size-1) solid var(--dark-grey) !important;
-}}
+}
-.header .title {{
+.header .title {
color: var(--darker-white);
-}}
+}
-input {{
+input {
border-radius: var(--base-size-4) !important;
border: 0px !important;
background-color: var(--dark-grey) !important;
border: var(--base-size-1) solid var(--grey) !important;
opacity: 0.7;
/*outline: none;*/
-}}
+}
-input:focus {{
+input:focus {
outline: none;
border: var(--base-size-1) solid var(--orange-dark) !important;
-}}
+}
-.header .title {{
+.header .title {
display: none !important;
-}}
+}
-.folders i.fa.fa-minus-square, .folders i.fa.fa-plus-square {{
+.folders i.fa.fa-minus-square, .folders i.fa.fa-plus-square {
padding-right: 3px !important;
-}}
+}
-.folders .list-item-container {{
+.folders .list-item-container {
margin: 0 !important;
-}}
+}
-.note-list .list-item-container:hover, .folders .list-item-container:hover {{
+.note-list .list-item-container:hover, .folders .list-item-container:hover {
/* background-color: var(--darker-white) !important; */
background-color: var(--yellow-darkest) !important;
-}}
+}
-.folders a.list-item {{
+.folders a.list-item {
padding-left: var(--base-size-8);
margin: 0 !important;
-}}
+}
-.side-bar>div:last-child div {{
+.side-bar>div:last-child div {
font-family: var(--font-mono) !important;
font-size: calc(var(--font-size)/1.3) !important;
padding: 2px;
-}}
+}
-.side-bar>div:last-child {{
+.side-bar>div:last-child {
padding: var(--base-size-4) !important;
font-family: var(--font-mono) !important;
border-top: var(--base-size-1) solid var(--black);
-}}
+}
-.synchronize-button {{
+.synchronize-button {
border: none !important;
background: var(--dark-grey);
border-radius: var(--base-size-4) !important;
@@ -339,73 +339,73 @@ input:focus {{
font-family: var(--font-mono) !important;
font-weight: var(--font-weight-bold) !important;
letter-spacing: 1px;
-}}
+}
/* TESTING BELOW */
/* code mirror */
-.cm {{
+.cm {
font-family: var(--font-sans);
font-size: var(--font-size);
-}}
+}
/* background and base color */
-.cm-s-material-darker.CodeMirror {{
+.cm-s-material-darker.CodeMirror {
background-color: var(--black) !important;
color: var(--light-grey) !important
-}}
+}
/* lists */
-.cm-s-material-darker .cm-variable-2 {{
+.cm-s-material-darker .cm-variable-2 {
color: var(--light-grey) !important
-}}
+}
/* internal links */
-.cm-s-material-darker .cm-string {{
+.cm-s-material-darker .cm-string {
color: var(--primary) !important
-}}
+}
/* headers */
-.cm-header-1, .cm-header-2, .cm-header-3, .cm-header-4 {{
+.cm-header-1, .cm-header-2, .cm-header-3, .cm-header-4 {
color: var(--dark-white) !important
-}}
+}
-.cm-variable-2, .cm-meta {{
+.cm-variable-2, .cm-meta {
color: var(--red-dark) !important;
/* changes the font colour for all lists (.cm-meta controls the checkbox square brackets [ ] ) */
-}}
-.cm-comment {{
+}
+.cm-comment {
color: var(--green-dark) !important;
/* changes the font colour for code text*/
-}}
-.cm-quote {{
+}
+.cm-quote {
color: var(--purple-dark) !important;
/* changes the font colour for quoted text*/
-}}
-.cm-image-marker {{
+}
+.cm-image-marker {
color: var(--red);
/* changes the font colour for the "!" before displayed image links */
font-weight: 900;
/* changes the font weight for the "!" before displayed image links */
-}}
-.cm-link, .cm-url {{
+}
+.cm-link, .cm-url {
/* .cm-link is everything in the square brackets | .cm-url is the url itself in the round brackets */
color: var(--green) !important;
/* changes the font colour for links */
text-decoration: none !important;
/* removes underlining for links */
-}}
-.cm-tag, .cm-attribute {{
+}
+.cm-tag, .cm-attribute {
/* HTML - .cm-tag is the HTML tag itself such as "<img>" | .cm-attribute is any HTML tag attributes such as "width" or "src" */
/* the below are NOT applied if the html text is marked as "code" unless it is in a fenced html code block (```HTML) */
color: var(--dark-purple) !important;
/* changes the font colour for HTML tags */
font-weight: 500;
/* changes the font weight for HTML tags */
-}}
-.cm-hr {{
+}
+.cm-hr {
color: var(--orange-dark) !important;
/* changes the font colour for horizontal rule markdown "***" */
font-weight: 900;
/* changes the font weight for horizontal rule markdown "***" */
-}}
+}
