sourcey/spectacle
1
1
Fork 0
mirror of https://github.com/sourcey/spectacle.git synced 2024-09-11 05:25:36 +03:00
Code Issues Projects Releases Wiki Activity

Add custom logo support

Browse Source 
Improve documentation
This commit is contained in:
Kam 2016-02-07 14:28:19 +10:00
parent bf38d7bba8
commit 62532efa0a
18 changed files with 2880 additions and 3205 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
README.md
View File

@ -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.

8
app/lib/config.js
View File

@ -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: {

21
app/lib/preprocessor.js
View File

@ -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".

16
app/stylesheets/_layout.scss
View File

@ -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;
}

31
app/views/main.hbs
View File

@ -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>

3
app/views/partials/swagger/definitions.hbs
View File

@ -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" }}

8
bin/spectacle-cli.js
View File

@ -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');

3
package.json
View File

@ -49,5 +49,8 @@
"lodash": "*",
"marked": "*",
"trace": "^1.1.0"
},
"devDependencies": {
"grunt-contrib-copy": "^0.8.2"
}
}

BIN
public/images/cheese.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
public/images/cheese1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

5490
public/index.html
View File

File diff suppressed because it is too large Load Diff

372
public/javascripts/spectacle.js
View File

@ -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
View File

File diff suppressed because one or more lines are too long

113
public/stylesheets/spectacle.css
View File

@ -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
View File

File diff suppressed because one or more lines are too long

BIN
test/fixtures/cheese.png vendored Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
test/fixtures/cheese1.png vendored Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

BIN
test/fixtures/cheese2.png vendored Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.8 KiB