Worked on homepage accessibility

This commit is contained in:
Dan Brown 2021-01-04 13:24:03 +00:00
commit 6a833ad4e4
Signed by: danb
GPG key ID: 46D9F943C24A2EF9

View file

@ -30,7 +30,7 @@
<h2 id="features">Features</h2>
<div class="row">
<div class="col-sm-4">
<h4><span class="icon">{{partial "icon/code.svg"}}</span>Free &amp; Open Source</h4>
<h4><span class="icon" aria-hidden="true">{{partial "icon/code.svg"}}</span>Free &amp; Open Source</h4>
<p>BookStack is fully free and open, MIT licensed. The source is available on GitHub. There is no cost to downloading and installing your own instance of bookstack.
</p>
<p>
@ -38,16 +38,18 @@
</p>
</div>
<div class="col-sm-4" >
<h4><span class="icon">{{partial "icon/laptop_chromebook.svg"}}</span>Easy, Simple Interface</h4>
<h4><span class="icon" aria-hidden="true">{{partial "icon/laptop_chromebook.svg"}}</span>Easy, Simple Interface</h4>
<p>
Simplicity has been the top priority when building BookStack. The page editor has a simple WYSIWYG interface and all content is broken into three simple real world groups:
</p>
<p>
<span class="icon book">{{partial "icon/book.svg"}}</span>Books &nbsp;&nbsp;<span class="icon chapter">{{partial "icon/collections_bookmark.svg"}}</span>Chapters&nbsp;&nbsp; <span class="icon page">{{partial "icon/description.svg"}}</span>Pages
<span class="icon book" aria-hidden="true">{{partial "icon/book.svg"}}</span>Books
&nbsp;&nbsp;<span class="icon chapter" aria-hidden="true">{{partial "icon/collections_bookmark.svg"}}</span>Chapters&nbsp;&nbsp;
<span class="icon page" aria-hidden="true">{{partial "icon/description.svg"}}</span>Pages
</p>
</div>
<div class="col-sm-4" >
<h4><span class="icon">{{partial "icon/search.svg"}}</span>Searchable and Connected</h4>
<h4><span class="icon" aria-hidden="true">{{partial "icon/search.svg"}}</span>Searchable and Connected</h4>
<p>
The content in BookStack is fully searchable. You are able to search at book level or across all books, chapters &amp; pages. The ability to link directly to any paragraph allows you to keep your documentation connected.
</p>
@ -58,19 +60,19 @@
</p>
<div class="row">
<div class="col-sm-4">
<h4><span class="icon">{{partial "icon/build.svg"}}</span>Configurable</h4>
<h4><span class="icon" aria-hidden="true">{{partial "icon/build.svg"}}</span>Configurable</h4>
<p>
Configuration options allow you to set-up BookStack to suit your use case. You can change the name, Logo and registration options. You can also change whether the whole system is publicly viewable or not.
</p>
</div>
<div class="col-sm-4" >
<h4><span class="icon">{{partial "icon/storage.svg"}}</span>Simple Requirements</h4>
<h4><span class="icon" aria-hidden="true">{{partial "icon/storage.svg"}}</span>Simple Requirements</h4>
<p>
BookStack is built using PHP, on top of the Laravel framework and it uses MySQL to store data. Performance has been kept in mind and BookStack can run happily on a $5 Digital Ocean VPS.
</p>
</div>
<div class="col-sm-4" >
<h4><span class="icon">{{partial "icon/directions_boat.svg"}}</span>Powerful Features</h4>
<h4><span class="icon" aria-hidden="true">{{partial "icon/directions_boat.svg"}}</span>Powerful Features</h4>
<p>
On top of the powerful search and linking there is also cross-book sorting, page revisions and image management. A full role and permission system allow you to lock down content and actions as required.
</p>
@ -81,19 +83,19 @@
</p>
<div class="row">
<div class="col-sm-4">
<h4><span class="icon">{{partial "icon/language.svg"}}</span>Multi-lingual</h4>
<h4><span class="icon" aria-hidden="true">{{partial "icon/language.svg"}}</span>Multi-lingual</h4>
<p>
BookStack users can set their preferred language. Thanks to great community contributors, Current languages built into BookStack include EN, FR, DE, ES, IT, JA, NL, PL, RU and more.
</p>
</div>
<div class="col-sm-4" >
<h4><span class="icon">{{partial "icon/edit.svg"}}</span>Optional Markdown Editor</h4>
<h4><span class="icon" aria-hidden="true">{{partial "icon/edit.svg"}}</span>Optional Markdown Editor</h4>
<p>
If you prefer to write in Markdown then BookStack supports you. A markdown editor is provided and includes a live-preview as you write your documentation.
</p>
</div>
<div class="col-sm-4" >
<h4><span class="icon">{{partial "icon/lock.svg"}}</span>Integrated Authentication</h4>
<h4><span class="icon" aria-hidden="true">{{partial "icon/lock.svg"}}</span>Integrated Authentication</h4>
<p>
As well as the default email/password login social providers such as GitHub, Google, Slack, AzureAD and more can be used. Okta and LDAP options are available for enterprise environments.
</p>
@ -122,8 +124,8 @@
<div class="col-sm-6 text-center">
<div class="demo-box text-left " >
<label>Demo site url</label> <br><a href="https://demo.bookstackapp.com" target="_blank">https://demo.bookstackapp.com</a> <br>
<label>Admin email</label> <br><input type="text" onclick="this.select();" value="admin@example.com" readonly="true"><br>
<label>Admin password</label> <br><input type="text" onclick="this.select();" value="password" readonly="true"> <br><br>
<label for="demo-email">Admin email</label> <br><input id="demo-email" type="text" onclick="this.select();" value="admin@example.com" readonly="true"><br>
<label for="demo-password">Admin password</label> <br><input id="demo-password" type="text" onclick="this.select();" value="password" readonly="true"> <br><br>
<a href="https://demo.bookstackapp.com/login?email=admin@example.com&password=password" class="button" target="_blank">Open demo site</a>
</div>
</div>
@ -138,8 +140,8 @@
<div class="row">
<div class="col-sm-4 col-sm-offset-0 col-xs-8 col-xs-offset-2">
<h4>Page View</h4>
<p>How core content is viewed in BookStack</p>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figcaption>How core content is viewed in BookStack</figcaption>
<a href="images/screenshots/page-view.png" data-size="1666x910">
<img src="images/screenshots/thumb_page-view.png" alt="Page View" loading="lazy">
</a>
@ -147,8 +149,8 @@
</div>
<div class="col-sm-4 col-sm-offset-0 col-xs-8 col-xs-offset-2">
<h4>Page Editor</h4>
<p>The WYSIWYG interface for editing pages</p>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figcaption>The WYSIWYG interface for editing pages</figcaption>
<a href="images/screenshots/page-edit.png" data-size="1666x910">
<img src="images/screenshots/thumb_page-edit.png" alt="Page Editing" loading="lazy">
</a>
@ -156,8 +158,8 @@
</div>
<div class="col-sm-4 col-sm-offset-0 col-xs-8 col-xs-offset-2">
<h4>Image Manager</h4>
<p>How images are uploaded and managed</p>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figcaption>How images are uploaded and managed</figcaption>
<a href="images/screenshots/image-manager.png" data-size="1666x910">
<img src="images/screenshots/thumb_image-manager.png" alt="Image Manager" loading="lazy">
</a>
@ -170,8 +172,8 @@
<div class="row">
<div class="col-sm-4 col-sm-offset-0 col-xs-8 col-xs-offset-2">
<h4>All Books Overview</h4>
<p>An overview of the top-level categorisation</p>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figcaption>An overview of the top-level categorisation</figcaption>
<a href="images/screenshots/books-view.png" data-size="1666x910">
<img src="images/screenshots/thumb_books-view.png" alt="View of all books" loading="lazy">
</a>
@ -179,8 +181,8 @@
</div>
<div class="col-sm-4 col-sm-offset-0 col-xs-8 col-xs-offset-2">
<h4>Book Overview</h4>
<p>A view of the main content container: A book</p>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figcaption>A view of the main content container: A book</figcaption>
<a href="images/screenshots/book-overview.png" data-size="1666x910">
<img src="images/screenshots/thumb_book-overview.png" alt="Book Overview" loading="lazy">
</a>
@ -188,8 +190,8 @@
</div>
<div class="col-sm-4 col-sm-offset-0 col-xs-8 col-xs-offset-2">
<h4>Book Sorting</h4>
<p>How created content can be sorted within a book</p>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figcaption>How created content can be sorted within a book</figcaption>
<a href="images/screenshots/book-sorting.png" data-size="1666x910">
<img src="images/screenshots/thumb_book-sorting.png" alt="Book Content Sorting View" loading="lazy">
</a>
@ -202,8 +204,8 @@
<div class="row">
<div class="col-sm-4 col-sm-offset-0 col-xs-8 col-xs-offset-2">
<h4>Global Search</h4>
<p>The main interface for searching created content</p>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figcaption>The main interface for searching created content</figcaption>
<a href="images/screenshots/search.png" data-size="1666x910">
<img src="images/screenshots/thumb_search.png" alt="Searching all content" loading="lazy">
</a>
@ -211,8 +213,8 @@
</div>
<div class="col-sm-4 col-sm-offset-0 col-xs-8 col-xs-offset-2">
<h4>App Settings</h4>
<p>A view the of application system settings</p>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figcaption>A view the of application system settings</figcaption>
<a href="images/screenshots/settings-view.png" data-size="1666x910">
<img src="images/screenshots/thumb_settings-view.png" alt="Settings View" loading="lazy">
</a>
@ -220,8 +222,8 @@
</div>
<div class="col-sm-4 col-sm-offset-0 col-xs-8 col-xs-offset-2">
<h4>Profile Page</h4>
<p>A user profile page, showing their activity and content</p>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<figcaption>A user profile page, showing their activity and content</figcaption>
<a href="images/screenshots/profile-page.png" data-size="1666x910">
<img src="images/screenshots/thumb_profile-page.png" alt="Profile Editing Screen" loading="lazy">
</a>

View file

@ -4,7 +4,7 @@
<div class="container">
<div class="row">
<div class="col-lg-4">
<p class="muted text-small">
<p class="text-small">
BookStack - Created By <a href="https://danb.me" title="danb.me" target="_blank" rel="noopener">Dan Brown</a> and developed with the <a href="https://github.com/BookStackApp/BookStack/graphs/contributors" target="_blank" rel="noopener">community</a>.
<br>
<!-- Thanks to <a href="https://www.browserstack.com/" target="_blank">BrowserStack</a> for providing easy cross-browser testing. <br> -->
@ -12,12 +12,12 @@
</p>
</div>
<div class="col-lg-8 col-md-9 menu">
<a href="{{.Site.BaseURL}}docs"><span class="icon">{{partial "icon/book.svg"}}</span>Documentation</a>
<a href="{{.Site.BaseURL}}#features"><span class="icon">{{partial "icon/star.svg"}}</span>Features</a>
<a href="{{.Site.BaseURL}}#demo"><span class="icon">{{partial "icon/touch_app.svg"}}</span>Demo</a>
<a href="https://github.com/BookStackApp/BookStack" target="_blank"><span class="icon">{{partial "icon/github.svg"}}</span>Github</a>
<a href="https://discord.gg/ztkBqR2" target="_blank"><span class="icon">{{partial "icon/discord.svg"}}</span>Discord</a>
<a href="{{.Site.BaseURL}}blog" target="_blank"><span class="icon">{{partial "icon/rss_feed.svg"}}</span>Blog</a>
<a href="{{.Site.BaseURL}}docs"><span class="icon" aria-hidden="true">{{partial "icon/book.svg"}}</span>Documentation</a>
<a href="{{.Site.BaseURL}}#features"><span class="icon" aria-hidden="true">{{partial "icon/star.svg"}}</span>Features</a>
<a href="{{.Site.BaseURL}}#demo"><span class="icon" aria-hidden="true">{{partial "icon/touch_app.svg"}}</span>Demo</a>
<a href="https://github.com/BookStackApp/BookStack" target="_blank"><span class="icon" aria-hidden="true">{{partial "icon/github.svg"}}</span>Github</a>
<a href="https://discord.gg/ztkBqR2" target="_blank"><span class="icon" aria-hidden="true">{{partial "icon/discord.svg"}}</span>Discord</a>
<a href="{{.Site.BaseURL}}blog" target="_blank"><span class="icon" aria-hidden="true">{{partial "icon/rss_feed.svg"}}</span>Blog</a>
</div>
</div>
<p class="text-small">

View file

@ -124,12 +124,12 @@
<div class="col-md-9 col-sm-6 menu col-xs-4">
<button tabindex="1" id="menu-button" class="button muted" type="button">{{partial "icon/menu.svg"}}</button>
<div class="inner">
<a href="/docs"><span class="icon">{{partial "icon/book.svg"}}</span>Documentation</a>
<a href="/#features"><span class="icon">{{partial "icon/star.svg"}}</span>Features</a>
<a href="/#demo"><span class="icon">{{partial "icon/touch_app.svg"}}</span>Demo</a>
<a href="https://github.com/BookStackApp/BookStack" target="_blank"><span class="icon">{{partial "icon/github.svg"}}</span>Github</a>
<a href="https://discord.gg/ztkBqR2" target="_blank"><span class="icon">{{partial "icon/discord.svg"}}</span>Discord</a>
<a href="/blog"><span class="icon">{{partial "icon/rss_feed.svg"}}</span>Blog</a>
<a href="/docs"><span class="icon" aria-hidden="true">{{partial "icon/book.svg"}}</span>Documentation</a>
<a href="/#features"><span class="icon" aria-hidden="true">{{partial "icon/star.svg"}}</span>Features</a>
<a href="/#demo"><span class="icon" aria-hidden="true">{{partial "icon/touch_app.svg"}}</span>Demo</a>
<a href="https://github.com/BookStackApp/BookStack" target="_blank"><span class="icon" aria-hidden="true">{{partial "icon/github.svg"}}</span>Github</a>
<a href="https://discord.gg/ztkBqR2" target="_blank"><span class="icon" aria-hidden="true">{{partial "icon/discord.svg"}}</span>Discord</a>
<a href="/blog"><span class="icon" aria-hidden="true">{{partial "icon/rss_feed.svg"}}</span>Blog</a>
</div>
</div>
</div>

View file

@ -1,13 +1,13 @@
<svg id="svg4200" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="61.699mm" width="65.023mm" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 230.39711 218.6199">
<g id="layer1" stroke-linejoin="round" fill-rule="evenodd" transform="translate(-245.27 -58.434)" stroke="#0288d1" stroke-width="6" fill="#fff">
<svg xmlns="http://www.w3.org/2000/svg" height="61.699mm" width="65.023mm" version="1.1" viewBox="0 0 230.39711 218.6199" aria-label="BookStack Logo">
<g stroke-linejoin="round" fill-rule="evenodd" transform="translate(-245.27 -58.434)" stroke="#0288d1" stroke-width="6" fill="#fff">
<g stroke-linecap="round">
<path id="path5686" d="m343.79 238.6 128.88-74.409-92.058-53.15-128.88 74.409z"/>
<path id="path5688" d="m251.73 185.45v21.26l92.058 53.15 128.88-74.409v-21.26"/>
<path id="path5694" d="m343.79 274.03-92.058-53.15s-7.5-16.918 0-28.346l92.058 53.15 128.88-74.409v28.346l-128.88 74.409"/>
<path id="path5686-5" d="m343.79 188.99 128.88-74.41-92.06-53.146-128.88 74.406z"/>
<path id="path5692-7" d="m343.79 188.99 128.88-74.409 0.00001 28.346-128.88 74.409-92.058-53.15s-6.0714-17.632 0-28.346z"/>
<path id="path5694-5" d="m343.79 245.69-92.058-53.15s-7.5-16.918 0-28.346l92.058 53.15 128.88-74.409-0.00001 28.346-128.88 74.409"/>
<path d="m343.79 238.6 128.88-74.409-92.058-53.15-128.88 74.409z"/>
<path d="m251.73 185.45v21.26l92.058 53.15 128.88-74.409v-21.26"/>
<path d="m343.79 274.03-92.058-53.15s-7.5-16.918 0-28.346l92.058 53.15 128.88-74.409v28.346l-128.88 74.409"/>
<path d="m343.79 188.99 128.88-74.41-92.06-53.146-128.88 74.406z"/>
<path d="m343.79 188.99 128.88-74.409 0.00001 28.346-128.88 74.409-92.058-53.15s-6.0714-17.632 0-28.346z"/>
<path d="m343.79 245.69-92.058-53.15s-7.5-16.918 0-28.346l92.058 53.15 128.88-74.409-0.00001 28.346-128.88 74.409"/>
</g>
<path id="path5831" d="m402.09 73.836-55.234 31.89 21.48 1.7716 3.0686 12.402 55.235-31.89z"/>
<path d="m402.09 73.836-55.234 31.89 21.48 1.7716 3.0686 12.402 55.235-31.89z"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 973 B

Before After
Before After

View file

@ -11,6 +11,10 @@
&:active {
background-color: darken($backgroundColor, 8%);
}
&:focus {
outline: 1px solid $primary;
outline-offset: 3px;
}
}
// Button Specific Variables
@ -31,51 +35,13 @@ $button-border-radius: 2px;
cursor: pointer;
transition: all ease-in-out 120ms;
box-shadow: 0 0.5px 1.5px 0 rgba(0, 0, 0, 0.21);
@include generate-button-colors(#EEE, $primary);
@include generate-button-colors(#FFF, $primary);
}
.button, input[type="button"], input[type="submit"] {
@extend .button-base;
&.pos {
@include generate-button-colors(#EEE, $positive);
}
&.neg {
@include generate-button-colors(#EEE, $negative);
}
&.secondary {
@include generate-button-colors(#EEE, $secondary);
}
&.muted {
@include generate-button-colors(#EEE, #888);
}
}
.text-button {
@extend .link;
background-color: transparent;
padding: 0;
margin: 0;
border: none;
&:focus, &:active {
outline: 0;
}
&.neg {
color: $negative;
}
}
.button-group {
@include clearfix;
.button, button[type="button"] {
margin: $-xs 0 $-xs 0;
float: left;
border-radius: 0;
&:first-child {
border-radius: $button-border-radius 0 0 $button-border-radius;
}
&:last-child {
border-radius: 0 $button-border-radius $button-border-radius 0;
}
@include generate-button-colors(#FFF, #888);
}
}

View file

@ -1,27 +1,3 @@
/** Flexbox styling rules **/
body.flexbox {
display: flex;
flex-direction: column;
align-items: stretch;
height: 100%;
min-height: 100%;
max-height: 100%;
overflow: hidden;
#content {
flex: 1;
display: flex;
}
}
.flex-fill {
display: flex;
align-items: stretch;
.flex, &.flex {
flex: 1;
}
}
/** Rules for all columns */
div[class^="col-"] img {
max-width: 100%;
@ -41,20 +17,6 @@ div[class^="col-"] img {
}
}
.center-box {
margin: $-xl auto 0 auto;
padding: $-m $-xxl $-xl*2 $-xxl;
max-width: 346px;
display: inline-block;
text-align: left;
vertical-align: top;
&.login {
background-color: #EEE;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
border: 1px solid #DDD;
}
}
.row {
margin-left: -$-m;
margin-right: -$-m;
@ -131,84 +93,6 @@ div[class^="col-"] img {
.col-xs-1 {
width: 8.33333333%;
}
.col-xs-pull-12 {
right: 100%;
}
.col-xs-pull-11 {
right: 91.66666667%;
}
.col-xs-pull-10 {
right: 83.33333333%;
}
.col-xs-pull-9 {
right: 75%;
}
.col-xs-pull-8 {
right: 66.66666667%;
}
.col-xs-pull-7 {
right: 58.33333333%;
}
.col-xs-pull-6 {
right: 50%;
}
.col-xs-pull-5 {
right: 41.66666667%;
}
.col-xs-pull-4 {
right: 33.33333333%;
}
.col-xs-pull-3 {
right: 25%;
}
.col-xs-pull-2 {
right: 16.66666667%;
}
.col-xs-pull-1 {
right: 8.33333333%;
}
.col-xs-pull-0 {
right: auto;
}
.col-xs-push-12 {
left: 100%;
}
.col-xs-push-11 {
left: 91.66666667%;
}
.col-xs-push-10 {
left: 83.33333333%;
}
.col-xs-push-9 {
left: 75%;
}
.col-xs-push-8 {
left: 66.66666667%;
}
.col-xs-push-7 {
left: 58.33333333%;
}
.col-xs-push-6 {
left: 50%;
}
.col-xs-push-5 {
left: 41.66666667%;
}
.col-xs-push-4 {
left: 33.33333333%;
}
.col-xs-push-3 {
left: 25%;
}
.col-xs-push-2 {
left: 16.66666667%;
}
.col-xs-push-1 {
left: 8.33333333%;
}
.col-xs-push-0 {
left: auto;
}
.col-xs-offset-12 {
margin-left: 100%;
}
@ -288,84 +172,6 @@ div[class^="col-"] img {
.col-sm-1 {
width: 8.33333333%;
}
.col-sm-pull-12 {
right: 100%;
}
.col-sm-pull-11 {
right: 91.66666667%;
}
.col-sm-pull-10 {
right: 83.33333333%;
}
.col-sm-pull-9 {
right: 75%;
}
.col-sm-pull-8 {
right: 66.66666667%;
}
.col-sm-pull-7 {
right: 58.33333333%;
}
.col-sm-pull-6 {
right: 50%;
}
.col-sm-pull-5 {
right: 41.66666667%;
}
.col-sm-pull-4 {
right: 33.33333333%;
}
.col-sm-pull-3 {
right: 25%;
}
.col-sm-pull-2 {
right: 16.66666667%;
}
.col-sm-pull-1 {
right: 8.33333333%;
}
.col-sm-pull-0 {
right: auto;
}
.col-sm-push-12 {
left: 100%;
}
.col-sm-push-11 {
left: 91.66666667%;
}
.col-sm-push-10 {
left: 83.33333333%;
}
.col-sm-push-9 {
left: 75%;
}
.col-sm-push-8 {
left: 66.66666667%;
}
.col-sm-push-7 {
left: 58.33333333%;
}
.col-sm-push-6 {
left: 50%;
}
.col-sm-push-5 {
left: 41.66666667%;
}
.col-sm-push-4 {
left: 33.33333333%;
}
.col-sm-push-3 {
left: 25%;
}
.col-sm-push-2 {
left: 16.66666667%;
}
.col-sm-push-1 {
left: 8.33333333%;
}
.col-sm-push-0 {
left: auto;
}
.col-sm-offset-12 {
margin-left: 100%;
}
@ -446,84 +252,6 @@ div[class^="col-"] img {
.col-md-1 {
width: 8.33333333%;
}
.col-md-pull-12 {
right: 100%;
}
.col-md-pull-11 {
right: 91.66666667%;
}
.col-md-pull-10 {
right: 83.33333333%;
}
.col-md-pull-9 {
right: 75%;
}
.col-md-pull-8 {
right: 66.66666667%;
}
.col-md-pull-7 {
right: 58.33333333%;
}
.col-md-pull-6 {
right: 50%;
}
.col-md-pull-5 {
right: 41.66666667%;
}
.col-md-pull-4 {
right: 33.33333333%;
}
.col-md-pull-3 {
right: 25%;
}
.col-md-pull-2 {
right: 16.66666667%;
}
.col-md-pull-1 {
right: 8.33333333%;
}
.col-md-pull-0 {
right: auto;
}
.col-md-push-12 {
left: 100%;
}
.col-md-push-11 {
left: 91.66666667%;
}
.col-md-push-10 {
left: 83.33333333%;
}
.col-md-push-9 {
left: 75%;
}
.col-md-push-8 {
left: 66.66666667%;
}
.col-md-push-7 {
left: 58.33333333%;
}
.col-md-push-6 {
left: 50%;
}
.col-md-push-5 {
left: 41.66666667%;
}
.col-md-push-4 {
left: 33.33333333%;
}
.col-md-push-3 {
left: 25%;
}
.col-md-push-2 {
left: 16.66666667%;
}
.col-md-push-1 {
left: 8.33333333%;
}
.col-md-push-0 {
left: auto;
}
.col-md-offset-12 {
margin-left: 100%;
}
@ -604,84 +332,6 @@ div[class^="col-"] img {
.col-lg-1 {
width: 8.33333333%;
}
.col-lg-pull-12 {
right: 100%;
}
.col-lg-pull-11 {
right: 91.66666667%;
}
.col-lg-pull-10 {
right: 83.33333333%;
}
.col-lg-pull-9 {
right: 75%;
}
.col-lg-pull-8 {
right: 66.66666667%;
}
.col-lg-pull-7 {
right: 58.33333333%;
}
.col-lg-pull-6 {
right: 50%;
}
.col-lg-pull-5 {
right: 41.66666667%;
}
.col-lg-pull-4 {
right: 33.33333333%;
}
.col-lg-pull-3 {
right: 25%;
}
.col-lg-pull-2 {
right: 16.66666667%;
}
.col-lg-pull-1 {
right: 8.33333333%;
}
.col-lg-pull-0 {
right: auto;
}
.col-lg-push-12 {
left: 100%;
}
.col-lg-push-11 {
left: 91.66666667%;
}
.col-lg-push-10 {
left: 83.33333333%;
}
.col-lg-push-9 {
left: 75%;
}
.col-lg-push-8 {
left: 66.66666667%;
}
.col-lg-push-7 {
left: 58.33333333%;
}
.col-lg-push-6 {
left: 50%;
}
.col-lg-push-5 {
left: 41.66666667%;
}
.col-lg-push-4 {
left: 33.33333333%;
}
.col-lg-push-3 {
left: 25%;
}
.col-lg-push-2 {
left: 16.66666667%;
}
.col-lg-push-1 {
left: 8.33333333%;
}
.col-lg-push-0 {
left: auto;
}
.col-lg-offset-12 {
margin-left: 100%;
}

View file

@ -144,7 +144,6 @@ em, i, .italic {
small, p.small, span.small, .text-small {
font-size: 0.8em;
color: lighten($text-dark, 20%);
}
sup, .superscript {

View file

@ -33,8 +33,8 @@ $fs-m: 16px;
$fs-s: 14px;
// Colours
$primary: #0288D1;
$primary-dark: #0288D1;
$primary: #0078b9;
$primary-dark: #0078b9;
$secondary: #e27b41;
$positive: #52A256;
$negative: #E84F4F;

View file

@ -241,8 +241,15 @@ input[type=text] {
box-shadow: 0 5px 10px 1px rgba(0, 0, 0, 0.1);
}
}
figcaption {
margin-bottom: .5rem;
}
h4 {
margin-bottom: 0;
}
}
.docs-content {
padding-bottom: $-xxl;
.edit-link {

View file

@ -33,7 +33,7 @@ var initPhotoSwipeFromDOM = function(gallerySelector) {
continue;
}
linkEl = figureEl.children[0]; // <a> element
linkEl = figureEl.querySelector('a'); // <a> element
size = linkEl.getAttribute('data-size').split('x');
@ -45,10 +45,9 @@ var initPhotoSwipeFromDOM = function(gallerySelector) {
};
if(figureEl.children.length > 1) {
// <figcaption> content
item.title = figureEl.children[1].innerHTML;
item.title = figureEl.querySelector('figcaption').innerHTML;
}
if(linkEl.children.length > 0) {