This is an automated email from the ASF dual-hosted git repository.
vpyatkov pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/ignite-website.git
The following commit(s) were added to refs/heads/master by this push:
new 214f0129a1 Added horizontal scroll for railroad diagrams (#145)
214f0129a1 is described below
commit 214f0129a1a785682a24bb675429d28ce1fcc430
Author: Alexey Alexandrov <[email protected]>
AuthorDate: Wed Nov 23 11:42:48 2022 +0200
Added horizontal scroll for railroad diagrams (#145)
Co-authored-by: Alexey Alexandrov <[email protected]>
---
_docs/_sass/railroad-diagram.scss | 1 +
assets/css/docs.css.map | 2 +-
assets/css/styles.css | 2 ++
assets/css/styles.css.map | 30 +++++++++++++++---------------
4 files changed, 19 insertions(+), 16 deletions(-)
diff --git a/_docs/_sass/railroad-diagram.scss
b/_docs/_sass/railroad-diagram.scss
index 245a81778d..04526f0c00 100644
--- a/_docs/_sass/railroad-diagram.scss
+++ b/_docs/_sass/railroad-diagram.scss
@@ -1,4 +1,5 @@
.diagram-container {
+ overflow-y: auto;
svg {
background-color: hsl(0, 0%, 100%);
diff --git a/assets/css/docs.css.map b/assets/css/docs.css.map
index 8ff24b9680..22bfe17934 100644
--- a/assets/css/docs.css.map
+++ b/assets/css/docs.css.map
@@ -5,7 +5,7 @@
"docs.scss"
],
"sourcesContent": [
- "// Docs-specific global styles\r\nbody {\r\n}\r\n"
+ "// Docs-specific global styles\nbody {\n}\n"
],
"names": [],
"mappings": ""
diff --git a/assets/css/styles.css b/assets/css/styles.css
index f51d64bd20..2892772e51 100644
--- a/assets/css/styles.css
+++ b/assets/css/styles.css
@@ -357,6 +357,8 @@ body > footer { border-top: 2px solid #dddddd; height:
var(--footer-height); fon
@media (max-width: 570px) { body > footer .copyright__extra { display: none; }
}
+.diagram-container { overflow-y: auto; }
+
.diagram-container svg { background-color: white; }
.diagram-container path { stroke-width: 2; stroke: black; fill: rgba(0, 0, 0,
0); }
diff --git a/assets/css/styles.css.map b/assets/css/styles.css.map
index d63ad75fa2..e28a1835b3 100644
--- a/assets/css/styles.css.map
+++ b/assets/css/styles.css.map
@@ -18,21 +18,21 @@
"_sass/asciidoc-pygments.scss"
],
"sourcesContent": [
- "@import \"variables\";\r\n@import \"header\";\r\n@import
\"code\";\r\n@import \"rouge-base16-solarized\";\r\n@import
\"text\";\r\n@import \"callouts\";\r\n@import \"layout\";\r\n@import
\"left-nav\";\r\n@import \"right-nav\";\r\n@import \"footer\";\r\n@import
\"railroad-diagram\";\r\n\r\n@import \"docs\";\r\n\r\n@import
\"asciidoc-pygments\";",
- ":root {\r\n --gg-red: #ec1c24;\r\n --gg-orange:
#ec1c24;\r\n --gg-orange-dark: #bc440b;\r\n --gg-orange-filter:
invert(47%) sepia(61%) saturate(1950%) hue-rotate(345deg) brightness(100%)
contrast(95%);\r\n --gg-dark-gray: #333333;\r\n --orange-line-thickness:
3px;\r\n --block-code-background: rgba(241, 241, 241, 20%);\r\n
--inline-code-background: rgba(241, 241, 241, 90%);\r\n --padding-top: 25px;
\r\n --link-color: #ec1c24;\r\n --body-background: #fcf [...]
- "header {\r\n\r\n min-height: var(--header-height);\r\n
background: white;\r\n box-shadow: 0 4px 10px 0 #eeeeee, 0 0 4px 0
#d5d5d5;\r\n \r\n\r\n z-index: 1;\r\n\r\n #promotion-bar {\r\n
background-color: #333333;\r\n padding: 8px;\r\n \r\n p
{\r\n font-size: 14px;\r\n line-height: 1.4em;\r\n
font-weight: 600;\r\n padding: 0;\r\n margin:
0;\r\n\r\n color: #f0f0f0;\r\n [...]
- "pre, pre.rouge {\r\n padding: 8px 15px;\r\n background:
var(--block-code-background) !important;\r\n border-radius: 5px;\r\n
border: 1px solid #e5e5e5;\r\n overflow-x: auto;\r\n // So code copy
button doesn't overflow\r\n min-height: 36px;\r\n\tline-height: 18px;\r\n
color: #545454;\r\n}\r\n\r\ncode {\r\n color: #545454;\r\n}\r\n\r\npre.rouge
code {\r\n background: none !important;\r\n}\r\n\r\npre.rouge .tok-err {\r\n
\tborder: none !important;\r\n }\r\ [...]
- ".highlight table td { padding: 5px; }\r\n.highlight table pre
{ margin: 0; }\r\n.highlight, .highlight .w {\r\n color:
#586e75;\r\n}\r\n.highlight .err {\r\n color: #002b36;\r\n background-color:
#dc322f;\r\n}\r\n.highlight .c, .highlight .cd, .highlight .cm, .highlight .c1,
.highlight .cs {\r\n color: #657b83;\r\n}\r\n.highlight .cp {\r\n color:
#b58900;\r\n}\r\n.highlight .nt {\r\n color: #b58900;\r\n}\r\n.highlight .o,
.highlight .ow {\r\n color: #93a1a1;\r\n}\r\n.highlight [...]
- "body {\r\n font-family: 'Open Sans',
sans-serif;\r\n}\r\n\r\nh1, h2, h3, h4 {\r\n color: #000;\r\n
font-weight: normal;\r\n font-family: 'Open Sans';\r\n}\r\n\r\nh1 {\r\n
font-size: 36px;\r\n line-height: 40px;\r\n}\r\n\r\na {\r\n
text-decoration: none;\r\n color: var(--link-color);\r\n}\r\n\r\n\r\nsection
{\r\n color: #545454;\r\n}\r\n\r\ntable {\r\n border-collapse:
collapse;\r\n\r\n td, th {\r\n text-align: left;\r\n padding:
5px 10px; [...]
- ".admonitionblock {\r\n border-left: 6px solid
var(--callout-border);\r\n background: var(--callout-background);\r\n
color: var(--callout-text);\r\n margin-left: 0;\r\n \r\n position:
relative;\r\n display: flex;\r\n margin-bottom: 16px;\r\n\t\r\n\ttable
{\r\n margin: 0 !important;\r\n width: 100%;\r\n\r\n td
{\r\n width: 100%;\r\n }\r\n\t}\r\n\r\n &+aside {\r\n
margin-top: 1em;\r\n }\r\n\r\n .icon {\r\n [...]
- "body {\r\n --header-height: 64px;\r\n
--promotion-bar-height: 35px;\r\n --footer-height: 104px;\r\n
--footer-gap: 60px;\r\n\r\n // @media (min-width: 451px) and (max-width:
850px) {\r\n // --header-height: 111px; \r\n // }\r\n\r\n
padding: 0;\r\n margin: 0;\r\n display: flex;\r\n flex-direction:
column;\r\n min-height: 100vh;\r\n background-color:
var(--body-background);\r\n font-family: 'Open Sans',sans-serif;\r\n\r\n
&>section [...]
- ".left-nav {\r\n padding: 10px 20px;\r\n width:
289px;\r\n overflow-y: auto;\r\n top: calc(var(--header-height) +
var(--promotion-bar-height));\r\n height: calc(100vh - var(--header-height)
- var(--promotion-bar-height));\r\n font-family: 'Open Sans';\r\n
padding-top: var(--padding-top);\r\n background-color:
var(--body-background);\r\n\r\n li {\r\n list-style: none;\r\n }
\r\n a, button {\r\n text-decoration: none;\r\n color: #7
[...]
- ".right-nav {\r\n width: 289px;\r\n padding: 12px
26px;\r\n overflow-y: auto;\r\n height: calc(100vh -
var(--header-height));\r\n top: var(--header-height);\r\n position:
-webkit-sticky;\r\n position: sticky;\r\n display: flex;\r\n
flex-direction: column;\r\n font-family: 'Open sans';\r\n padding-top:
var(--padding-top);\r\n background-color: #ffffff;\r\n \r\n h6 {\r\n
margin: 12px 0;\r\n font-size: 16px;\r\n font-weight: n [...]
- "body > footer {\r\n border-top: 2px solid #dddddd;\r\n
height: var(--footer-height);\r\n font-size: 16px;\r\n color:
#393939;\r\n display: flex;\r\n justify-content: space-between;\r\n
align-items: center;\r\n\r\n\r\n @media (max-width: 570px) {\r\n
.copyright__extra {\r\n display: none;\r\n }\r\n
}\r\n}\r\n// .right-nav footer {\r\n// font-size: 12px;\r\n// padding:
calc(var(--footer-gap) * 0.3) 0 5px;;\r\n// text-align: [...]
- ".diagram-container {\r\n\r\n svg {\r\n background-color:
hsl(0, 0%, 100%);\r\n }\r\n\r\n path {\r\n stroke-width: 2;\r\n stroke:
black;\r\n fill: rgba(0, 0, 0, 0);\r\n }\r\n\r\n text {\r\n font: bold
14px monospace;\r\n text-anchor: middle;\r\n white-space: pre;\r\n\r\n
&.diagram-text {\r\n font-size: 12px;\r\n }\r\n\r\n &.diagram-arrow
{\r\n font-size: 16px;\r\n }\r\n\r\n &.label {\r\n text-anchor:
start;\r\n }\r\n\r\n &.c [...]
- "section.page-docs {\r\n display: grid;\r\n transition:
grid-template-columns 0.15s;\r\n grid-template-columns: auto 1fr auto;\r\n
grid-template-rows: 100%;\r\n grid-template-areas: 'left-nav content
right-nav';\r\n line-height: 20px;\r\n max-width: 1440px;\r\n margin:
auto;\r\n width: 100%;\r\n\r\n &>article {\r\n // box-shadow: -1px
13px 20px 0 #696c70;\r\n border-left: 1px solid #eeeeee;\r\n
background-color: #ffffff;\r\n pad [...]
- "pre.pygments .hll { background-color: #ffffcc
}\r\npre.pygments, pre.pygments code { background: #ffffff; }\r\npre.pygments
.tok-c { color: #008000 } /* Comment */\r\npre.pygments .tok-err { border: 1px
solid #FF0000 } /* Error */\r\npre.pygments .tok-k { color: #0000ff } /*
Keyword */\r\npre.pygments .tok-ch { color: #008000 } /* Comment.Hashbang
*/\r\npre.pygments .tok-cm { color: #008000 } /* Comment.Multiline
*/\r\npre.pygments .tok-cp { color: #0000ff } /* Comment.Preproc */\r\np [...]
+ "@import \"variables\";\n@import \"header\";\n@import
\"code\";\n@import \"rouge-base16-solarized\";\n@import \"text\";\n@import
\"callouts\";\n@import \"layout\";\n@import \"left-nav\";\n@import
\"right-nav\";\n@import \"footer\";\n@import \"railroad-diagram\";\n\n@import
\"docs\";\n\n@import \"asciidoc-pygments\";",
+ ":root {\n --gg-red: #ec1c24;\n --gg-orange: #ec1c24;\n
--gg-orange-dark: #bc440b;\n --gg-orange-filter: invert(47%) sepia(61%)
saturate(1950%) hue-rotate(345deg) brightness(100%) contrast(95%);\n
--gg-dark-gray: #333333;\n --orange-line-thickness: 3px;\n
--block-code-background: rgba(241, 241, 241, 20%);\n
--inline-code-background: rgba(241, 241, 241, 90%);\n --padding-top: 25px;
\n --link-color: #ec1c24;\n --body-background: #fcfcfc;\n}\n\n@font-face
[...]
+ "header {\n\n min-height: var(--header-height);\n
background: white;\n box-shadow: 0 4px 10px 0 #eeeeee, 0 0 4px 0 #d5d5d5;\n
\n\n z-index: 1;\n\n #promotion-bar {\n background-color:
#333333;\n padding: 8px;\n \n p {\n font-size:
14px;\n line-height: 1.4em;\n font-weight: 600;\n
padding: 0;\n margin: 0;\n\n color: #f0f0f0;\n
text-align: center;\n\n a {\ [...]
+ "pre, pre.rouge {\n padding: 8px 15px;\n background:
var(--block-code-background) !important;\n border-radius: 5px;\n border:
1px solid #e5e5e5;\n overflow-x: auto;\n // So code copy button doesn't
overflow\n min-height: 36px;\n\tline-height: 18px;\n color:
#545454;\n}\n\ncode {\n color: #545454;\n}\n\npre.rouge code {\n
background: none !important;\n}\n\npre.rouge .tok-err {\n \tborder: none
!important;\n }\n\ncode-tabs.code-tabs__initialized {\n dis [...]
+ ".highlight table td { padding: 5px; }\n.highlight table pre {
margin: 0; }\n.highlight, .highlight .w {\n color: #586e75;\n}\n.highlight
.err {\n color: #002b36;\n background-color: #dc322f;\n}\n.highlight .c,
.highlight .cd, .highlight .cm, .highlight .c1, .highlight .cs {\n color:
#657b83;\n}\n.highlight .cp {\n color: #b58900;\n}\n.highlight .nt {\n color:
#b58900;\n}\n.highlight .o, .highlight .ow {\n color: #93a1a1;\n}\n.highlight
.p, .highlight .pi {\n color: #93a1a1;\n} [...]
+ "body {\n font-family: 'Open Sans', sans-serif;\n}\n\nh1,
h2, h3, h4 {\n color: #000;\n font-weight: normal;\n font-family:
'Open Sans';\n}\n\nh1 {\n font-size: 36px;\n line-height: 40px;\n}\n\na
{\n text-decoration: none;\n color: var(--link-color);\n}\n\n\nsection
{\n color: #545454;\n}\n\ntable {\n border-collapse: collapse;\n\n td,
th {\n text-align: left;\n padding: 5px 10px;\n
border-bottom: 1px solid hsl(0, 0%, 85%);\n [...]
+ ".admonitionblock {\n border-left: 6px solid
var(--callout-border);\n background: var(--callout-background);\n color:
var(--callout-text);\n margin-left: 0;\n \n position: relative;\n
display: flex;\n margin-bottom: 16px;\n\t\n\ttable {\n margin: 0
!important;\n width: 100%;\n\n td {\n width: 100%;\n
}\n\t}\n\n &+aside {\n margin-top: 1em;\n }\n\n .icon {\n
background-image: var(--callout-icon);\n [...]
+ "body {\n --header-height: 64px;\n
--promotion-bar-height: 35px;\n --footer-height: 104px;\n --footer-gap:
60px;\n\n // @media (min-width: 451px) and (max-width: 850px) {\n //
--header-height: 111px; \n // }\n\n padding: 0;\n margin: 0;\n
display: flex;\n flex-direction: column;\n min-height: 100vh;\n
background-color: var(--body-background);\n font-family: 'Open
Sans',sans-serif;\n\n &>section {\n flex: 1;\n }\n}\nheade [...]
+ ".left-nav {\n padding: 10px 20px;\n width: 289px;\n
overflow-y: auto;\n top: calc(var(--header-height) +
var(--promotion-bar-height));\n height: calc(100vh - var(--header-height) -
var(--promotion-bar-height));\n font-family: 'Open Sans';\n padding-top:
var(--padding-top);\n background-color: var(--body-background);\n\n li
{\n list-style: none;\n } \n a, button {\n
text-decoration: none;\n color: #757575;\n font-size: 16p [...]
+ ".right-nav {\n width: 289px;\n padding: 12px 26px;\n
overflow-y: auto;\n height: calc(100vh - var(--header-height));\n top:
var(--header-height);\n position: -webkit-sticky;\n position: sticky;\n
display: flex;\n flex-direction: column;\n font-family: 'Open sans';\n
padding-top: var(--padding-top);\n background-color: #ffffff;\n \n h6
{\n margin: 12px 0;\n font-size: 16px;\n font-weight:
normal;\n }\n\n ul {\n [...]
+ "body > footer {\n border-top: 2px solid #dddddd;\n
height: var(--footer-height);\n font-size: 16px;\n color: #393939;\n
display: flex;\n justify-content: space-between;\n align-items:
center;\n\n\n @media (max-width: 570px) {\n .copyright__extra {\n
display: none;\n }\n }\n}\n// .right-nav footer {\n//
font-size: 12px;\n// padding: calc(var(--footer-gap) * 0.3) 0 5px;;\n//
text-align: left;\n// margin: auto 0 0;\n\n// [...]
+ ".diagram-container {\n overflow-y: auto;\n\n svg {\n
background-color: hsl(0, 0%, 100%);\n }\n\n path {\n stroke-width: 2;\n
stroke: black;\n fill: rgba(0, 0, 0, 0);\n }\n\n text {\n font: bold
14px monospace;\n text-anchor: middle;\n white-space: pre;\n\n
&.diagram-text {\n font-size: 12px;\n }\n\n &.diagram-arrow {\n
font-size: 16px;\n }\n\n &.label {\n text-anchor: start;\n }\n\n
&.comment {\n font: italic 12px mon [...]
+ "section.page-docs {\n display: grid;\n transition:
grid-template-columns 0.15s;\n grid-template-columns: auto 1fr auto;\n
grid-template-rows: 100%;\n grid-template-areas: 'left-nav content
right-nav';\n line-height: 20px;\n max-width: 1440px;\n margin:
auto;\n width: 100%;\n\n &>article {\n // box-shadow: -1px 13px
20px 0 #696c70;\n border-left: 1px solid #eeeeee;\n
background-color: #ffffff;\n padding: 0 50px 30px;\n gr [...]
+ "pre.pygments .hll { background-color: #ffffcc }\npre.pygments,
pre.pygments code { background: #ffffff; }\npre.pygments .tok-c { color:
#008000 } /* Comment */\npre.pygments .tok-err { border: 1px solid #FF0000 } /*
Error */\npre.pygments .tok-k { color: #0000ff } /* Keyword */\npre.pygments
.tok-ch { color: #008000 } /* Comment.Hashbang */\npre.pygments .tok-cm {
color: #008000 } /* Comment.Multiline */\npre.pygments .tok-cp { color: #0000ff
} /* Comment.Preproc */\npre.pygments .tok [...]
],
"names": [],
- "mappings":
"CCAC,AAAD,IAAK,CAAC,EACF,QAAQ,CAAA,QAAC,EACT,WAAW,CAAA,QAAC,EACZ,gBAAgB,CAAA,QAAC,EACjB,kBAAkB,CAAA,yFAAC,EACnB,cAAc,CAAA,QAAC,EACf,uBAAuB,CAAA,IAAC,EACxB,uBAAuB,CAAA,yBAAC,EACxB,wBAAwB,CAAA,yBAAC,EACzB,aAAa,CAAA,KAAC,EACd,YAAY,CAAA,QAAC,EACb,iBAAiB,CAAA,QAAC,GACrB;;AAED,UAAU,GACN,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,GAAG,EAChB,YAAY,EAAE,IAAI,EAClB,UAAU,EAAE,MAAM;;AClBtB,AAAA,MAAM,CAAC,EAEH,UAAU,EAAE,oBAAoB,EAChC,UAAU,EAAE,KAAK,EACjB,UAAU,EAAE,uCAAuC,EAGnD,OAAO,EAAE,CAAC,GAiYb;;A
[...]
+ "mappings":
"CCAC,AAAD,IAAK,CAAC,EACF,QAAQ,CAAA,QAAC,EACT,WAAW,CAAA,QAAC,EACZ,gBAAgB,CAAA,QAAC,EACjB,kBAAkB,CAAA,yFAAC,EACnB,cAAc,CAAA,QAAC,EACf,uBAAuB,CAAA,IAAC,EACxB,uBAAuB,CAAA,yBAAC,EACxB,wBAAwB,CAAA,yBAAC,EACzB,aAAa,CAAA,KAAC,EACd,YAAY,CAAA,QAAC,EACb,iBAAiB,CAAA,QAAC,GACrB;;AAED,UAAU,GACN,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,GAAG,EAChB,YAAY,EAAE,IAAI,EAClB,UAAU,EAAE,MAAM;;AClBtB,AAAA,MAAM,CAAC,EAEH,UAAU,EAAE,oBAAoB,EAChC,UAAU,EAAE,KAAK,EACjB,UAAU,EAAE,uCAAuC,EAGnD,OAAO,EAAE,CAAC,GAiYb;;A
[...]
}
\ No newline at end of file