diff options
author | Bjørn Erik Pedersen <bjorn.erik.pedersen@gmail.com> | 2019-07-11 13:04:55 +0300 |
---|---|---|
committer | Bjørn Erik Pedersen <bjorn.erik.pedersen@gmail.com> | 2019-07-25 19:50:27 +0300 |
commit | b85ea62abdb7cca052989b39d3b12057abd35d28 (patch) | |
tree | eb9eb6eb4c7b0f36108bb44c743bcac6f722e09e /assets | |
parent | 14554d2b27599e1a6755a62ad3f3e8cbe0cb26d4 (diff) |
Layout fixes vs new Slate
Diffstat (limited to 'assets')
-rw-r--r-- | assets/js/slate/app/_lang.js | 167 | ||||
-rw-r--r-- | assets/scss/slate/_variables.scss | 94 | ||||
-rw-r--r-- | assets/scss/slate/docuapi_overrides.scss | 2 |
3 files changed, 263 insertions, 0 deletions
diff --git a/assets/js/slate/app/_lang.js b/assets/js/slate/app/_lang.js new file mode 100644 index 0000000..745ecba --- /dev/null +++ b/assets/js/slate/app/_lang.js @@ -0,0 +1,167 @@ +//= require ../lib/_jquery + +/* +Copyright 2008-2013 Concur Technologies, Inc. + +Licensed under the Apache License, Version 2.0 (the "License"); you may +not use this file except in compliance with the License. You may obtain +a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, WITHOUT +WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the +License for the specific language governing permissions and limitations +under the License. +*/ +(function (global) { + 'use strict'; + + var languages = []; + + + global.setupLanguages = setupLanguages; + global.activateLanguage = activateLanguage; + + function activateLanguage(language) { + + if (!language) return; + if (language === "") return; + $(".lang-selector a").removeClass('active'); + $(".lang-selector a[data-language-name='" + language + "']").addClass('active'); + // Mod to match Pygments from Hugo: div.highlight > pre code.language-ruby + var codeSelectorPrefix = ".highlight code.language-"; + for (var i=0; i < languages.length; i++) { + $(codeSelectorPrefix + languages[i]).parentsUntil(".highlight").hide(); + $(".lang-specific." + languages[i]).hide(); + } + $(codeSelectorPrefix + language).parentsUntil(".highlight").show(); + $(".lang-specific." + language).parentsUntil(".highlight").show(); + + // scroll to the new location of the position + if ($(window.location.hash).get(0)) { + $(window.location.hash).get(0).scrollIntoView(true); + } + } + + // parseURL and stringifyURL are from https://github.com/sindresorhus/query-string + // MIT licensed + // https://github.com/sindresorhus/query-string/blob/7bee64c16f2da1a326579e96977b9227bf6da9e6/license + function parseURL(str) { + if (typeof str !== 'string') { + return {}; + } + + str = str.trim().replace(/^(\?|#|&)/, ''); + + if (!str) { + return {}; + } + + return str.split('&').reduce(function (ret, param) { + var parts = param.replace(/\+/g, ' ').split('='); + var key = parts[0]; + var val = parts[1]; + + key = decodeURIComponent(key); + // missing `=` should be `null`: + // http://w3.org/TR/2012/WD-url-20120524/#collect-url-parameters + val = val === undefined ? null : decodeURIComponent(val); + + if (!ret.hasOwnProperty(key)) { + ret[key] = val; + } else if (Array.isArray(ret[key])) { + ret[key].push(val); + } else { + ret[key] = [ret[key], val]; + } + + return ret; + }, {}); + }; + + function stringifyURL(obj) { + return obj ? Object.keys(obj).sort().map(function (key) { + var val = obj[key]; + + if (Array.isArray(val)) { + return val.sort().map(function (val2) { + return encodeURIComponent(key) + '=' + encodeURIComponent(val2); + }).join('&'); + } + + return encodeURIComponent(key) + '=' + encodeURIComponent(val); + }).join('&') : ''; + }; + + // gets the language set in the query string + function getLanguageFromQueryString() { + if (location.search.length >= 1) { + var language = parseURL(location.search).language; + if (language) { + return language; + } else if (jQuery.inArray(location.search.substr(1), languages) != -1) { + return location.search.substr(1); + } + } + + return false; + } + + // returns a new query string with the new language in it + function generateNewQueryString(language) { + var url = parseURL(location.search); + if (url.language) { + url.language = language; + return stringifyURL(url); + } + return language; + } + + // if a button is clicked, add the state to the history + function pushURL(language) { + if (!history) { return; } + var hash = window.location.hash; + if (hash) { + hash = hash.replace(/^#+/, ''); + } + history.pushState({}, '', '?' + generateNewQueryString(language) + '#' + hash); + + // save language as next default + localStorage.setItem("language", language); + } + + function setupLanguages(l) { + var defaultLanguage = localStorage.getItem("language"); + + languages = l; + + var presetLanguage = getLanguageFromQueryString(); + if (presetLanguage) { + // the language is in the URL, so use that language! + activateLanguage(presetLanguage); + + localStorage.setItem("language", presetLanguage); + } else if ((defaultLanguage !== null) && (jQuery.inArray(defaultLanguage, languages) != -1)) { + // the language was the last selected one saved in localstorage, so use that language! + activateLanguage(defaultLanguage); + } else { + // no language selected, so use the default + activateLanguage(languages[0]); + } + } + + // if we click on a language tab, activate that language + $(function() { + $(".lang-selector a").on("click", function() { + var language = $(this).data("language-name"); + pushURL(language); + activateLanguage(language); + return false; + }); + window.onpopstate = function() { + activateLanguage(getLanguageFromQueryString()); + }; + }); +})(window); diff --git a/assets/scss/slate/_variables.scss b/assets/scss/slate/_variables.scss new file mode 100644 index 0000000..d901d4e --- /dev/null +++ b/assets/scss/slate/_variables.scss @@ -0,0 +1,94 @@ +@import 'docuapi_overrides'; + +.content { + // prevent clearing of higlight divs + &>div.highlight { + clear:none; + } +} + +// BACKGROUND COLORS +//////////////////// +$nav-bg: #25283D !default; +$examples-bg: #25283D !default; +$code-bg: #783F8E !default; +$code-annotation-bg: #191D1F !default; +$nav-subitem-bg: #1E2224 !default; +$nav-active-bg: #0F75D4 !default; +$nav-active-parent-bg: #1E2224 !default; // parent links of the current section +$lang-select-border: #000 !default; +$lang-select-bg: #1E2224 !default; +$lang-select-active-bg: #3E92CC !default; // feel free to change this to blue or something +$lang-select-pressed-bg: #111 !default; // color of language tab bg when mouse is pressed +$main-bg: #FFFAFF !default; +$aside-notice-bg: #8fbcd4 !default; +$aside-warning-bg: #c97a7e !default; +$aside-success-bg: #6ac174 !default; +$search-notice-bg: #c97a7e !default; + + +// TEXT COLORS +//////////////////// +$main-text: #333 !default; // main content text color +$nav-text: #fff !default; +$nav-active-text: #fff !default; +$nav-active-parent-text: #fff !default; // parent links of the current section +$lang-select-text: #fff !default; // color of unselected language tab text +$lang-select-active-text: #fff !default; // color of selected language tab text +$lang-select-pressed-text: #fff !default; // color of language tab text when mouse is pressed + + +// SIZES +//////////////////// +$nav-width: 230px !default; // width of the navbar +$examples-width: 50% !default; // portion of the screen taken up by code examples +$logo-margin: 0px !default; // margin below logo +$main-padding: 28px !default; // padding to left and right of content & examples +$nav-padding: 15px !default; // padding to left and right of navbar +$nav-v-padding: 10px !default; // padding used vertically around search boxes and results +$nav-indent: 10px !default; // extra padding for ToC subitems +$code-annotation-padding: 13px !default; // padding inside code annotations +$h1-margin-bottom: 21px !default; // padding under the largest header tags +$tablet-width: 930px !default; // min width before reverting to tablet size +$phone-width: $tablet-width - $nav-width !default; // min width before reverting to mobile size + + +// FONTS +//////////////////// + +@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700&display=swap'); + + +%default-font { + font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + font-size: 14px; + font-weight: 400; +} + +%header-font { + @extend %default-font; + font-weight: 700; +} + +%code-font { + font-family: Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace, serif; + font-size: 12px; + line-height: 1.5; +} + + +// OTHER +//////////////////// +$nav-footer-border-color: #666 !default; +$search-box-border-color: #666 !default; + + +//////////////////////////////////////////////////////////////////////////////// +// INTERNAL +//////////////////////////////////////////////////////////////////////////////// +// These settings are probably best left alone. + +%break-words { + word-break: break-all; + hyphens: auto; +}
\ No newline at end of file diff --git a/assets/scss/slate/docuapi_overrides.scss b/assets/scss/slate/docuapi_overrides.scss new file mode 100644 index 0000000..fe83af3 --- /dev/null +++ b/assets/scss/slate/docuapi_overrides.scss @@ -0,0 +1,2 @@ +// This is an empty placeholder for en user customizations. + |