Skip to content

Instantly share code, notes, and snippets.

@wrumsby

wrumsby/dabblet.css

Created February 2, 2016 04:40
Show Gist options
  • Save wrumsby/9b1485cc6b5b3c55d870 to your computer and use it in GitHub Desktop.
Save wrumsby/9b1485cc6b5b3c55d870 to your computer and use it in GitHub Desktop.
Download ZIP
The first commented line is your dabblet’s title
Raw
dabblet.css
/**
* The first commented line is your dabblet’s title
*/
#mobile {
max-width: 240px;
}
#mobile.xui-u-flex {
flex-direction: column;
align-items: center;
justify-content: center;
}
#mobile .xui-u-flex-col {
width: 100%;
margin: 8px;
padding: 0;
text-align: center;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<link rel="stylesheet" href="https://edge.xero.com/style/xui/9.7.0/xui.css"/>
<div class="xui-pagecontainer">
<div class="xui-panel xui-u-flex">
<div class="xui-u-flex-col xui-u-flex-grow">
<button class="xui-button xui-unstyledbutton">Keep all client records separate</button>
</div>
<button class="xui-button xui-u-flex-col">Cancel</button>
<button class="xui-button xui-button-main xui-u-flex-col">Merge All Data</button>
</div>
<div class="xui-panel xui-u-flex" id="mobile">
<div class="xui-u-flex-col xui-u-flex-grow">
<button class="xui-button xui-unstyledbutton">Keep all client records separate</button>
</div>
<button class="xui-button xui-u-flex-col">Cancel</button>
<button class="xui-button xui-button-main xui-u-flex-col">Merge All Data</button>
</div>
</div>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment