mirror of
https://github.com/notion-enhancer/notion-enhancer.git
synced 2025-04-06 21:49:03 +00:00
more reliable menu tab focusing + shortcut/icon -> notion
This commit is contained in:
parent
9a0ffdd9bc
commit
8454f86024
@ -1,90 +1,86 @@
|
||||
/* PrismJS 1.23.0
|
||||
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+abap+abnf+actionscript+ada+agda+al+antlr4+apacheconf+apex+apl+applescript+aql+arduino+arff+asciidoc+aspnet+asm6502+autohotkey+autoit+bash+basic+batch+bbcode+birb+bison+bnf+brainfuck+brightscript+bro+bsl+c+csharp+cpp+cfscript+chaiscript+cil+clojure+cmake+cobol+coffeescript+concurnas+csp+coq+crystal+css-extras+csv+cypher+d+dart+dataweave+dax+dhall+diff+django+dns-zone-file+docker+dot+ebnf+editorconfig+eiffel+ejs+elixir+elm+etlua+erb+erlang+excel-formula+fsharp+factor+false+firestore-security-rules+flow+fortran+ftl+gml+gcode+gdscript+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+hcl+hlsl+http+hpkp+hsts+ichigojam+icon+icu-message-format+idris+ignore+inform7+ini+io+j+java+javadoc+javadoclike+javastacktrace+jexl+jolie+jq+jsdoc+js-extras+json+json5+jsonp+jsstacktrace+js-templates+julia+keyman+kotlin+kumir+latex+latte+less+lilypond+liquid+lisp+livescript+llvm+log+lolcode+lua+makefile+markdown+markup-templating+matlab+mel+mizar+mongodb+monkey+moonscript+n1ql+n4js+nand2tetris-hdl+naniscript+nasm+neon+nevod+nginx+nim+nix+nsis+objectivec+ocaml+opencl+openqasm+oz+parigp+parser+pascal+pascaligo+psl+pcaxis+peoplecode+perl+php+phpdoc+php-extras+plsql+powerquery+powershell+processing+prolog+promql+properties+protobuf+pug+puppet+pure+purebasic+purescript+python+qsharp+q+qml+qore+r+racket+jsx+tsx+reason+regex+rego+renpy+rest+rip+roboconf+robotframework+ruby+rust+sas+sass+scss+scala+scheme+shell-session+smali+smalltalk+smarty+sml+solidity+solution-file+soy+sparql+splunk-spl+sqf+sql+squirrel+stan+iecst+stylus+swift+t4-templating+t4-cs+t4-vb+tap+tcl+tt2+textile+toml+turtle+twig+typescript+typoscript+unrealscript+uri+v+vala+vbnet+velocity+verilog+vhdl+vim+visual-basic+warpscript+wasm+wiki+xeora+xml-doc+xojo+xquery+yaml+yang+zig&plugins=autolinker+show-language+inline-color+previewers+normalize-whitespace+data-uri-highlight+toolbar+copy-to-clipboard */
|
||||
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+abap+abnf+actionscript+ada+agda+al+antlr4+apacheconf+apex+apl+applescript+aql+arduino+arff+asciidoc+aspnet+asm6502+autohotkey+autoit+bash+basic+batch+bbcode+birb+bison+bnf+brainfuck+brightscript+bro+bsl+c+csharp+cpp+cfscript+chaiscript+cil+clojure+cmake+cobol+coffeescript+concurnas+csp+coq+crystal+css-extras+csv+cypher+d+dart+dataweave+dax+dhall+diff+django+dns-zone-file+docker+dot+ebnf+editorconfig+eiffel+ejs+elixir+elm+etlua+erb+erlang+excel-formula+fsharp+factor+false+firestore-security-rules+flow+fortran+ftl+gml+gcode+gdscript+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+hcl+hlsl+http+hpkp+hsts+ichigojam+icon+icu-message-format+idris+ignore+inform7+ini+io+j+java+javadoc+javadoclike+javastacktrace+jexl+jolie+jq+jsdoc+js-extras+json+json5+jsonp+jsstacktrace+js-templates+julia+keyman+kotlin+kumir+latex+latte+less+lilypond+liquid+lisp+livescript+llvm+log+lolcode+lua+makefile+markdown+markup-templating+matlab+mel+mizar+mongodb+monkey+moonscript+n1ql+n4js+nand2tetris-hdl+naniscript+nasm+neon+nevod+nginx+nim+nix+nsis+objectivec+ocaml+opencl+openqasm+oz+parigp+parser+pascal+pascaligo+psl+pcaxis+peoplecode+perl+php+phpdoc+php-extras+plsql+powerquery+powershell+processing+prolog+promql+properties+protobuf+pug+puppet+pure+purebasic+purescript+python+qsharp+q+qml+qore+r+racket+jsx+tsx+reason+regex+rego+renpy+rest+rip+roboconf+robotframework+ruby+rust+sas+sass+scss+scala+scheme+shell-session+smali+smalltalk+smarty+sml+solidity+solution-file+soy+sparql+splunk-spl+sqf+sql+squirrel+stan+iecst+stylus+swift+t4-templating+t4-cs+t4-vb+tap+tcl+tt2+textile+toml+turtle+twig+typescript+typoscript+unrealscript+uri+v+vala+vbnet+velocity+verilog+vhdl+vim+visual-basic+warpscript+wasm+wiki+xeora+xml-doc+xojo+xquery+yaml+yang+zig&plugins=autolinker+show-language+inline-color+normalize-whitespace+data-uri-highlight+toolbar+copy-to-clipboard+match-braces */
|
||||
/**
|
||||
* prism.js default theme for JavaScript, CSS and HTML
|
||||
* Based on dabblet (http://dabblet.com)
|
||||
* @author Lea Verou
|
||||
*/
|
||||
|
||||
code[class*='language-'],
|
||||
pre[class*='language-'] {
|
||||
color: black;
|
||||
background: none;
|
||||
text-shadow: 0 1px white;
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
font-size: 1em;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: black;
|
||||
background: none;
|
||||
text-shadow: 0 1px white;
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
font-size: 1em;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
pre[class*='language-']::-moz-selection,
|
||||
pre[class*='language-'] ::-moz-selection,
|
||||
code[class*='language-']::-moz-selection,
|
||||
code[class*='language-'] ::-moz-selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
|
||||
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
pre[class*='language-']::selection,
|
||||
pre[class*='language-'] ::selection,
|
||||
code[class*='language-']::selection,
|
||||
code[class*='language-'] ::selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
|
||||
code[class*="language-"]::selection, code[class*="language-"] ::selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
@media print {
|
||||
code[class*='language-'],
|
||||
pre[class*='language-'] {
|
||||
text-shadow: none;
|
||||
}
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*='language-'] {
|
||||
padding: 1em;
|
||||
margin: 0.5em 0;
|
||||
overflow: auto;
|
||||
pre[class*="language-"] {
|
||||
padding: 1em;
|
||||
margin: .5em 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:not(pre) > code[class*='language-'],
|
||||
pre[class*='language-'] {
|
||||
background: #f5f2f0;
|
||||
:not(pre) > code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #f5f2f0;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*='language-'] {
|
||||
padding: 0.1em;
|
||||
border-radius: 0.3em;
|
||||
white-space: normal;
|
||||
:not(pre) > code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: slategray;
|
||||
color: slategray;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #999;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.token.namespace {
|
||||
opacity: 0.7;
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
@ -94,7 +90,7 @@ pre[class*='language-'] {
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #905;
|
||||
color: #905;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
@ -103,7 +99,7 @@ pre[class*='language-'] {
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #690;
|
||||
color: #690;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
@ -111,96 +107,96 @@ pre[class*='language-'] {
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #9a6e3a;
|
||||
/* This background color was intended by the author of this theme. */
|
||||
background: hsla(0, 0%, 100%, 0.5);
|
||||
color: #9a6e3a;
|
||||
/* This background color was intended by the author of this theme. */
|
||||
background: hsla(0, 0%, 100%, .5);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword {
|
||||
color: #07a;
|
||||
color: #07a;
|
||||
}
|
||||
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #dd4a68;
|
||||
color: #DD4A68;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important,
|
||||
.token.variable {
|
||||
color: #e90;
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
font-weight: bold;
|
||||
}
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
.token a {
|
||||
color: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
div.code-toolbar {
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar {
|
||||
position: absolute;
|
||||
top: 0.3em;
|
||||
right: 0.2em;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
top: .3em;
|
||||
right: .2em;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
div.code-toolbar:hover > .toolbar {
|
||||
opacity: 1;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Separate line b/c rules are thrown out if selector is invalid.
|
||||
IE11 and old Edge versions don't support :focus-within. */
|
||||
IE11 and old Edge versions don't support :focus-within. */
|
||||
div.code-toolbar:focus-within > .toolbar {
|
||||
opacity: 1;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar .toolbar-item {
|
||||
display: inline-block;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar a {
|
||||
cursor: pointer;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar button {
|
||||
background: none;
|
||||
border: 0;
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
line-height: normal;
|
||||
overflow: visible;
|
||||
padding: 0;
|
||||
-webkit-user-select: none; /* for button */
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
line-height: normal;
|
||||
overflow: visible;
|
||||
padding: 0;
|
||||
-webkit-user-select: none; /* for button */
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar a,
|
||||
div.code-toolbar > .toolbar button,
|
||||
div.code-toolbar > .toolbar span {
|
||||
color: #bbb;
|
||||
font-size: 0.8em;
|
||||
padding: 0 0.5em;
|
||||
background: #f5f2f0;
|
||||
background: rgba(224, 224, 224, 0.2);
|
||||
box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.2);
|
||||
border-radius: 0.5em;
|
||||
color: #bbb;
|
||||
font-size: .8em;
|
||||
padding: 0 .5em;
|
||||
background: #f5f2f0;
|
||||
background: rgba(224, 224, 224, 0.2);
|
||||
box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
|
||||
border-radius: .5em;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar a:hover,
|
||||
@ -209,299 +205,71 @@ div.code-toolbar > .toolbar button:hover,
|
||||
div.code-toolbar > .toolbar button:focus,
|
||||
div.code-toolbar > .toolbar span:hover,
|
||||
div.code-toolbar > .toolbar span:focus {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
span.inline-color-wrapper {
|
||||
/*
|
||||
* The background image is the following SVG inline in base 64:
|
||||
*
|
||||
* <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2">
|
||||
* <path fill="gray" d="M0 0h2v2H0z"/>
|
||||
* <path fill="white" d="M0 0h1v1H0zM1 1h1v1H1z"/>
|
||||
* </svg>
|
||||
*
|
||||
* SVG-inlining explained:
|
||||
* https://stackoverflow.com/a/21626701/7595472
|
||||
*/
|
||||
background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyIDIiPjxwYXRoIGZpbGw9ImdyYXkiIGQ9Ik0wIDBoMnYySDB6Ii8+PHBhdGggZmlsbD0id2hpdGUiIGQ9Ik0wIDBoMXYxSDB6TTEgMWgxdjFIMXoiLz48L3N2Zz4=');
|
||||
/* This is to prevent visual glitches where one pixel from the repeating pattern could be seen. */
|
||||
background-position: center;
|
||||
background-size: 110%;
|
||||
/*
|
||||
* The background image is the following SVG inline in base 64:
|
||||
*
|
||||
* <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2">
|
||||
* <path fill="gray" d="M0 0h2v2H0z"/>
|
||||
* <path fill="white" d="M0 0h1v1H0zM1 1h1v1H1z"/>
|
||||
* </svg>
|
||||
*
|
||||
* SVG-inlining explained:
|
||||
* https://stackoverflow.com/a/21626701/7595472
|
||||
*/
|
||||
background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyIDIiPjxwYXRoIGZpbGw9ImdyYXkiIGQ9Ik0wIDBoMnYySDB6Ii8+PHBhdGggZmlsbD0id2hpdGUiIGQ9Ik0wIDBoMXYxSDB6TTEgMWgxdjFIMXoiLz48L3N2Zz4=");
|
||||
/* This is to prevent visual glitches where one pixel from the repeating pattern could be seen. */
|
||||
background-position: center;
|
||||
background-size: 110%;
|
||||
|
||||
display: inline-block;
|
||||
height: 1.333ch;
|
||||
width: 1.333ch;
|
||||
margin: 0 0.333ch;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid white;
|
||||
outline: 1px solid rgba(0, 0, 0, 0.5);
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
height: 1.333ch;
|
||||
width: 1.333ch;
|
||||
margin: 0 .333ch;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid white;
|
||||
outline: 1px solid rgba(0,0,0,.5);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
span.inline-color {
|
||||
display: block;
|
||||
/* To prevent visual glitches again */
|
||||
height: 120%;
|
||||
width: 120%;
|
||||
display: block;
|
||||
/* To prevent visual glitches again */
|
||||
height: 120%;
|
||||
width: 120%;
|
||||
}
|
||||
|
||||
.prism-previewer,
|
||||
.prism-previewer:before,
|
||||
.prism-previewer:after {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
.prism-previewer,
|
||||
.prism-previewer:after {
|
||||
left: 50%;
|
||||
}
|
||||
.prism-previewer {
|
||||
margin-top: -48px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
margin-left: -16px;
|
||||
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.25s;
|
||||
-o-transition: opacity 0.25s;
|
||||
transition: opacity 0.25s;
|
||||
}
|
||||
.prism-previewer.flipped {
|
||||
margin-top: 0;
|
||||
margin-bottom: -48px;
|
||||
}
|
||||
.prism-previewer:before,
|
||||
.prism-previewer:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
.prism-previewer:before {
|
||||
top: -5px;
|
||||
right: -5px;
|
||||
left: -5px;
|
||||
bottom: -5px;
|
||||
border-radius: 10px;
|
||||
border: 5px solid #fff;
|
||||
box-shadow: 0 0 3px rgba(0, 0, 0, 0.5) inset, 0 0 10px rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.prism-previewer:after {
|
||||
top: 100%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin: 5px 0 0 -7px;
|
||||
border: 7px solid transparent;
|
||||
border-color: rgba(255, 0, 0, 0);
|
||||
border-top-color: #fff;
|
||||
}
|
||||
.prism-previewer.flipped:after {
|
||||
top: auto;
|
||||
bottom: 100%;
|
||||
margin-top: 0;
|
||||
margin-bottom: 5px;
|
||||
border-top-color: rgba(255, 0, 0, 0);
|
||||
border-bottom-color: #fff;
|
||||
}
|
||||
.prism-previewer.active {
|
||||
opacity: 1;
|
||||
.token.punctuation.brace-hover,
|
||||
.token.punctuation.brace-selected {
|
||||
outline: solid 1px;
|
||||
}
|
||||
|
||||
.prism-previewer-angle:before {
|
||||
border-radius: 50%;
|
||||
background: #fff;
|
||||
.rainbow-braces .token.punctuation.brace-level-1,
|
||||
.rainbow-braces .token.punctuation.brace-level-5,
|
||||
.rainbow-braces .token.punctuation.brace-level-9 {
|
||||
color: #E50;
|
||||
opacity: 1;
|
||||
}
|
||||
.prism-previewer-angle:after {
|
||||
margin-top: 4px;
|
||||
.rainbow-braces .token.punctuation.brace-level-2,
|
||||
.rainbow-braces .token.punctuation.brace-level-6,
|
||||
.rainbow-braces .token.punctuation.brace-level-10 {
|
||||
color: #0B3;
|
||||
opacity: 1;
|
||||
}
|
||||
.prism-previewer-angle svg {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
-moz-transform: rotate(-90deg);
|
||||
-ms-transform: rotate(-90deg);
|
||||
-o-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
.rainbow-braces .token.punctuation.brace-level-3,
|
||||
.rainbow-braces .token.punctuation.brace-level-7,
|
||||
.rainbow-braces .token.punctuation.brace-level-11 {
|
||||
color: #26F;
|
||||
opacity: 1;
|
||||
}
|
||||
.prism-previewer-angle[data-negative] svg {
|
||||
-webkit-transform: scaleX(-1) rotate(-90deg);
|
||||
-moz-transform: scaleX(-1) rotate(-90deg);
|
||||
-ms-transform: scaleX(-1) rotate(-90deg);
|
||||
-o-transform: scaleX(-1) rotate(-90deg);
|
||||
transform: scaleX(-1) rotate(-90deg);
|
||||
}
|
||||
.prism-previewer-angle circle {
|
||||
fill: transparent;
|
||||
stroke: hsl(200, 10%, 20%);
|
||||
stroke-opacity: 0.9;
|
||||
stroke-width: 32;
|
||||
stroke-dasharray: 0, 500;
|
||||
.rainbow-braces .token.punctuation.brace-level-4,
|
||||
.rainbow-braces .token.punctuation.brace-level-8,
|
||||
.rainbow-braces .token.punctuation.brace-level-12 {
|
||||
color: #E0E;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.prism-previewer-gradient {
|
||||
background-image: linear-gradient(
|
||||
45deg,
|
||||
#bbb 25%,
|
||||
transparent 25%,
|
||||
transparent 75%,
|
||||
#bbb 75%,
|
||||
#bbb
|
||||
),
|
||||
linear-gradient(45deg, #bbb 25%, #eee 25%, #eee 75%, #bbb 75%, #bbb);
|
||||
background-size: 10px 10px;
|
||||
background-position: 0 0, 5px 5px;
|
||||
|
||||
width: 64px;
|
||||
margin-left: -32px;
|
||||
}
|
||||
.prism-previewer-gradient:before {
|
||||
content: none;
|
||||
}
|
||||
.prism-previewer-gradient div {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
left: -5px;
|
||||
right: -5px;
|
||||
bottom: -5px;
|
||||
border-radius: 10px;
|
||||
border: 5px solid #fff;
|
||||
box-shadow: 0 0 3px rgba(0, 0, 0, 0.5) inset, 0 0 10px rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
|
||||
.prism-previewer-color {
|
||||
background-image: linear-gradient(
|
||||
45deg,
|
||||
#bbb 25%,
|
||||
transparent 25%,
|
||||
transparent 75%,
|
||||
#bbb 75%,
|
||||
#bbb
|
||||
),
|
||||
linear-gradient(45deg, #bbb 25%, #eee 25%, #eee 75%, #bbb 75%, #bbb);
|
||||
background-size: 10px 10px;
|
||||
background-position: 0 0, 5px 5px;
|
||||
}
|
||||
.prism-previewer-color:before {
|
||||
background-color: inherit;
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
.prism-previewer-easing {
|
||||
margin-top: -76px;
|
||||
margin-left: -30px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
background: #333;
|
||||
}
|
||||
.prism-previewer-easing.flipped {
|
||||
margin-bottom: -116px;
|
||||
}
|
||||
.prism-previewer-easing svg {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
.prism-previewer-easing circle {
|
||||
fill: hsl(200, 10%, 20%);
|
||||
stroke: white;
|
||||
}
|
||||
.prism-previewer-easing path {
|
||||
fill: none;
|
||||
stroke: white;
|
||||
stroke-linecap: round;
|
||||
stroke-width: 4;
|
||||
}
|
||||
.prism-previewer-easing line {
|
||||
stroke: white;
|
||||
stroke-opacity: 0.5;
|
||||
stroke-width: 2;
|
||||
}
|
||||
|
||||
@-webkit-keyframes prism-previewer-time {
|
||||
0% {
|
||||
stroke-dasharray: 0, 500;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
50% {
|
||||
stroke-dasharray: 100, 500;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
100% {
|
||||
stroke-dasharray: 0, 500;
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
@-o-keyframes prism-previewer-time {
|
||||
0% {
|
||||
stroke-dasharray: 0, 500;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
50% {
|
||||
stroke-dasharray: 100, 500;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
100% {
|
||||
stroke-dasharray: 0, 500;
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-keyframes prism-previewer-time {
|
||||
0% {
|
||||
stroke-dasharray: 0, 500;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
50% {
|
||||
stroke-dasharray: 100, 500;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
100% {
|
||||
stroke-dasharray: 0, 500;
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes prism-previewer-time {
|
||||
0% {
|
||||
stroke-dasharray: 0, 500;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
50% {
|
||||
stroke-dasharray: 100, 500;
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
100% {
|
||||
stroke-dasharray: 0, 500;
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.prism-previewer-time:before {
|
||||
border-radius: 50%;
|
||||
background: #fff;
|
||||
}
|
||||
.prism-previewer-time:after {
|
||||
margin-top: 4px;
|
||||
}
|
||||
.prism-previewer-time svg {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
-moz-transform: rotate(-90deg);
|
||||
-ms-transform: rotate(-90deg);
|
||||
-o-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
.prism-previewer-time circle {
|
||||
fill: transparent;
|
||||
stroke: hsl(200, 10%, 20%);
|
||||
stroke-opacity: 0.9;
|
||||
stroke-width: 32;
|
||||
stroke-dasharray: 0, 500;
|
||||
stroke-dashoffset: 0;
|
||||
-webkit-animation: prism-previewer-time linear infinite 3s;
|
||||
-moz-animation: prism-previewer-time linear infinite 3s;
|
||||
-o-animation: prism-previewer-time linear infinite 3s;
|
||||
animation: prism-previewer-time linear infinite 3s;
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -11,7 +11,8 @@ export const ERROR = Symbol();
|
||||
export const env = {};
|
||||
env.name = 'browser';
|
||||
|
||||
env.openEnhancerMenu = () => chrome.runtime.sendMessage({ type: 'enhancerMenu.open' });
|
||||
env.openEnhancerMenu = () => chrome.runtime.sendMessage({ action: 'openEnhancerMenu' });
|
||||
env.focusNotion = () => chrome.runtime.sendMessage({ action: 'focusNotion' });
|
||||
|
||||
/** - */
|
||||
|
||||
@ -66,7 +67,7 @@ web.createElement = (html) => {
|
||||
};
|
||||
web.escapeHtml = (str) =>
|
||||
str
|
||||
.replace(/&(?![^\s]+;)/g, '&')
|
||||
.replace(/&/g, '&') // (?![^\s]+;)
|
||||
.replace(/</g, '<')
|
||||
.replace(/>/g, '>')
|
||||
.replace(/'/g, ''')
|
||||
|
||||
@ -27,6 +27,6 @@
|
||||
"js": ["launcher.js"]
|
||||
}
|
||||
],
|
||||
"permissions": ["storage"],
|
||||
"permissions": ["storage", "tabs"],
|
||||
"host_permissions": ["https://*.notion.so/*"]
|
||||
}
|
||||
|
||||
@ -42,6 +42,14 @@ can [see the source for it by adding '.text' to the URL](/projects/markdown/synt
|
||||
|
||||
---
|
||||
|
||||
```css
|
||||
:root {
|
||||
--theme_dark--db_today-text: #fff;
|
||||
--theme_dark--timeline_divider_thin: rgba(255, 255, 255, 0.07);
|
||||
--theme_dark--timeline_arrow: rgb(47, 52, 55);
|
||||
}
|
||||
```
|
||||
|
||||
## Overview
|
||||
|
||||
### Philosophy
|
||||
|
||||
@ -0,0 +1,64 @@
|
||||
/*
|
||||
* notion-enhancer core: menu
|
||||
* (c) 2021 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
|
||||
* (https://notion-enhancer.github.io/) under the MIT license
|
||||
*/
|
||||
|
||||
.markdown table {
|
||||
border-spacing: 0;
|
||||
border: 1px solid var(--theme--divider);
|
||||
}
|
||||
.markdown table th {
|
||||
text-align: left;
|
||||
}
|
||||
.markdown table th,
|
||||
.markdown table td {
|
||||
padding: 5px 8px 6px;
|
||||
border: 1px solid var(--theme--divider);
|
||||
}
|
||||
.markdown h1 {
|
||||
font-size: var(--theme--font_heading1-size);
|
||||
margin: 1rem 0 0.5rem 0;
|
||||
}
|
||||
.markdown h2 {
|
||||
font-size: var(--theme--font_heading2-size);
|
||||
margin: 1rem 0 0.5rem 0;
|
||||
}
|
||||
.markdown h3 {
|
||||
font-size: var(--theme--font_heading3-size);
|
||||
margin: 1rem 0 0.5rem 0;
|
||||
}
|
||||
.markdown ul,
|
||||
.markdown ol {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
.markdown li {
|
||||
margin: 0.4rem 0;
|
||||
}
|
||||
.markdown ol li {
|
||||
padding-left: 0.25rem;
|
||||
}
|
||||
.markdown blockquote {
|
||||
border-left: 2px solid currentColor;
|
||||
padding-left: 0.75rem;
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
.markdown hr {
|
||||
border: 0.5px solid var(--theme--divider);
|
||||
}
|
||||
.markdown :not(pre) > code {
|
||||
background: var(--theme--code_inline);
|
||||
color: var(--theme--code_inline-text);
|
||||
padding: 0.2em 0.4em;
|
||||
border-radius: 3px;
|
||||
font-family: var(--theme--font_code) !important;
|
||||
font-size: var(--theme_dark--font_code-size) !important;
|
||||
}
|
||||
.markdown a {
|
||||
opacity: 0.7;
|
||||
text-decoration: none;
|
||||
border-bottom: 0.05em solid currentColor;
|
||||
}
|
||||
.markdown a:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
@ -15,6 +15,7 @@
|
||||
|
||||
html {
|
||||
transition: opacity 50ms ease-out;
|
||||
font-size: var(--theme--font_body-size);
|
||||
}
|
||||
html[class] {
|
||||
opacity: 1 !important;
|
||||
@ -32,7 +33,7 @@ header {
|
||||
}
|
||||
header > * {
|
||||
margin: 0 1.25rem 0 0;
|
||||
font-size: 1.25rem;
|
||||
font-size: var(--theme--font_heading1-size);
|
||||
}
|
||||
header img {
|
||||
height: 100%;
|
||||
@ -42,6 +43,10 @@ header h1 a:not([data-active]) {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
img[data-target='notion'] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
[data-container] {
|
||||
display: grid;
|
||||
grid-gap: 1.25em;
|
||||
@ -108,10 +113,6 @@ header h1 a:not([data-active]) {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
[data-container='mod'] .library--card,
|
||||
.documentation--body {
|
||||
overflow-x: auto;
|
||||
}
|
||||
.documentation--buttons,
|
||||
.library--expand {
|
||||
margin: 0;
|
||||
@ -152,14 +153,14 @@ header h1 a:not([data-active]) {
|
||||
}
|
||||
.library--version {
|
||||
font-weight: normal;
|
||||
font-size: 0.8rem;
|
||||
font-size: var(--theme--font_ui-size);
|
||||
border-radius: 5px;
|
||||
padding: 0.125rem 0.25rem;
|
||||
background: var(--theme--tag_default);
|
||||
color: var(--theme--tag_default-text);
|
||||
}
|
||||
.library--description {
|
||||
font-size: 0.8rem;
|
||||
font-size: 1rem;
|
||||
margin: 0.25rem 0;
|
||||
}
|
||||
.library--tags,
|
||||
@ -171,14 +172,16 @@ header h1 a:not([data-active]) {
|
||||
margin: 0.5em 0;
|
||||
}
|
||||
.library--tags li {
|
||||
font-size: var(--theme--font_ui-size);
|
||||
margin: 0 0.5rem 0 0;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.library--authors li {
|
||||
font-size: var(--theme--font_ui-size);
|
||||
margin: 0 0.5rem 0 0;
|
||||
}
|
||||
.library--authors a {
|
||||
font-size: 0.8rem;
|
||||
font-size: var(--theme--font_ui-size);
|
||||
text-decoration: none;
|
||||
border-radius: 5px;
|
||||
padding: 0.125rem 0.25rem 0.25rem 0;
|
||||
@ -204,7 +207,7 @@ header h1 a:not([data-active]) {
|
||||
margin: 0.6rem 0;
|
||||
display: block;
|
||||
appearance: none;
|
||||
font-size: 0.8rem;
|
||||
font-size: var(--theme--font_ui-size);
|
||||
}
|
||||
.library--toggle_label *,
|
||||
.library--select_label *,
|
||||
@ -212,7 +215,11 @@ header h1 a:not([data-active]) {
|
||||
.library--number_label *,
|
||||
.library--file_label * {
|
||||
appearance: none;
|
||||
font-size: 0.8rem;
|
||||
font-size: var(--theme--font_ui-size);
|
||||
}
|
||||
label > p:not([class]),
|
||||
label > span:not([class]) {
|
||||
font-size: 1rem;
|
||||
}
|
||||
.library--toggle_label > p,
|
||||
.library--toggle_label > p,
|
||||
@ -226,7 +233,7 @@ header h1 a:not([data-active]) {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
--toggle--buttonsground: var(--theme--toggle_off);
|
||||
--toggle--bg: var(--theme--toggle_off);
|
||||
--toggle--translation: 0%;
|
||||
}
|
||||
.library--toggle_label > :not(input) .library--toggle {
|
||||
@ -236,7 +243,7 @@ header h1 a:not([data-active]) {
|
||||
height: 1.25rem;
|
||||
display: block;
|
||||
border-radius: 40px;
|
||||
background: var(--toggle--buttonsground);
|
||||
background: var(--toggle--bg);
|
||||
}
|
||||
.library--toggle_label > :not(input) .library--toggle::after {
|
||||
content: '';
|
||||
@ -251,7 +258,7 @@ header h1 a:not([data-active]) {
|
||||
transform: translateX(var(--toggle--translation));
|
||||
}
|
||||
.library--toggle_label input[type='checkbox']:checked + :not(input) {
|
||||
--toggle--buttonsground: var(--theme--toggle_on);
|
||||
--toggle--bg: var(--theme--toggle_on);
|
||||
--toggle--translation: 100%;
|
||||
}
|
||||
.library--toggle_label:focus-within .library--toggle,
|
||||
@ -329,56 +336,20 @@ header h1 a:not([data-active]) {
|
||||
margin: 0;
|
||||
}
|
||||
.library--title h2 > span {
|
||||
font-size: 1.25rem;
|
||||
font-size: var(--theme_light--font_heading2-size);
|
||||
padding-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.library--card {
|
||||
.library--card > div {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
[data-container='mod'] .library--card {
|
||||
overflow-x: auto;
|
||||
}
|
||||
.documentation--body {
|
||||
padding: 1rem 2rem;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
.documentation--body table {
|
||||
border-spacing: 0;
|
||||
border: 1px solid var(--theme--sidebar);
|
||||
}
|
||||
.documentation--body table th {
|
||||
text-align: left;
|
||||
}
|
||||
.documentation--body table th,
|
||||
.documentation--body table td {
|
||||
padding: 5px 8px 6px;
|
||||
border: 1px solid var(--theme--sidebar);
|
||||
}
|
||||
.documentation--body h1 {
|
||||
font-size: var(--theme--font_heading1-size);
|
||||
margin: 1rem 0 0.5rem 0;
|
||||
}
|
||||
.documentation--body h2 {
|
||||
font-size: var(--theme--font_heading2-size);
|
||||
margin: 1rem 0 0.5rem 0;
|
||||
}
|
||||
.documentation--body h3 {
|
||||
font-size: var(--theme--font_heading3-size);
|
||||
margin: 1rem 0 0.5rem 0;
|
||||
}
|
||||
.documentation--body ul,
|
||||
.documentation--body ol {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
.documentation--body li {
|
||||
margin: 0.4rem 0;
|
||||
}
|
||||
.documentation--body ol li {
|
||||
padding-left: 0.25rem;
|
||||
}
|
||||
.documentation--body blockquote {
|
||||
border-left: 2px solid currentColor;
|
||||
padding-left: 0.5rem;
|
||||
margin: 0.5rem 0 0.5rem 0;
|
||||
font-size: 1rem;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<p><img alt="" width="24" src="../../icons/colour.svg" /></p>
|
||||
<p><img data-target="notion" alt="" width="24" src="../../icons/colour.svg" /></p>
|
||||
<h1><a href="?view=library" data-target="library">library</a></h1>
|
||||
<h1><a href="?view=alerts" data-target="alerts">alerts</a></h1>
|
||||
<h1><a href="https://github.com/notion-enhancer/extension">github</a></h1>
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
'use strict';
|
||||
|
||||
const _id = 'a6621988-551d-495a-97d8-3c568bca2e9e';
|
||||
import { storage, web, fmt, fs, registry } from '../../helpers.js';
|
||||
import { env, storage, web, fmt, fs, registry } from '../../helpers.js';
|
||||
|
||||
for (let mod of await registry.get()) {
|
||||
for (let sheet of mod.css?.menu || []) {
|
||||
@ -15,6 +15,9 @@ for (let mod of await registry.get()) {
|
||||
}
|
||||
}
|
||||
|
||||
document.querySelector('img[data-target="notion"]').addEventListener('click', env.focusNotion);
|
||||
web.hotkeyListener(['Ctrl', 'Alt', 'E'], env.focusNotion);
|
||||
|
||||
const components = {};
|
||||
components.card = {
|
||||
preview: ({ preview = '' }) =>
|
||||
@ -43,7 +46,9 @@ components.card = {
|
||||
</ul>`),
|
||||
description: ({ description }) =>
|
||||
web.createElement(
|
||||
web.html`<p class="library--description">${fmt.md.renderInline(description)}</p>`
|
||||
web.html`<p class="library--description markdown">${fmt.md.renderInline(
|
||||
description
|
||||
)}</p>`
|
||||
),
|
||||
authors: ({ authors }) =>
|
||||
web.createElement(web.html`<ul class="library--authors">
|
||||
@ -184,7 +189,7 @@ components.documentation = {
|
||||
</a>
|
||||
</p>`),
|
||||
readme: async (mod) => {
|
||||
const readme = web.createElement(web.html`<article class="documentation--body">
|
||||
const readme = web.createElement(web.html`<article class="documentation--body markdown">
|
||||
${
|
||||
(await fs.isFile(`repo/${mod._dir}/README.md`))
|
||||
? fmt.md.render(await fs.getText(`repo/${mod._dir}/README.md`))
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
],
|
||||
"css": {
|
||||
"client": ["client.css"],
|
||||
"menu": ["menu.css"]
|
||||
"menu": ["menu.css", "markdown.css"]
|
||||
},
|
||||
"js": {
|
||||
"client": ["client.js"]
|
||||
|
||||
@ -9,8 +9,6 @@
|
||||
* (https://notion-enhancer.github.io/) under the MIT license
|
||||
*/
|
||||
|
||||
@import url('./variables.css');
|
||||
|
||||
/** layout ui **/
|
||||
|
||||
.notion-frame .notion-scroller [style*='env(safe-area-inset-'][style*=' width: 900px'],
|
||||
|
||||
@ -13,7 +13,8 @@
|
||||
}
|
||||
],
|
||||
"css": {
|
||||
"client": ["client.css"],
|
||||
"frame": ["variables.css"],
|
||||
"client": ["variables.css", "client.css"],
|
||||
"menu": ["variables.css"]
|
||||
}
|
||||
}
|
||||
|
||||
@ -6,50 +6,37 @@
|
||||
|
||||
'use strict';
|
||||
|
||||
const enhancerMenu = {
|
||||
_tab: {},
|
||||
highlight() {
|
||||
return new Promise((res, rej) =>
|
||||
chrome.tabs.get(this._tab.id, async (tab) => {
|
||||
if (chrome.runtime.lastError) {
|
||||
chrome.tabs.highlight({ 'tabs': (await this.create()).index });
|
||||
} else {
|
||||
chrome.tabs.highlight({ 'tabs': tab.index });
|
||||
}
|
||||
res(this._tab);
|
||||
})
|
||||
);
|
||||
},
|
||||
create() {
|
||||
return new Promise((res, rej) =>
|
||||
chrome.tabs.create(
|
||||
{
|
||||
url: chrome.runtime.getURL(
|
||||
'repo/menu@a6621988-551d-495a-97d8-3c568bca2e9e/menu.html'
|
||||
),
|
||||
},
|
||||
(tab) => {
|
||||
this._tab = tab;
|
||||
res(this._tab);
|
||||
}
|
||||
)
|
||||
);
|
||||
},
|
||||
async open() {
|
||||
try {
|
||||
await this.highlight();
|
||||
} catch {
|
||||
await this.create();
|
||||
function openEnhancerMenu() {
|
||||
chrome.tabs.query({ windowId: chrome.windows.WINDOW_ID_CURRENT }, (tabs) => {
|
||||
const enhancerMenuURL = chrome.runtime.getURL(
|
||||
'repo/menu@a6621988-551d-495a-97d8-3c568bca2e9e/menu.html'
|
||||
),
|
||||
enhancerMenuTab = tabs.find((tab) => tab.url.startsWith(enhancerMenuURL));
|
||||
if (enhancerMenuTab) {
|
||||
chrome.tabs.highlight({ 'tabs': enhancerMenuTab.index });
|
||||
} else chrome.tabs.create({ url: enhancerMenuURL });
|
||||
});
|
||||
}
|
||||
chrome.action.onClicked.addListener(openEnhancerMenu);
|
||||
|
||||
function focusNotion() {
|
||||
chrome.tabs.query(
|
||||
{ url: 'https://*.notion.so/*', windowId: chrome.windows.WINDOW_ID_CURRENT },
|
||||
(tabs) => {
|
||||
if (tabs.length) {
|
||||
chrome.tabs.highlight({ 'tabs': tabs[0].index });
|
||||
} else chrome.tabs.create({ url: 'https://notion.so/' });
|
||||
}
|
||||
return this._tab;
|
||||
},
|
||||
};
|
||||
chrome.action.onClicked.addListener(() => enhancerMenu.open());
|
||||
);
|
||||
}
|
||||
|
||||
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
|
||||
switch (request.type) {
|
||||
case 'enhancerMenu.open':
|
||||
enhancerMenu.open();
|
||||
switch (request.action) {
|
||||
case 'openEnhancerMenu':
|
||||
openEnhancerMenu();
|
||||
break;
|
||||
case 'focusNotion':
|
||||
focusNotion();
|
||||
break;
|
||||
}
|
||||
return true;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user