<p class="text-center padded-vertical">
BookStack support is provided at few different tiers depending on
what might suit you or your business. <br>
- Our official paid support services are provided by <a href="#">HTTP Functions Ltd</a>.
+ Our official paid support services are provided by <a href="https://www.httpfunctions.com" target="_blank">HTTP Functions Ltd</a>.
</p>
-<div class="price-table">
-
-</div>
-
<div class="price-table">
<div class="price-table-offer">
<div class="price-table-header">
<p class="text-center small padded-vertical">
Support is provided only in the English language at this time. <br>
Typical support hours are, but not fixed to, between 10:00 and 18:00 UTC/BST. <br>
+ VAT is not included in current pricing although may be chargeable in the future. <br>
Feature and road-map discussion do not guarantee inclusion or prioritization of requested features.
</p>
\ No newline at end of file
</div>
<aside class="col-md-3 blog-sidebar-post-list">
- <input type="text" placeholder="Search the site" class="blog-search-input">
<h4>Latest Posts</h4>
<div class="recent-posts">
{{ range first 8 ( where .Site.RegularPages "Section" "blog") }}
</head>
<body class="nav-closed">
- <header id="header" class="header">
+ <header id="header" class="header clearfix">
<div class="container">
<div class="logo">
<a href="{{.Site.BaseURL}}">
{{partial "icon/logo.svg"}}
<div>BookStack</div>
</a>
+ <button tabindex="1" id="menu-button" class="button muted" type="button">{{partial "icon/menu.svg"}}</button>
</div>
- <div>
+ <div class="header-search-section">
<input type="text" placeholder="Search site" class="doc-search-input">
</div>
<div class="main-nav">
- <button tabindex="1" id="menu-button" class="button muted" type="button">{{partial "icon/menu.svg"}}</button>
<div class="nav-dropdown-wrap">
<a href="#" onclick="event.preventDefault()" class="nav-dropdown-trigger">Platform</a>
<div class="nav-dropdown-menu">
top: 0;
background-color: $primary-dark;
color: #fff;
+ position: relative;
h1 {
color: #FFF;
font-size: 2.666rem;
.icon svg {
fill: #FFF
}
- .menu {
- padding: 12px 0;
- @include smaller-than($m) {
- padding-top: 0;
- }
- }
+}
+
+#header.header {
+ z-index: 5;
}
#header .container {
/** Header Menu **/
-@media screen and (min-width: 600px) {
+@media screen and (min-width: $l) {
.main-nav {
display: flex;
justify-content: flex-end;
opacity: .8;
font-size: .8rem;
}
+ header #menu-button {
+ display: none;
+ }
}
-@media screen and (max-width: 599px) {
+@media screen and (max-width: $l) {
+ header #menu-button {
+ display: inline-block;
+ background-color: transparent;
+ border: 0;
+ box-shadow: none;
+ padding: $-m;
+ line-height: 0;
+ }
+ header #menu-button svg {
+ margin-right: 0;
+ }
+ .header .logo {
+ display: flex;
+ justify-content: space-between;
+ }
+ .header-search-section {
+ display: none;
+ }
#header > .container {
display: block;
}
+ #header .main-nav {
+ display: none;
+ margin-top: -1rem;
+ }
+ #header .main-nav.showing {
+ display: block;
+ }
.nav-dropdown-trigger {
color: #FFF;
pointer-events: none;
text-decoration: underline;
}
-header #menu-button {
- display: none;
- background-color: transparent;
- border: 0;
- box-shadow: none;
- padding-top: $-m;
-}
-
-@include smaller-than($xl) {
- body header {
- padding-top: $-xxl*1.7;
- }
- header .row.fix-mobile {
- top: 0;
- position: fixed;
- background-color: $primary;
- width: 100%;
- z-index: 99;
- border-bottom: 1px solid rgba(255, 255, 255, 0.3);
- }
- header #menu-button {
- display: inline-block;
- }
- header .menu .inner {
- display: none;
- right: $-m;
- position: fixed;
- border-radius: 3px;
- width: 240px;
- background-color: #FFF;
- z-index: 55;
- padding: 0;
- box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25);
- &.showing {
- display: block;
- }
- a {
- color: #444;
- display: block;
- text-align: left;
- border-bottom: 1px solid #EEE;
- padding: $-m $-m*2;
- }
- a .icon svg {
- fill: #444;
- }
- &:after {
- width: 16px;
- height: 16px;
- content: '';
- display: block;
- background-color: #FFF;
- transform: rotate(45deg);
- position: absolute;
- top: -6px;
- border-radius: 2px;
- right: 22px;
- }
- }
+@include smaller-than($xl) {
footer .menu {
display: none;
}
background-color: #222;
}
-input[type="text"].blog-search-input {
- border: 2px solid #BBB;
- color: #222;
- width: 300px;
- margin-bottom: $-s;
- margin-top: $-m;
- border-radius: 4px;
-}
-
.meilisearch-autocomplete .docs-searchbar-footer-logo,
.meilisearch-autocomplete .docs-searchbar-footer {
vertical-align: top !important;
// Mobile menu
-var menuButton = document.getElementById('menu-button');
-var menuDropDown = document.querySelector('header div.inner');
+const menuButton = document.getElementById('menu-button');
+const menuDropDown = document.querySelector('#header .main-nav');
-menuButton.onclick = function(event) {
- var menuClass = menuDropDown.className;
- var visible = menuClass.indexOf('showing') !== -1;
- if (visible) {
- menuDropDown.className = menuClass.replace('showing', '');
- } else {
- menuDropDown.className += ' showing';
- }
- event.stopPropagation();
-};
+menuButton.addEventListener('click', function(event) {
+ menuDropDown.classList.toggle('showing');
+ event.stopPropagation();
+});
-document.body.onclick = function(event) {
- menuDropDown.className = menuDropDown.className.replace('showing', '');
- event.stopPropagation();
-};
+document.body.addEventListener('click', function(event) {
+ menuDropDown.classList.remove('showing');
+ event.stopPropagation();
+});
// Handle video click to play
-var videos = document.querySelectorAll('video');
-for (var i = 0; i < videos.length; i++) {
+const videos = document.querySelectorAll('video');
+for (let i = 0; i < videos.length; i++) {
videos[i].addEventListener('click', videoClick)
}
// Codemirror Setup
-var modeMap = {
+const modeMap = {
'language-html': 'htmlmixed',
'language-bash': 'shell',
'language-js': 'javascript',
'language-sql': 'text/x-mysql',
};
-var codeBlocks = document.querySelectorAll('pre');
-for (var i = 0; i < codeBlocks.length; i++) {
- var block = codeBlocks[i];
- var codeElem = block.querySelector('code');
+const codeBlocks = document.querySelectorAll('pre');
+for (let i = 0; i < codeBlocks.length; i++) {
+ const block = codeBlocks[i];
+ const codeElem = block.querySelector('code');
if (codeElem === null) continue;
- var langClass = codeElem.className;
- var mode = (typeof modeMap[langClass] !== 'undefined') ? modeMap[langClass] : 'htmlmixed';
- var content = codeElem.textContent.trim();
+ const langClass = codeElem.className;
+ const mode = (typeof modeMap[langClass] !== 'undefined') ? modeMap[langClass] : 'htmlmixed';
+ const content = codeElem.textContent.trim();
CodeMirror(function(cmElem) {
block.parentNode.replaceChild(cmElem, block);
}, {
projects / website / commitdiff