AJ Johnson SaucyJack

SaucyJack / app.css

Last active June 7, 2018 22:02 — forked from gist-master/app.css

Bootstrap v4 Column Widths

	.customer-photo {
	display: inline-block;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background-size: 32px 35px;
	background-position: center center;
	vertical-align: middle;
	line-height: 32px;
	box-shadow: inset 0 0 1px #999, inset 0 0 10px rgba(0,0,0,.2);

SaucyJack / app.html

Last active June 5, 2018 01:27 — forked from gist-master/app.html

DropDownList - Width

	<template>
	<require from="aurelia-kendoui-bridge/dropdownlist/dropdownlist"></require>

	<div id="example">
	<div id="cap-view" class="demo-section k-content">
	<h4>Customize your Kendo Cap</h4>
	<div ref="cap" id="cap" class="black-cap"></div>
	<h4>Cap Color</h4>
	<ak-drop-down-list k-data-text-field="text"
	k-data-value-field="value"

SaucyJack / app.html

Last active May 21, 2018 21:16 — forked from jdanyow/app.html

Router-Slot-Router

	<template>
	<h1>${message}</h1>
	<!-- https://gist.github.com/jdanyow/1ae985e6c943885496e8 -->
	</template>

SaucyJack / app.html

Last active January 23, 2018 21:32

Aurelia computedFrom

	<template>
	<h1>It's computedFrom!</h1>
	<select value.bind="selectedRoute" change.delegate="routeChanged()">
	<option repeat.for="x of router.navigation" value.bind="x.config.name" model.bind="x.config.name">
	${x.title}
	</option>
	</select>
	<router-view></router-view>
	</template>

SaucyJack / app.html

Last active November 13, 2017 21:03 — forked from gist-master/app.html

Datepicker: range selection

	<template>
	<require from="aurelia-kendoui-bridge/datepicker/datepicker"></require>
	<require from="aurelia-kendoui-bridge/common/template"></require>
	<ak-template id="footerTemplate">
	<button type="button">Click me</button>
	</ak-template>
	<div id="example">
	<div class="demo-section k-content">
	<h4>Start date:</h4>
	<input ak-datepicker="k-value.bind : '10/10/2011';

SaucyJack / app.html

Last active September 7, 2017 18:31

composed dynamic drop-down construction

	<template>
	<h3>App.js</h3>
	<div style="border: 1px inset; padding: 5px;">
	<compose view-model="./generic-group-by" model.two-way="model"></compose>
	</div>
	<br />
	<div>
	<h4>This is all in the parent</h4>
	Selected Value: ${model.selectedValue} <br />
	</div>

SaucyJack / app.html

Last active August 31, 2017 21:46

Editor: basic usage

	<template>
	<require from="pie-chart"></require>
	<h3>App.js</h3>
	<pie-chart some-arg="someValue"></pie-chart>
	</template>

SaucyJack / app.html

Last active August 1, 2017 20:22

JSON Routes

	<template>
	<nav>
	<ul>
	<li repeat.for="x of router.navigation">
	<a href.bind="x.href">${x.title}</a>
	</li>
	</ul>
	</nav>
	<router-view></router-view>
	</template>

SaucyJack / app.html

Last active February 18, 2020 23:06

Layout-Menu-Loading

	<template>
	<nav>
	<ul>
	<li repeat.for="x of router.navigation">
	<a href.bind="x.href">${x.title}</a>
	</li>
	</ul>
	</nav>
	<router-view></router-view>
	</template>

SaucyJack / app.html

Last active February 18, 2020 23:08

Bootstrap-Sandbox

	<template>
	<h4>Bootstrap Radio Button Groups and Aurelia</h4>
	<div class="container">
	<div class="row">
	<div class="btn-group" data-toggle="buttons">
	<h5>Fancy Bootstrapped Radio Buttons</h5>
	<label repeat.for="option of options"
	class="btn btn-sm btn-default ${option.value === selectedOption.value ? 'active' : ''}">
	<input type="radio"
	name="bootstrapOptions"