mirror of
https://github.com/sourcey/spectacle.git
synced 2024-09-11 05:25:36 +03:00
Add custom logo support
Improve documentation
This commit is contained in:
parent
bf38d7bba8
commit
62532efa0a
16
README.md
16
README.md
@ -1,21 +1,21 @@
|
||||
# Spectacle
|
||||
|
||||
Spectacle lets you generate beautiful HTML5 documentation from [OpenAPI](https://openapis.org)/[Swagger](http://swagger.io) 2.0 API specifications.
|
||||
Spectacle generates beautiful static HTML5 documentation from [OpenAPI](https://openapis.org)/[Swagger](http://swagger.io) 2.0 API specifications.
|
||||
|
||||
The goal of Spectacle is help you "save time and look good" by using a well written spec to automatically generate all your API docs. Using a well written API spec to generate your docs has a number of great advantages:
|
||||
The goal of Spectacle is help you "save time and look good" by using a well written spec to automatically generate your API docs. Using an API spec to generate your docs has a number of great advantages:
|
||||
|
||||
* **Maintain a single source**: Save loads of time by removing the need to maintain a separate API spec and API documentation.
|
||||
* **Maintain a single source**: Save time by removing the need to maintain a separate API spec and API documentation.
|
||||
* **No more out-of-date documentation**: Your documentation will always be up-to-date with your API spec.
|
||||
* **Be a better developer**: Your entire API system will be more stable and robust when built using your spec as a single source of truth.
|
||||
* **Documentation is just the beginning**: Generate all your API integrations from your spec; all the way from tests, to client implementations, to server code. See also [Optimizing Your Workflow](#optimizing-your-workflow)
|
||||
* **Be a better developer**: Your entire API system will be more stable and robust when built around your spec as a single source of truth.
|
||||
* **Documentation is just the beginning**: Generate your API system from your spec, including; tests, client implementations, and server code. See also [Optimizing Your Workflow](#optimizing-your-workflow)
|
||||
|
||||
## Live Demo
|
||||
|
||||
See a demo of Spectacle in action here: http://cheesestore.github.io
|
||||
See a demo of Spectacle in action here: [http://cheesestore.github.io](http://cheesestore.github.io)
|
||||
|
||||
## Features:
|
||||
## Features
|
||||
|
||||
* **OpenAPI/Swagger 2.0 support**: Support for the latest OpenAPI/Swagger specification which is the new standard for documenting REST APIs.
|
||||
* **OpenAPI/Swagger 2.0 support**: Support for the latest OpenAPI/Swagger specification - the new standard for documenting REST APIs.
|
||||
* **Clean responsive design**: Spectacle features a responsive HTML5 and CSS3 layout built with [Foundation 6](http://foundation.zurb.com/sites.html) that looks great on all devices and screen sizes.
|
||||
* **Embed into your existing website**: Spectacle features an embedded option that lets you generate docs without a HTML `<body>` layout for convenient integration into your existing website.
|
||||
* **Live preview developer mode**: Spectacle comes with a development mode that starts a local HTTP server with a file watcher and live reload so you can preview changes to your live documentation in your browser as you write your spec.
|
||||
|
@ -119,6 +119,14 @@ module.exports = function(grunt, options, spec) {
|
||||
}
|
||||
},
|
||||
|
||||
// Copy files to the target directory
|
||||
copy: {
|
||||
logo: {
|
||||
src: options.logoFile,
|
||||
dest: options.targetDir + '/images/' + path.basename(options.logoFile)
|
||||
}
|
||||
},
|
||||
|
||||
// Watch the filesystem and regenerate docs if sources change
|
||||
watch: {
|
||||
options: {
|
||||
|
@ -1,15 +1,20 @@
|
||||
var _ = require('lodash')
|
||||
var path = require('path'),
|
||||
_ = require('lodash');
|
||||
|
||||
var httpMethods = ['get', 'put', 'post', 'delete', 'options', 'head', 'patch']
|
||||
var httpMethods = ['get', 'put', 'post', 'delete', 'options', 'head', 'patch'];
|
||||
|
||||
// Preprocessor for the swagger-json, so that some of the logic can be taken out of the
|
||||
// template
|
||||
// Preprocessor for the Swagger JSON so that some of the logic can be taken
|
||||
// out of the template.
|
||||
|
||||
module.exports = function(swaggerJson) {
|
||||
var copy = _.cloneDeep(swaggerJson)
|
||||
var tagsByName = _.indexBy(copy.tags, 'name')
|
||||
module.exports = function(options, specData) {
|
||||
var copy = _.cloneDeep(specData);
|
||||
var tagsByName = _.indexBy(copy.tags, 'name');
|
||||
|
||||
copy.tags = copy.tags || []
|
||||
copy.tags = copy.tags || [];
|
||||
|
||||
if (options.logoFile) {
|
||||
copy.logo = path.basename(options.logoFile);
|
||||
}
|
||||
|
||||
// The "body"-parameter in each operation is stored in a
|
||||
// separate field "_request_body".
|
||||
|
@ -39,6 +39,14 @@ button:focus {
|
||||
//
|
||||
|
||||
#logo {
|
||||
text-align: center;
|
||||
padding-right: 0.5rem;
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 0.25rem;
|
||||
|
||||
img {
|
||||
max-height: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
// Include the Foundation grid (the only required component)
|
||||
@ -63,10 +71,10 @@ button:focus {
|
||||
width: $drawer-size;
|
||||
|
||||
h5 {
|
||||
margin: 1.5rem 0 0.75rem;
|
||||
margin: 1.5rem 0 0.65rem;
|
||||
text-transform: uppercase;
|
||||
color: $medium-gray;
|
||||
color: $accent-color;
|
||||
color: scale-color($medium-gray, $lightness: -10%);
|
||||
// color: $accent-color;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
@ -81,7 +89,7 @@ button:focus {
|
||||
text-overflow: ellipsis;
|
||||
|
||||
&.active {
|
||||
color: $accent-color; //$primary-color;
|
||||
// color: $accent-color; //$primary-color;
|
||||
color: $primary-color;
|
||||
// font-weight: bold;
|
||||
}
|
||||
|
@ -6,20 +6,25 @@
|
||||
</head>
|
||||
<body id="spectacle">
|
||||
<div id="page" class="drawer-layout drawer-slide-right-large">
|
||||
<div id="sidebar">
|
||||
<button class="close-button" aria-label="Close menu" type="button" data-drawer-close>
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
{{>layout/nav}}
|
||||
</div>
|
||||
{{!layout/topbar}}
|
||||
<div id="docs" class="row collapse expanded drawer" data-drawer>
|
||||
<button class="floating-menu-icon" type="button" data-drawer-slide="right">
|
||||
<span class="hamburger"></span>
|
||||
</button>
|
||||
<div class="example-box doc-content"></div>
|
||||
{{>layout/content}}
|
||||
<div id="sidebar">
|
||||
<button class="close-button" aria-label="Close menu" type="button" data-drawer-close>
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
{{#if logo}}
|
||||
<div id="logo">
|
||||
<img src="/images/{{logo}}" title="{{info.title}}" />
|
||||
</div>
|
||||
{{/if}}
|
||||
{{>layout/nav}}
|
||||
</div>
|
||||
{{!layout/topbar}}
|
||||
<div id="docs" class="row collapse expanded drawer" data-drawer>
|
||||
<button class="floating-menu-icon" type="button" data-drawer-slide="right">
|
||||
<span class="hamburger"></span>
|
||||
</button>
|
||||
<div class="example-box doc-content"></div>
|
||||
{{>layout/content}}
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -5,7 +5,8 @@
|
||||
--}}
|
||||
|
||||
{{#if definitions}}
|
||||
<h1>Schema definitions</h1>
|
||||
<!-- <h1>Schema definitions</h1> -->
|
||||
<h1>Models</h1>
|
||||
|
||||
{{#eachSorted definitions}}
|
||||
{{>swagger/definition title=@key anchor="/definitions" }}
|
||||
|
@ -44,8 +44,8 @@ program.specFile = program.args[0] || 'test/fixtures/cheese.json';
|
||||
//= Load the specification and set variables
|
||||
|
||||
var specData = require(path.resolve(program.specFile)),
|
||||
specTemplate = require(path.resolve(program.appDir + '/lib/preprocessor'))(specData),
|
||||
config = require(path.resolve(program.configFile))(grunt, program, specTemplate);
|
||||
templateData = require(path.resolve(program.appDir + '/lib/preprocessor'))(program, specData),
|
||||
config = require(path.resolve(program.configFile))(grunt, program, templateData);
|
||||
|
||||
//
|
||||
//= Setup Grunt to do the heavy lifting
|
||||
@ -58,6 +58,7 @@ grunt.loadNpmTasks('grunt-contrib-compass');
|
||||
grunt.loadNpmTasks('grunt-contrib-cssmin');
|
||||
grunt.loadNpmTasks('grunt-contrib-watch');
|
||||
grunt.loadNpmTasks('grunt-contrib-clean');
|
||||
grunt.loadNpmTasks('grunt-contrib-copy');
|
||||
grunt.loadNpmTasks('grunt-contrib-connect');
|
||||
grunt.loadNpmTasks('grunt-compile-handlebars');
|
||||
|
||||
@ -117,6 +118,9 @@ else {
|
||||
if (!program.disableJs) {
|
||||
grunt.task.run('javascripts');
|
||||
}
|
||||
if (program.logoFile) {
|
||||
grunt.task.run('copy:logo');
|
||||
}
|
||||
grunt.task.run('templates');
|
||||
if (program.developmentMode) {
|
||||
grunt.task.run('develop');
|
||||
|
@ -49,5 +49,8 @@
|
||||
"lodash": "*",
|
||||
"marked": "*",
|
||||
"trace": "^1.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"grunt-contrib-copy": "^0.8.2"
|
||||
}
|
||||
}
|
||||
|
BIN
public/images/cheese.png
Normal file
BIN
public/images/cheese.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 11 KiB |
BIN
public/images/cheese1.png
Normal file
BIN
public/images/cheese1.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 9.6 KiB |
5490
public/index.html
5490
public/index.html
File diff suppressed because it is too large
Load Diff
@ -1,375 +1,3 @@
|
||||
/**
|
||||
* SlidingCanvas module.
|
||||
* @module foundation.offcanvas
|
||||
* @requires foundation.util.triggers
|
||||
* @requires foundation.util.motion
|
||||
*/
|
||||
// !function($, Foundation) {
|
||||
//
|
||||
// 'use strict';
|
||||
|
||||
/**
|
||||
* Creates a new instance of an off-canvas wrapper.
|
||||
* @class
|
||||
* @fires SlidingCanvas#init
|
||||
* @param {Object} element - jQuery object to initialize.
|
||||
* @param {Object} options - Overrides to the default plugin settings.
|
||||
*/
|
||||
function SlidingCanvas(element, options) {
|
||||
this.$element = element;
|
||||
this.options = $.extend({}, SlidingCanvas.defaults, this.$element.data(), options);
|
||||
this.$lastTrigger = $();
|
||||
|
||||
this._init();
|
||||
this._events();
|
||||
|
||||
// Foundation.registerPlugin(this, 'SlidingCanvas');
|
||||
}
|
||||
|
||||
SlidingCanvas.defaults = {
|
||||
/**
|
||||
* Allow the user to click outside of the menu to close it.
|
||||
* @option
|
||||
* @example true
|
||||
*/
|
||||
closeOnClick: true,
|
||||
/**
|
||||
* Amount of time in ms the open and close transition requires. If none selected, pulls from body style.
|
||||
* @option
|
||||
* @example 500
|
||||
*/
|
||||
transitionTime: 0,
|
||||
/**
|
||||
* Direction the offcanvas opens from. Determines class applied to body.
|
||||
* @option
|
||||
* @example left
|
||||
*/
|
||||
position: 'left',
|
||||
/**
|
||||
* Force the page to scroll to top on open.
|
||||
*/
|
||||
forceTop: true,
|
||||
/**
|
||||
* Allow the offcanvas to be sticky while open. Does nothing if Sass option `$maincontent-prevent-scroll === true`.
|
||||
* Performance in Safari OSX/iOS is not great.
|
||||
*/
|
||||
// isSticky: false,
|
||||
/**
|
||||
* Allow the offcanvas to remain open for certain breakpoints. Can be used with `isSticky`.
|
||||
* @option
|
||||
* @example false
|
||||
*/
|
||||
isRevealed: false,
|
||||
/**
|
||||
* Breakpoint at which to reveal. JS will use a RegExp to target standard classes, if changing classnames, pass your class @`revealClass`.
|
||||
* @option
|
||||
* @example reveal-for-large
|
||||
*/
|
||||
revealOn: null,
|
||||
/**
|
||||
* Force focus to the offcanvas on open. If true, will focus the opening trigger on close.
|
||||
* @option
|
||||
* @example true
|
||||
*/
|
||||
autoFocus: true,
|
||||
/**
|
||||
* Class used to force an offcanvas to remain open. Foundation defaults for this are `reveal-for-large` & `reveal-for-medium`.
|
||||
* @option
|
||||
* TODO improve the regex testing for this.
|
||||
* @example reveal-for-large
|
||||
*/
|
||||
revealClass: 'reveal-for-',
|
||||
/**
|
||||
* Triggers optional focus trapping when opening an offcanvas. Sets tabindex of [data-off-canvas-content] to -1 for accessibility purposes.
|
||||
* @option
|
||||
* @example true
|
||||
*/
|
||||
trapFocus: false
|
||||
};
|
||||
|
||||
/**
|
||||
* Initializes the off-canvas wrapper by adding the exit overlay (if needed).
|
||||
* @function
|
||||
* @private
|
||||
*/
|
||||
SlidingCanvas.prototype._init = function() {
|
||||
var id = this.$element.attr('id');
|
||||
|
||||
this.$element.attr('aria-hidden', 'true');
|
||||
|
||||
// Find triggers that affect this element and add aria-expanded to them
|
||||
$(document)
|
||||
.find('[data-open="'+id+'"], [data-close="'+id+'"], [data-toggle="'+id+'"]')
|
||||
.attr('aria-expanded', 'false')
|
||||
.attr('aria-controls', id);
|
||||
|
||||
// Add a close trigger over the body if necessary
|
||||
if (this.options.closeOnClick){
|
||||
if($('.js-off-canvas-exit').length){
|
||||
this.$exiter = $('.js-off-canvas-exit');
|
||||
}else{
|
||||
var exiter = document.createElement('div');
|
||||
exiter.setAttribute('class', 'js-off-canvas-exit');
|
||||
$('[data-off-canvas-content]').append(exiter);
|
||||
|
||||
this.$exiter = $(exiter);
|
||||
}
|
||||
}
|
||||
|
||||
this.options.isRevealed = this.options.isRevealed || new RegExp(this.options.revealClass, 'g').test(this.$element[0].className);
|
||||
|
||||
if(this.options.isRevealed){
|
||||
this.options.revealOn = this.options.revealOn || this.$element[0].className.match(/(reveal-for-medium|reveal-for-large)/g)[0].split('-')[2];
|
||||
this._setMQChecker();
|
||||
}
|
||||
if(!this.options.transitionTime){
|
||||
this.options.transitionTime = parseFloat(window.getComputedStyle($('[data-off-canvas-wrapper]')[0]).transitionDuration) * 1000;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Adds event handlers to the off-canvas wrapper and the exit overlay.
|
||||
* @function
|
||||
* @private
|
||||
*/
|
||||
SlidingCanvas.prototype._events = function() {
|
||||
this.$element.off('.zf.trigger .zf.offcanvas').on({
|
||||
'open.zf.trigger': this.open.bind(this),
|
||||
'close.zf.trigger': this.close.bind(this),
|
||||
'toggle.zf.trigger': this.toggle.bind(this),
|
||||
'keydown.zf.offcanvas': this._handleKeyboard.bind(this)
|
||||
});
|
||||
|
||||
if (this.$exiter.length) {
|
||||
var _this = this;
|
||||
this.$exiter.on({'click.zf.offcanvas': this.close.bind(this)});
|
||||
}
|
||||
};
|
||||
/**
|
||||
* Applies event listener for elements that will reveal at certain breakpoints.
|
||||
* @private
|
||||
*/
|
||||
SlidingCanvas.prototype._setMQChecker = function(){
|
||||
var _this = this;
|
||||
|
||||
// $(window).on('changed.zf.mediaquery', function(){
|
||||
// if(Foundation.MediaQuery.atLeast(_this.options.revealOn)){
|
||||
// _this.reveal(true);
|
||||
// }else{
|
||||
// _this.reveal(false);
|
||||
// }
|
||||
// }).one('load.zf.offcanvas', function(){
|
||||
// if(Foundation.MediaQuery.atLeast(_this.options.revealOn)){
|
||||
// _this.reveal(true);
|
||||
// }
|
||||
// });
|
||||
};
|
||||
/**
|
||||
* Handles the revealing/hiding the off-canvas at breakpoints, not the same as open.
|
||||
* @param {Boolean} isRevealed - true if element should be revealed.
|
||||
* @function
|
||||
*/
|
||||
SlidingCanvas.prototype.reveal = function(isRevealed){
|
||||
var $closer = this.$element.find('[data-close]');
|
||||
if(isRevealed){
|
||||
this.close();
|
||||
this.isRevealed = true;
|
||||
// if(!this.options.forceTop){
|
||||
// var scrollPos = parseInt(window.pageYOffset);
|
||||
// this.$element[0].style.transform = 'translate(0,' + scrollPos + 'px)';
|
||||
// }
|
||||
// if(this.options.isSticky){ this._stick(); }
|
||||
this.$element.off('open.zf.trigger toggle.zf.trigger');
|
||||
if($closer.length){ $closer.hide(); }
|
||||
}else{
|
||||
this.isRevealed = false;
|
||||
// if(this.options.isSticky || !this.options.forceTop){
|
||||
// this.$element[0].style.transform = '';
|
||||
// $(window).off('scroll.zf.offcanvas');
|
||||
// }
|
||||
this.$element.on({
|
||||
'open.zf.trigger': this.open.bind(this),
|
||||
'toggle.zf.trigger': this.toggle.bind(this)
|
||||
});
|
||||
if($closer.length){
|
||||
$closer.show();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Opens the off-canvas menu.
|
||||
* @function
|
||||
* @param {Object} event - Event object passed from listener.
|
||||
* @param {jQuery} trigger - element that triggered the off-canvas to open.
|
||||
* @fires SlidingCanvas#opened
|
||||
*/
|
||||
SlidingCanvas.prototype.open = function(event, trigger) {
|
||||
if (this.$element.hasClass('is-open') || this.isRevealed){ return; }
|
||||
var _this = this,
|
||||
$body = $(document.body);
|
||||
// $('body').scrollTop(0);
|
||||
// window.pageYOffset = 0;
|
||||
|
||||
// if(!this.options.forceTop){
|
||||
// var scrollPos = parseInt(window.pageYOffset);
|
||||
// this.$element[0].style.transform = 'translate(0,' + scrollPos + 'px)';
|
||||
// if(this.$exiter.length){
|
||||
// this.$exiter[0].style.transform = 'translate(0,' + scrollPos + 'px)';
|
||||
// }
|
||||
// }
|
||||
/**
|
||||
* Fires when the off-canvas menu opens.
|
||||
* @event SlidingCanvas#opened
|
||||
*/
|
||||
Foundation.Move(this.options.transitionTime, this.$element, function(){
|
||||
$('[data-off-canvas-wrapper]').addClass('is-off-canvas-open is-open-'+ _this.options.position);
|
||||
|
||||
_this.$element
|
||||
.addClass('is-open')
|
||||
|
||||
// if(_this.options.isSticky){
|
||||
// _this._stick();
|
||||
// }
|
||||
});
|
||||
this.$element.attr('aria-hidden', 'false')
|
||||
.trigger('opened.zf.offcanvas');
|
||||
|
||||
|
||||
if(trigger){
|
||||
this.$lastTrigger = trigger.attr('aria-expanded', 'true');
|
||||
}
|
||||
if(this.options.autoFocus){
|
||||
this.$element.one('finished.zf.animate', function(){
|
||||
_this.$element.find('a, button').eq(0).focus();
|
||||
});
|
||||
}
|
||||
if(this.options.trapFocus){
|
||||
$('[data-off-canvas-content]').attr('tabindex', '-1');
|
||||
this._trapFocus();
|
||||
}
|
||||
};
|
||||
/**
|
||||
* Traps focus within the offcanvas on open.
|
||||
* @private
|
||||
*/
|
||||
SlidingCanvas.prototype._trapFocus = function(){
|
||||
var focusable = Foundation.Keyboard.findFocusable(this.$element),
|
||||
first = focusable.eq(0),
|
||||
last = focusable.eq(-1);
|
||||
|
||||
focusable.off('.zf.offcanvas').on('keydown.zf.offcanvas', function(e){
|
||||
if(e.which === 9 || e.keycode === 9){
|
||||
if(e.target === last[0] && !e.shiftKey){
|
||||
e.preventDefault();
|
||||
first.focus();
|
||||
}
|
||||
if(e.target === first[0] && e.shiftKey){
|
||||
e.preventDefault();
|
||||
last.focus();
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
/**
|
||||
* Allows the offcanvas to appear sticky utilizing translate properties.
|
||||
* @private
|
||||
*/
|
||||
// SlidingCanvas.prototype._stick = function(){
|
||||
// var elStyle = this.$element[0].style;
|
||||
//
|
||||
// if(this.options.closeOnClick){
|
||||
// var exitStyle = this.$exiter[0].style;
|
||||
// }
|
||||
//
|
||||
// $(window).on('scroll.zf.offcanvas', function(e){
|
||||
// console.log(e);
|
||||
// var pageY = window.pageYOffset;
|
||||
// elStyle.transform = 'translate(0,' + pageY + 'px)';
|
||||
// if(exitStyle !== undefined){ exitStyle.transform = 'translate(0,' + pageY + 'px)'; }
|
||||
// });
|
||||
// // this.$element.trigger('stuck.zf.offcanvas');
|
||||
// };
|
||||
/**
|
||||
* Closes the off-canvas menu.
|
||||
* @function
|
||||
* @param {Function} cb - optional cb to fire after closure.
|
||||
* @fires SlidingCanvas#closed
|
||||
*/
|
||||
SlidingCanvas.prototype.close = function(cb) {
|
||||
if(!this.$element.hasClass('is-open') || this.isRevealed){ return; }
|
||||
|
||||
var _this = this;
|
||||
|
||||
// Foundation.Move(this.options.transitionTime, this.$element, function(){
|
||||
$('[data-off-canvas-wrapper]').removeClass('is-off-canvas-open is-open-' + _this.options.position);
|
||||
_this.$element.removeClass('is-open');
|
||||
// Foundation._reflow();
|
||||
// });
|
||||
this.$element.attr('aria-hidden', 'true')
|
||||
/**
|
||||
* Fires when the off-canvas menu opens.
|
||||
* @event SlidingCanvas#closed
|
||||
*/
|
||||
.trigger('closed.zf.offcanvas');
|
||||
// if(_this.options.isSticky || !_this.options.forceTop){
|
||||
// setTimeout(function(){
|
||||
// _this.$element[0].style.transform = '';
|
||||
// $(window).off('scroll.zf.offcanvas');
|
||||
// }, this.options.transitionTime);
|
||||
// }
|
||||
|
||||
this.$lastTrigger.attr('aria-expanded', 'false');
|
||||
if(this.options.trapFocus){
|
||||
$('[data-off-canvas-content]').removeAttr('tabindex');
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Toggles the off-canvas menu open or closed.
|
||||
* @function
|
||||
* @param {Object} event - Event object passed from listener.
|
||||
* @param {jQuery} trigger - element that triggered the off-canvas to open.
|
||||
*/
|
||||
SlidingCanvas.prototype.toggle = function(event, trigger) {
|
||||
if (this.$element.hasClass('is-open')) {
|
||||
this.close(event, trigger);
|
||||
}
|
||||
else {
|
||||
this.open(event, trigger);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Handles keyboard input when detected. When the escape key is pressed, the off-canvas menu closes, and focus is restored to the element that opened the menu.
|
||||
* @function
|
||||
* @private
|
||||
*/
|
||||
SlidingCanvas.prototype._handleKeyboard = function(event) {
|
||||
if (event.which !== 27) return;
|
||||
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
this.close();
|
||||
this.$lastTrigger.focus();
|
||||
};
|
||||
/**
|
||||
* Destroys the offcanvas plugin.
|
||||
* @function
|
||||
*/
|
||||
SlidingCanvas.prototype.destroy = function(){
|
||||
this.close();
|
||||
this.$element.off('.zf.trigger .zf.offcanvas');
|
||||
this.$exiter.off('.zf.offcanvas');
|
||||
|
||||
// Foundation.unregisterPlugin(this);
|
||||
};
|
||||
|
||||
// Foundation.plugin(SlidingCanvas, 'SlidingCanvas');
|
||||
|
||||
// }(jQuery, Foundation);
|
||||
|
||||
$(function() {
|
||||
// $(document).foundation();
|
||||
|
||||
|
2
public/javascripts/spectacle.min.js
vendored
2
public/javascripts/spectacle.min.js
vendored
File diff suppressed because one or more lines are too long
@ -422,6 +422,17 @@
|
||||
border-radius: 4px;
|
||||
padding: 3px 6px;
|
||||
}
|
||||
/* line 41, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #logo {
|
||||
text-align: center;
|
||||
padding-right: 0.5rem;
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 0.25rem;
|
||||
}
|
||||
/* line 47, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #logo img {
|
||||
max-height: 70px;
|
||||
}
|
||||
/* line 26, ../../app/vendor/foundation/scss/grid/_classes.scss */
|
||||
#spectacle .row, #spectacle article .prop-row, #spectacle article .doc-row {
|
||||
max-width: 78.94737rem;
|
||||
@ -1598,7 +1609,7 @@
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
/* line 50, ../../app/stylesheets/_layout.scss */
|
||||
/* line 58, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #sidebar {
|
||||
padding-top: 1.5rem;
|
||||
padding-left: 1.5rem;
|
||||
@ -1614,15 +1625,14 @@
|
||||
top: 0;
|
||||
width: 250px;
|
||||
}
|
||||
/* line 65, ../../app/stylesheets/_layout.scss */
|
||||
/* line 73, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #sidebar h5 {
|
||||
margin: 1.5rem 0 0.75rem;
|
||||
margin: 1.5rem 0 0.65rem;
|
||||
text-transform: uppercase;
|
||||
color: #cacaca;
|
||||
color: #f68b1f;
|
||||
color: #b6b6b6;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
/* line 73, ../../app/stylesheets/_layout.scss */
|
||||
/* line 81, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #sidebar a {
|
||||
display: block;
|
||||
margin: 0 0 0.25rem;
|
||||
@ -1632,53 +1642,52 @@
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
/* line 83, ../../app/stylesheets/_layout.scss */
|
||||
/* line 91, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #sidebar a.active {
|
||||
color: #f68b1f;
|
||||
color: #2199e8;
|
||||
}
|
||||
/* line 90, ../../app/stylesheets/_layout.scss */
|
||||
/* line 98, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #sidebar ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
margin: 0 0 0.75rem 0.75rem;
|
||||
}
|
||||
/* line 97, ../../app/stylesheets/_layout.scss */
|
||||
/* line 105, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #sidebar section > ul {
|
||||
display: none;
|
||||
}
|
||||
/* line 102, ../../app/stylesheets/_layout.scss */
|
||||
/* line 110, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #sidebar section.expand > ul {
|
||||
display: block;
|
||||
}
|
||||
/* line 108, ../../app/stylesheets/_layout.scss */
|
||||
/* line 116, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #sidebar .close-button {
|
||||
opacity: 0.5;
|
||||
}
|
||||
/* line 117, ../../app/stylesheets/_layout.scss */
|
||||
/* line 125, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle .doc-content, #spectacle article h1.doc-title, #spectacle article > h1, #spectacle article > h2, #spectacle article .panel > h2, #spectacle article .panel > h3, #spectacle article .doc-copy, #spectacle article .doc-examples {
|
||||
padding-left: 2.25rem !important;
|
||||
padding-right: 2.25rem !important;
|
||||
}
|
||||
/* line 124, ../../app/stylesheets/_layout.scss */
|
||||
/* line 132, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle .doc-separator, #spectacle article h2 {
|
||||
margin-top: 2em;
|
||||
padding-top: 2em;
|
||||
padding-bottom: 2em;
|
||||
border-top: 1px solid #e2e2e2;
|
||||
}
|
||||
/* line 131, ../../app/stylesheets/_layout.scss */
|
||||
/* line 139, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #docs {
|
||||
background: #fefefe;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
/* line 136, ../../app/stylesheets/_layout.scss */
|
||||
/* line 144, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #docs .example-box {
|
||||
display: none;
|
||||
}
|
||||
@media screen and (min-width: 64em) {
|
||||
/* line 141, ../../app/stylesheets/_layout.scss */
|
||||
/* line 149, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle #docs .example-box {
|
||||
display: block;
|
||||
background-color: #23241f;
|
||||
@ -1688,32 +1697,32 @@
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
/* line 154, ../../app/stylesheets/_layout.scss */
|
||||
/* line 162, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article {
|
||||
position: relative;
|
||||
}
|
||||
/* line 157, ../../app/stylesheets/_layout.scss */
|
||||
/* line 165, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .no-description {
|
||||
color: #7a7a7a;
|
||||
}
|
||||
/* line 161, ../../app/stylesheets/_layout.scss */
|
||||
/* line 169, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article dt {
|
||||
color: #23241f;
|
||||
}
|
||||
/* line 165, ../../app/stylesheets/_layout.scss */
|
||||
/* line 173, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article table.table {
|
||||
width: 100%;
|
||||
}
|
||||
/* line 169, ../../app/stylesheets/_layout.scss */
|
||||
/* line 177, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article code {
|
||||
font-size: 0.85em;
|
||||
border-radius: 3px;
|
||||
}
|
||||
/* line 174, ../../app/stylesheets/_layout.scss */
|
||||
/* line 182, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article p:last-child:first-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
/* line 185, ../../app/stylesheets/_layout.scss */
|
||||
/* line 193, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article h1 {
|
||||
margin: 2.5rem 0 0;
|
||||
padding-top: 0.75rem;
|
||||
@ -1724,7 +1733,7 @@
|
||||
border-bottom: 1px solid #e2e2e2;
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
/* line 204, ../../app/stylesheets/_layout.scss */
|
||||
/* line 212, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article h1.doc-title {
|
||||
margin: 0;
|
||||
padding-top: 2.15rem;
|
||||
@ -1734,14 +1743,14 @@
|
||||
border: none;
|
||||
color: #515448;
|
||||
}
|
||||
/* line 214, ../../app/stylesheets/_layout.scss */
|
||||
/* line 222, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article h1.doc-title span {
|
||||
display: none;
|
||||
opacity: 0.65;
|
||||
margin-left: 5px;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* line 222, ../../app/stylesheets/_layout.scss */
|
||||
/* line 230, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article h2 {
|
||||
margin-bottom: 0;
|
||||
padding-left: 2.25rem;
|
||||
@ -1754,101 +1763,101 @@
|
||||
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));
|
||||
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));
|
||||
}
|
||||
/* line 236, ../../app/stylesheets/_layout.scss */
|
||||
/* line 244, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article h3 {
|
||||
margin: 0rem 0 0.75rem;
|
||||
}
|
||||
/* line 244, ../../app/stylesheets/_layout.scss */
|
||||
/* line 252, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article h1 + .panel > h2 {
|
||||
margin-top: 0;
|
||||
border-top: none;
|
||||
}
|
||||
/* line 249, ../../app/stylesheets/_layout.scss */
|
||||
/* line 257, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article h1 + .tag-description + .panel > h2 {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
/* line 253, ../../app/stylesheets/_layout.scss */
|
||||
/* line 261, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article h1 + .panel h3 {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
/* line 260, ../../app/stylesheets/_layout.scss */
|
||||
/* line 268, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .panel {
|
||||
position: relative;
|
||||
}
|
||||
/* line 274, ../../app/stylesheets/_layout.scss */
|
||||
/* line 282, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .prop-row {
|
||||
padding-top: 0.75em;
|
||||
padding-bottom: 0.75em;
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
/* line 283, ../../app/stylesheets/_layout.scss */
|
||||
/* line 291, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .prop-row:first-child, #spectacle article .prop-row.prop-group {
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
/* line 287, ../../app/stylesheets/_layout.scss */
|
||||
/* line 295, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .prop-row .prop-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
/* line 291, ../../app/stylesheets/_layout.scss */
|
||||
/* line 299, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .prop-row .prop-name {
|
||||
text-align: right;
|
||||
padding-right: 0.85rem !important;
|
||||
word-break: break-word;
|
||||
}
|
||||
/* line 299, ../../app/stylesheets/_layout.scss */
|
||||
/* line 307, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .prop-row .prop-value {
|
||||
padding-left: 0.85rem !important;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
/* line 306, ../../app/stylesheets/_layout.scss */
|
||||
/* line 314, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .prop-row.prop-inner {
|
||||
padding-top: 0.5em;
|
||||
padding-bottom: 0.5em;
|
||||
font-size: 90%;
|
||||
}
|
||||
/* line 312, ../../app/stylesheets/_layout.scss */
|
||||
/* line 320, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .prop-row.prop-inner .prop-name {
|
||||
color: #7a7a7a;
|
||||
}
|
||||
/* line 321, ../../app/stylesheets/_layout.scss */
|
||||
/* line 329, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .doc-row {
|
||||
margin: 2rem 0 20px;
|
||||
}
|
||||
/* line 338, ../../app/stylesheets/_layout.scss */
|
||||
/* line 346, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .doc-examples {
|
||||
padding-left: 2.25rem !important;
|
||||
padding-right: 2.25rem !important;
|
||||
color: #fefefe;
|
||||
background-color: #23241f;
|
||||
}
|
||||
/* line 348, ../../app/stylesheets/_layout.scss */
|
||||
/* line 356, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .doc-examples h5 {
|
||||
color: #fefefe;
|
||||
font-size: 1rem;
|
||||
opacity: 0.8;
|
||||
}
|
||||
/* line 354, ../../app/stylesheets/_layout.scss */
|
||||
/* line 362, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .doc-examples h5 span {
|
||||
opacity: 0.5;
|
||||
}
|
||||
@media screen and (max-width: 63.9375em) {
|
||||
/* line 361, ../../app/stylesheets/_layout.scss */
|
||||
/* line 369, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .doc-examples:not(:empty) {
|
||||
margin-top: 1.5rem;
|
||||
padding-top: 1.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
/* line 372, ../../app/stylesheets/_layout.scss */
|
||||
/* line 380, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .powered-by {
|
||||
font-size: 90%;
|
||||
color: #cacaca;
|
||||
}
|
||||
/* line 377, ../../app/stylesheets/_layout.scss */
|
||||
/* line 385, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .powered-by span {
|
||||
color: #f68b1f;
|
||||
}
|
||||
/* line 386, ../../app/stylesheets/_layout.scss */
|
||||
/* line 394, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .operation .operation-tags {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -1856,21 +1865,21 @@
|
||||
right: 0;
|
||||
}
|
||||
@media screen and (min-width: 64em) {
|
||||
/* line 395, ../../app/stylesheets/_layout.scss */
|
||||
/* line 403, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .operation .operation-tags {
|
||||
right: 50%;
|
||||
}
|
||||
}
|
||||
/* line 399, ../../app/stylesheets/_layout.scss */
|
||||
/* line 407, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle article .operation .operation-path {
|
||||
word-break: break-all;
|
||||
}
|
||||
/* line 408, ../../app/stylesheets/_layout.scss */
|
||||
/* line 416, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle .hljs {
|
||||
padding: 0 !important;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
/* line 412, ../../app/stylesheets/_layout.scss */
|
||||
/* line 420, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle .hljs pre {
|
||||
line-height: 1.25;
|
||||
padding: 1.5rem 2rem;
|
||||
@ -1883,7 +1892,7 @@
|
||||
word-break: normal;
|
||||
word-spacing: normal;
|
||||
}
|
||||
/* line 427, ../../app/stylesheets/_layout.scss */
|
||||
/* line 435, ../../app/stylesheets/_layout.scss */
|
||||
#spectacle .hljs code {
|
||||
font-family: Consolas,"Liberation Mono",Courier,monospace;
|
||||
font-weight: inherit;
|
||||
|
2
public/stylesheets/spectacle.min.css
vendored
2
public/stylesheets/spectacle.min.css
vendored
File diff suppressed because one or more lines are too long
BIN
test/fixtures/cheese.png
vendored
Executable file
BIN
test/fixtures/cheese.png
vendored
Executable file
Binary file not shown.
After Width: | Height: | Size: 11 KiB |
BIN
test/fixtures/cheese1.png
vendored
Executable file
BIN
test/fixtures/cheese1.png
vendored
Executable file
Binary file not shown.
After Width: | Height: | Size: 9.6 KiB |
BIN
test/fixtures/cheese2.png
vendored
Executable file
BIN
test/fixtures/cheese2.png
vendored
Executable file
Binary file not shown.
After Width: | Height: | Size: 6.8 KiB |
Loading…
Reference in New Issue
Block a user