Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Snowboard bootstrap template
<div class="row">
<div class="col-md-3">
{{template "Navigation" .}}
</div>
<div class="col-md-9">
{{template "ResourceGroups" .}}
</div>
</div>
{{define "Navigation"}}
<div class="list-group">
{{range $groupN, $group := .ResourceGroups}}
{{if $group.Title}}
<div class="list-group-item list-group-item-action">
<div class="ui horizontal divider">
<a href="#{{$group.Title | parameterize}}">{{$group.Title}}</a>
</div>
</div>
{{end}}
<div class="list-group-item list-group-item-action">
<div class="ui accordion fluid">
{{range $resourceN, $resource := $group.Resources}}
{{if $resource.Transitions}}
<div class="title {{if eq $resourceN 0}}active{{end}}">
<i class="dropdown icon"></i>
{{if $resource.Title}}
<strong>{{$resource.Title}}</strong>
{{else}}
<strong>{{$resource.Href.Path}}</strong>
{{end}}
</div>
<div class="content-menu {{if eq $resourceN 0}}active{{end}}">
<div class="ui fluid secondary vertical menu">
{{range $transitionN, $transition := $resource.Transitions}}
<a class="item {{$transition.Method | colorize}}" href="#{{$transition.Permalink}}">
<i class="ui {{$transition.Method | colorize}} empty circular label"></i>
{{if $transition.Title}}
<span>{{$transition.Title}}</span>
{{else}}
<span>{{$transition.Method}}</span>
{{end}}
</a>
{{end}}
</div>
</div>
{{end}}
{{end}}
</div>
</div>
{{end}}
</div>
{{end}}
{{define "Introduction"}}
{{end}}
{{define "ResourceGroups"}}
{{range $groupN, $group := .ResourceGroups}}
<div class="ui header center aligned">
<div class="ui header">
<div class="sub header">
{{$group.Description | markdownize}}
</div>
</div>
</div>
{{range $resourceN, $resource := $group.Resources}}
{{if $resource.Transitions}}
<div class="ui stacked segments">
<div class="ui basic segment resource">
<div class="ui purple huge ribbon label">
{{if $resource.Title}}{{$resource.Title}}{{else}}{{$resource.Href.Path}}{{end}}
</div>
<div class="ui header">
<div class="ui sub header">
{{$resource.Description | markdownize}}
</div>
</div>
</div>
{{range $transitionN, $transition := $resource.Transitions}}
{{template "Divider"}}
<div class="ui basic segment">
<h3 class="ui block center aligned header" id="{{$transition.Permalink}}">
{{if $transition.Title}}{{$transition.Title}}{{else}}{{$transition.Method}}{{end}}
</h3>
<div class="description">{{$transition.Description | markdownize}}</div>
{{range $transactionN, $transaction := $transition.Transactions}}
<h4 class="ui horizontal divider">
REQUEST{{if $transaction.Request.Title}} {{$transaction.Request.Title}}{{end}}
</h4>
<div class="description">{{$transaction.Request.Description | markdownize}}</div>
<div class="fluid ui large labeled button">
<div class="ui {{$transaction.Request.Method | colorize}} large button">
<h3>{{$transaction.Request.Method}}</h3>
</div>
<a class="ui basic fluid request-url {{$transaction.Request.Method | colorize}} label">
<code>{{$transition.URL}}</code>
</a>
</div>
{{ if or (ne (len $transition.Href.Parameters) 0) (ne (len $resource.Href.Parameters) 0)}}
<table class="ui celled definition table">
<thead>
<tr>
<th colspan="4">Parameters</th>
</tr>
<thead>
<tbody>
{{if $transition.Href.Parameters}}
{{template "Parameters" $transition.Href.Parameters}}
{{end}}
{{if $resource.Href.Parameters}}
{{template "Parameters" $resource.Href.Parameters}}
{{end}}
</tbody>
</table>
{{end}}
{{if $transaction.Request.Headers}}
{{template "Headers" $transaction.Request.Headers}}
{{end}}
{{if ne $transaction.Request.Body.Body ""}}
<div class="ui stacked segment">
<div class="ui fluid transaction accordion">
<div class="title">
<code>{{$transaction.Request.Body.ContentType}}</code>
</div>
<div class="content tabbed">
<div class="ui top attached tabular menu">
<a data-tab="body" class="active item">BODY</a>
<a data-tab="schema" class="item">SCHEMA</a>
</div>
<div class="ui bottom attached active tab segment" data-tab="body">
<pre style="white-space: inherit">
<code class="language-{{alias $transaction.Request.Body.ContentType}}">{{$transaction.Request.Body.Body}}</code>
</pre>
</div>
<div class="ui bottom attached tab segment" data-tab="schema">
<pre style="white-space: inherit">
<code class="language-json">{{$transaction.Request.Schema.Body}}</code>
</pre>
</div>
</div>
</div>
</div>
{{end}}
<h4 class="ui horizontal divider">RESPONSE</h4>
<div class="description">{{$transaction.Response.Description | markdownize}}</div>
{{template "Headers" $transaction.Response.Headers}}
<div class="ui stacked {{$transaction.Response.StatusCode | colorize}} segment">
<div class="ui fluid transaction accordion">
<div class="title center aligned">
<a class="ui {{$transaction.Response.StatusCode | colorize}} circular label">
{{$transaction.Response.StatusCode}}
</a>
<code>{{$transaction.Response.Body.ContentType}}</code>
</div>
<div class="content tabbed">
<div class="ui top attached tabular menu">
<a data-tab="body" class="active item">BODY</a>
<a data-tab="schema" class="item">SCHEMA</a>
</div>
<div class="ui bottom attached active tab segment" data-tab="body">
<pre style="white-space: inherit">
<code class="language-{{alias $transaction.Response.Body.ContentType}}">{{$transaction.Response.Body.Body}}</code>
</pre>
</div>
<div class="ui bottom attached tab segment" data-tab="schema">
<pre style="white-space: inherit">
<code class="language-json">{{$transaction.Response.Schema.Body}}</code>
</pre>
</div>
</div>
</div>
</div>
{{end}}
</div>
{{end}}
</div>
<div class="ui hidden divider"></div>
{{end}}
{{end}}
{{end}}
{{end}}
{{define "Headers"}}
<table class="ui celled definition table">
<thead>
<tr>
<th colspan="2">Headers</th>
</tr>
</thead>
<tbody>
{{range $index, $header := .}}
<tr>
<td class="four wide">{{.Key}}</td>
<td><code>{{.Value}}</code></td>
</tr>
{{end}}
</tbody>
</table>
{{end}}
{{define "Parameters"}}
{{range $index, $param := .}}
<tr>
<td class="center aligned one wide">
<i class="ui empty circular label {{if eq .Required true}}black{{else}}grey{{end}}" data-content="{{if eq .Required true}}required{{else}}optional{{end}}" data-position="top center"></i>
</td>
<td><code>{{.Key}}</code></td>
<td class="center aligned">
<code>{{.Kind}}</code>
{{if .Value}}<code class="ui label">{{.Value}}</code>{{end}}
{{if .Default}}<div class="ui violet image label">Default<div class="detail">{{.Default}}</div></div>{{end}}
</td>
<td class="eight wide">
{{if .Description}}{{.Description | markdownize}}{{else}}-{{end}}
{{if .Members}}
<ul class="ui bulleted list">
{{range .Members}}
<li class="item">{{.}}</li>
{{end}}
</ul>
{{end}}
</td>
</tr>
{{end}}
{{end}}
{{define "Divider"}}
<div class="ui grey horizontal small divider header">
<i class="ui grey micro circular label"></i>
<i class="ui pink micro circular label"></i>
<i class="ui grey micro circular label"></i>
</div>
{{end}}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment