Add Brooklyn styles
Project: http://git-wip-us.apache.org/repos/asf/brooklyn-docs/repo Commit: http://git-wip-us.apache.org/repos/asf/brooklyn-docs/commit/1e7a57ac Tree: http://git-wip-us.apache.org/repos/asf/brooklyn-docs/tree/1e7a57ac Diff: http://git-wip-us.apache.org/repos/asf/brooklyn-docs/diff/1e7a57ac Branch: refs/heads/master Commit: 1e7a57ac463c3ead724af6050878fe0d6e254b31 Parents: 327d2b3 Author: Thomas Bouron <[email protected]> Authored: Wed Oct 11 12:22:20 2017 +0100 Committer: Thomas Bouron <[email protected]> Committed: Mon Oct 16 14:56:03 2017 +0100 ---------------------------------------------------------------------- book.json | 3 + guide/_layouts/website/page.html | 10 ++ guide/styles/website.css | 216 ++++++++++++++++++++++++++++++++++ 3 files changed, 229 insertions(+) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/brooklyn-docs/blob/1e7a57ac/book.json ---------------------------------------------------------------------- diff --git a/book.json b/book.json index 9ee83f4..3fce5f2 100644 --- a/book.json +++ b/book.json @@ -45,6 +45,9 @@ "variables": { "brooklyn_version": "1.0.0-SNAPSHOT", "brooklyn_version_stable": "0.12.0", + "url": { + "brooklyn_website": "https://brooklyn.apache.org"; + }, "url_root": "http://0.0.0.0:4000";, "path": { "guide": "/guide", http://git-wip-us.apache.org/repos/asf/brooklyn-docs/blob/1e7a57ac/guide/_layouts/website/page.html ---------------------------------------------------------------------- diff --git a/guide/_layouts/website/page.html b/guide/_layouts/website/page.html new file mode 100644 index 0000000..1bdc74c --- /dev/null +++ b/guide/_layouts/website/page.html @@ -0,0 +1,10 @@ +{% extends template.self %} + +{% block body %} + <header class="page-header"> + <a href="{{book.url.brooklyn_website}}" class="navbar-brand"> + <img src="{{book.url.brooklyn_website}}/v/latest/style/img/apache-brooklyn-logo-244px-wide.png" alt="Apache Brooklyn"> + </a> + </header> + {{ super() }} +{% endblock %} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/brooklyn-docs/blob/1e7a57ac/guide/styles/website.css ---------------------------------------------------------------------- diff --git a/guide/styles/website.css b/guide/styles/website.css new file mode 100644 index 0000000..6c70bfc --- /dev/null +++ b/guide/styles/website.css @@ -0,0 +1,216 @@ +body { + font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-weight: 300; + font-size: 17px; + color: #393939; +} + +.page-header { + background-color: #fafafa; + height: 50px; + position: fixed; + top: 0; + left: 0; + right: 0; +} + +.page-header .navbar-brand { + position: relative; + top: 11px; + left: 15px; +} + +.book { + height: calc(100% - 50px); + top: 50px; +} + +.book-header { + border-top: 1px solid rgba(0,0,0,.07); + top: 50px; +} +.book-header .btn.lang-switcher.active { + background-color: #449d44; +} +.book-summary ul.summary li.active>a, +.markdown-section a { + color : #449d44; +} + +/* YAML EXPLAINED + ----------------------------------------------------------------------- */ +div.annotated_blueprint { + margin-top: 60px; } +div.annotated_blueprint div.code_scroller { + background-color: #f5f5f5; + border: 0.4em solid #666; + border-left: 0; + border-right: 0; + border-radius: 3px; + width: 57%; + margin-right: 0px; + margin-left: auto; + background-color: #666; + color: #ddd; + overflow-x: scroll; } +div.annotated_blueprint div.code_scroller div { + overflow-x: visible !important; + overflow-y: visible !important; } +div.annotated_blueprint div.code_scroller div.code_viewer { + width: auto; + height: 100%; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block { + display: -webkit-box; + /* OLD - iOS 6-, Safari 3.1-6 */ + display: -moz-box; + /* OLD - Firefox 19- (buggy but mostly works) */ + display: -ms-flexbox; + /* TWEENER - IE 10 */ + display: -webkit-flex; + /* NEW - Chrome */ + display: flex; + /* NEW, Spec - Opera 12.1, Firefox 20+ */ + -webkit-align-items: center; + align-items: center; + z-index: -10; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div:last-child { + font-family: Consolas, Lucida Console, Monaco, monospace; + white-space: pre; + word-wrap: normal; + overflow-y: scroll; + font-size: 80%; + /* override color and bg-color on 'code' from bootstrap, and a touch more padding on top since font-size is smaller */ + color: #393939; + background-color: #f5f5f5; + padding: 0.4em 0.8em; + overflow-x: scroll; + /* override border and line-height on 'pre' from bootstrap */ + border: none; + border-radius: 2px; + line-height: 1.4; + font-size: 13px; + border: 0; + border-radius: 0; + padding: 0px 0.6em; + background-color: #666; + color: #ddd; + min-width: 100%; + margin-top: 3px; + margin-bottom: 3px; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div.annotations_wrapper1 { + font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div.annotations_wrapper1 div.annotations_wrapper2 { + position: absolute; + -webkit-transform: translateX(-100%) translateY(-50%); + -moz-transform: translateX(-100%) translateY(-50%); + -o-transform: translateX(-100%) translateY(-50%); + transform: translateX(-100%) translateY(-50%); + width: 41%; + display: -webkit-box; + /* OLD - iOS 6-, Safari 3.1-6 */ + display: -moz-box; + /* OLD - Firefox 19- (buggy but mostly works) */ + display: -ms-flexbox; + /* TWEENER - IE 10 */ + display: -webkit-flex; + /* NEW - Chrome */ + display: flex; + /* NEW, Spec - Opera 12.1, Firefox 20+ */ + -webkit-align-items: center; + align-items: center; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div.annotations_wrapper1 div.annotations_wrapper2 div.annotations { + height: auto; + width: 100%; + padding: 8px 8px; + padding-bottom: 11px; + color: #393939; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div.annotations_wrapper1 div.annotations_wrapper2 div.annotations div.short { + font-size: 125%; + text-align: right; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div.annotations_wrapper1 div.annotations_wrapper2 div.annotations div.long { + display: none; + font-size: 85%; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div.annotations_wrapper1 div.annotations_wrapper2 div.annotations div.long p { + margin: 8px 0 8px 0; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div.annotations_wrapper1 div.annotations_wrapper2 div.annotations div.long p:first-child { + margin-top: 0; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div.annotations_wrapper1 div.annotations_wrapper2 div.annotations div.long p:last-child { + margin-bottom: 0; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div.annotations_wrapper1 div.annotations_wrapper2 div.connector { + height: 7px; + width: 48px; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block:hover > div:last-child { + background-color: #48a648; + color: #fafafa; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block:hover { + z-index: 30 !important; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block:hover div.annotations_wrapper1 { + z-index: 30 !important; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block:hover div.annotations { + background-color: #fafafa; + border: 4px solid #48a648; + border-radius: 8px; + text-align: center; + box-shadow: 2px 10px 20px #aaa; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block:hover div.annotations div.short { + font-size: 100% !important; + text-align: center !important; + color: #393939; + margin-bottom: 8px; + font-weight: normal; + z-index: 10; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block:hover div.annotations div.long { + display: inherit !important; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block:hover div.connector { + border-style: solid; + width: 16px !important; + border-width: 5px 0px 5px 6px; + border-style: solid; + border-color: transparent transparent transparent #48a648; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block > div:last-child .ann_highlight { + font-weight: bold; + color: #e8f0e0; } +div.annotated_blueprint div.code_scroller div.code_viewer div.block:hover > div:last-child .ann_highlight { + color: #f8fff8; } +div.annotated_blueprint div.code_viewer:hover div.annotations div.short { + color: #aaa; } +div.annotated_blueprint div.code_scroller div.initial_notice { + display: none; + height: 0; + width: 0; + overflow-x: visible; + overflow-y: visible; } +div.annotated_blueprint div.code_scroller div.initial_notice > div { + z-index: 10; + background-color: rgba(170, 170, 170, 0.9); + position: relative; + width: 0; + height: 0; + display: -webkit-box; + /* OLD - iOS 6-, Safari 3.1-6 */ + display: -moz-box; + /* OLD - Firefox 19- (buggy but mostly works) */ + display: -ms-flexbox; + /* TWEENER - IE 10 */ + display: -webkit-flex; + /* NEW - Chrome */ + display: flex; + /* NEW, Spec - Opera 12.1, Firefox 20+ */ + -webkit-align-items: top; + align-items: top; } +div.annotated_blueprint div.code_scroller div.initial_notice > div > div { + padding-top: 24px; + font-size: 125%; + font-weight: bold; + text-align: center; + width: 100%; } +div.annotated_blueprint div.code_scroller div.initial_notice > div > div .ann_light { + padding-top: 12px; + font-weight: 300; } +div.annotated_blueprint div.code_scroller div.initial_notice > div > div .ann_play { + display: block; + padding-top: 24px; + padding-bottom: 24px; + font-size: 600%; } +div.annotated_blueprint div.code_scroller:hover div.initial_notice { + display: none; } \ No newline at end of file
