diff --git a/docs/config.json b/docs/config.json index d66950af28ba32447ec6cc8af06201ec1dbb3f33..fb32ebf5fb8ff56d69c8025e5e6e5b4d71cd22e7 100644 --- a/docs/config.json +++ b/docs/config.json @@ -12,7 +12,8 @@ "jump_buttons": true, "edit_on_github_": "iml-it/appmonitor/tree/master/docs", "links": { - "GitHub Repo": "https://git-repo.iml.unibe.ch/iml-open-source/bash-rest-api-client" + "GitHub Repo": "https://git-repo.iml.unibe.ch/iml-open-source/bash-rest-api-client", + "IML Opensource": "https://os-docs.iml.unibe.ch/" }, "theme": "daux-blue", "search": true diff --git a/docs/style.css b/docs/style.css index aa0563aa4cbe6cf5b2ac363d95eaf12b0e81c96f..18463c799d9cd101d8f9b27a282128cde4494d99 100644 --- a/docs/style.css +++ b/docs/style.css @@ -1,178 +1,267 @@ /* - - patch css elements of daux.io blue theme - + override css elements of daux.io blue theme + version 2022-11-30 */ +:root { + /* Axels Overrides */ + --color-text: #222; + --link-color: #822; + --brand-color: var(--color-secondary); + --brand-background: var(--body-background); + --hr-color: none; + --search-field-background: none; + --search-field-border-color: none; + --sidebar-background: var(--body-background); + --sidebar-border-color: none; + --sidebar-link-active-background: #e8f4f6; + --sidebar-link-active-background: #eee; + /* Axels custom values */ + --axel_bg-toc: var(--body-background); + --axel_bg-toc-head: #f8f8f8; + --axel_brand-background: none; + --axel_brand-pre-background: rgb(255, 0, 51); + ; + --axel_brand-pre-background-hover: rgb(255, 0, 51); + ; + --axel_h1_header: none; + --axel_h1: #345; + --axel_h1-bg: none; + --axel_h1-bottom: 3px solid none; + --axel_h2: #156; + --axel_h2-bg: #f8fafb; + --axel_h2-bottom: 2px solid #467; + --axel_h2-hero-bottom: 2px solid #912; + --axel_h3: #278; + --axel_h3-bottom: 1px solid #ddd; + --axel_hero_bg: #f8f8f8; + --axel_nav-bg: #fcfcfc; + --axel_nav-buttomborder: #ddd; + --axel_pre-background: #f8f8f8; + --axel-th-background: #d0e0e8; + --axel-article-nav-border-top: 0px dotted #ddd; +} +.dark { + /* Axels Overrides */ + --color-text: #c0c0c0; + --link-color: #b44; + --brand-color: var(--color-text); + --brand-background: var(--body-background); + --hr-color: none; + --code-tag-background-color_: #bcc; + --search-field-background: none; + --search-field-border-color: none; + --sidebar-background: var(--body-background); + --sidebar-border-color: none; + --sidebar-link-active-background: #333; + /* Axels custom values */ + --axel_bg-toc: var(--body-background); + --axel_bg-toc-head: #333; + --axel_brand-background: none; + --axel_brand-pre-background: rgb(255, 0, 51); + ; + --axel_brand-pre-background-hover: rgb(255, 0, 51); + ; + --axel_h1_header: none; + --axel_h1: #777; + --axel_h1-bg: none; + --axel_h1-bottom: none; + --axel_h2: #467; + --axel_h2-bg: #202020; + --axel_h2-bottom: 2px solid #256; + --axel_h2-hero-bottom: 2px solid #712; + --axel_h3: #589; + --axel_h3-bottom: 1px solid #333; + --axel_hero_bg: #242424; + --axel_nav-bg: #242424; + --axel_nav-buttomborder: #555; + --axel_pre-background: #bcc; + --axel-th-background: #203038; + --axel-article-nav-border-top: 0px dotted #234; +} -/* ---------- vars ---------- */ - -:root{ - - /* background colors */ - --bg:none; - --bg-body: #fff; - --bg-navlinkactive:#f4f4f4; - --bg-navlinkactive: linear-gradient(-90deg,rgba(0,0,0,0), rgba(40,60,80,0.05) 30%); - --bg-pre:linear-gradient(-4deg, #f0f0f0, #fefefe,#f0f0f0); - --bg-toc: #fff; - - /* foreground colors */ - --color: #234; - --navlinkactive:#f33; - --title: #aaa; - - --link:#12a; - --toclink:rgba(40,60,80,0.8); - --pagerlink:rgba(40,60,80,0.8); - - --h1: rgba(40,60,80,0.8); - --h1-bottom: 1px solid rgba(40,60,80,0.1); - --h2: rgba(40,60,80,0.5); - --h3: rgba(40,60,80,0.3); +/* ---------- left side ---------- */ +a.Brand::before { + background: var(--axel_brand-pre-background); + color: #fff; + font-family: arial; + font-weight: bold; + padding: 0.5em 0.3em; + content: 'IML'; + margin-right: 0.4em; + float: left; +} +a.Brand:hover::before { + background: var(--axel_brand-pre-background-hover); } -/* ---------- tags ---------- */ +a.Brand { + background: var(--axel_brand-background); + font-size: 200%; + height: 4em; +} -body, *{color: var(--color); } -body{background: var(--bg-body);} +/* ---------- page header: breadcrumb ---------- */ +.Page__header { + border: none; +} +.Page__header a { + color: var(--axel_h1_header); +} -a{color: var(--link);} -a:hover{opacity: 0.7;} +.Page__header h1 { + font-size: 1.3em; +} -h1>a{ color:var(--title);} -_h1:nth-child(1){position: fixed; background: var(--bg); box-shadow: 0 0 1em #ccc; padding: 0 1em} -h1:nth-child(1)>a{ color:var(--navlinkactive); } +/* ---------- page content ---------- */ +.s-content { + padding-top: 1em; +} -.s-content h1{color: var(--h1); font-size: 200%; font-weight:bold; margin-top: 2em; border-bottom: var(--h1-bottom);} -.s-content h2{color: var(--h2); font-size: 160%; } -.s-content h3{color: var(--h3); font-size: 140%; } -.s-content h4{margin: 0; font-size: 100%; text-align: center; background-color: rgba(0,0,0,0.05);padding: 0.3em;} +.s-content h1 { + background: var(--axel_h1-bg); + color: var(--axel_h1); + font-size: 200%; + font-weight: bold; + margin-bottom: 2em; + margin-top: 2em; + border-bottom: var(--axel_h1-bottom); +} -.s-content pre{ - background: var(--bg-pre); - border: 4px solid #fff; - box-shadow: 0 0 2em #eee; +.s-content h2 { + background: var(--axel_h2-bg); + color: var(--axel_h2); + font-size: 180%; + font-weight: bold; + margin-top: 4em; + border-bottom: var(--axel_h2-bottom); } -/* ---------- classes ---------- */ +h1:first-of-type { + margin-top: 0em; +} -.required{color:#a42;} -.optional{color:#888;} +h2:first-of-type { + margin-top: 0em; +} +.s-content h3 { + background: var(--axel_h3-bg); + color: var(--axel_h3); + font-size: 150%; + font-weight: bold; + margin-top: 3em; + border-bottom: var(--axel_h3-bottom); +} -/* ----- top left */ -.Brand, -.Columns__left { - background: var(--bg); - border-right: 0px solid #e7e7e9; - color: var(--color); +.s-content h4 { + margin: 0; + font-size: 100%; + text-align: center; + background-color: rgba(0, 0, 0, 0.05); + padding: 0.3em; } -.Brand{font-size: 200%; - background_: linear-gradient(-10deg,#fff 50%, #ddd); - background: var(--bg); + +.s-content pre { + background: var(--axel_pre-background); } -.Columns__right__content { - background: var(--bg); + +/* FIX smaller fnt size in tables */ +.s-content table { + font-size: 1em; } -/* ----- Navi left */ +.s-content table th { + background: var(--axel-th-background); +} -.Nav a:hover{ +.s-content h3 code { + border: none; background: none; - color: var(--navlinkactive) !important; } -.Nav__item--active { - border-right_: 0.3em solid var(--navlinkactive); -} -.Nav__item--active > a{ - background: var(--bg-navlinkactive); - color: var(--navlinkactive); -} -.Nav .Nav .Nav__item--active a { - color: var(--navlinkactive); -} -.Nav .Nav .Nav__item a { - opacity: 1; -} -.Nav__item--open > a { - background-color: var(--bg); +article nav { + border-top: var(--axel-article-nav-border-top); + margin: 8em 0 5em; } -.Nav a[href*="__Welcome"]{ - background: url("/icons/house.png") no-repeat 10px 4px ; - padding-left: 40px; +.Pager li>a { + padding: 1em 2em; } -.Nav a[href*="__How_does_it_work"]{ - background: url("/icons/light-bulb.png") no-repeat 10px 4px ; - padding-left: 40px; -} - - - /* ---------- classes ---------- */ +.required { + color: #a42; +} -/* FIX smaller fnt size in tables */ -.s-content table { - font-size: 1em; +.optional { + color: #888; } +div.hero { + background: var(--axel_hero_bg); + border-radius: 2em; + padding: 5em 2em; + text-align: center; + margin-bottom: 1.5em; +} -/* TOC */ -@media(min-width:1700px){ - .TableOfContentsContainer{ +div.hero h2 { + color: var(--color-text); + background: none; + border-bottom: var(--axel_h2-hero-bottom); + font-size: 300%; + margin: 0 0 2em; +} + +/* ---------- TOC ---------- */ +@media(min-width:1700px) { + .TableOfContentsContainer { position: fixed; right: 2em; top: 1em; } } -.TableOfContentsContainer{ - border-top-left-radius: 1em; - background-color: var(--bg-toc); - border-left: 2px solid rgba(0,0,0,0.05); - padding: 0em; +.TableOfContentsContainer { + background-color: var(--axel_bg-toc); + padding: 0.5em; } -.TableOfContentsContainer__content { - border: none; - font-size: 0.5em; +.s-content .TableOfContentsContainer h4 { + background-color: var(--axel_bg-toc-head); + border-top-left-radius: 1em; + font-size: 1.1em; + margin: 0; + padding: 0; +} +.TableOfContentsContainer__content { + border-width: 1px; + font-size: 0.5em; } -ul.TableOfContents ul{ - list-style-type: none; + +ul.TableOfContents ul { + list-style-type: none; padding-left: 1em; } -.TableOfContentsContainer a{ color:var(--toclink);} -.TableOfContentsContainer__content > .TableOfContents > li + li { - border-top: none; -} -.TableOfContentsContainer__content > .TableOfContents > li { - border-bottom: 1px dashed #ddd; -} +/* ----- Icons on links --- */ -/* pager - prev .. next */ -.s-content{ - margin-bottom: 6em; +.EditOn a::before{ + content: '✏️ '; } -.Pager{ - __border-top: 1px dashed #aaa; - margin: 0; padding: 1em; - box-shadow: 0 -0.5em 1em #f8f8f8; + +.Links a[href^="https://github.com/"]::before { + content: '🌐 '; } -.Pager li a{ - color:var(--pagerlink); - border: 2px solid #f8f8f8; - box-shadow: 0.3em 0.3em 0.5em #eee; - transition: all ease-in-out 0.3s; + +.Links a[href^="https://git-repo.iml.unibe.ch/"]::before { + content: '🌐 '; } -.Pager li a:hover{ - border: 2px solid #fff; - box-shadow: 0.1em 0.1em 0.2em #eee; +.Links a[href^="https://os-docs.iml.unibe.ch"]::before { + content: '📗 '; } \ No newline at end of file