<body> | |
<div class="lightbox-blanket"> | |
<div class="pop-up-container"> | |
<div class="pop-up-container-vertical"> | |
<div class="pop-up-wrapper"> | |
<div class="phone-wrapper"> | |
<div class="phone-pad"> | |
<div class="phone-pad-input-panel"> | |
<div class="phone-pad-input-add"><i class="fa fa-plus"></i></div> | |
<div class="phone-pad-input-text"> |
<link rel="import" href="../paper-calculator/paper-calculator.html"> | |
<polymer-element name="my-element"> | |
<template> | |
<style> | |
:host { | |
position: absolute; | |
width: 100%; | |
height: 100%; |
<p>https://github.com/jeromeetienne/jquery-qrcode (呈现表)</p> | |
<div id="qrcodeTable"></div> | |
<p>http://jeromeetienne.github.io/jquery-qrcode (渲染画布)</p> | |
<div id="qrcodeCanvas"></div> |
<div id="wrapper"> | |
<nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0"> | |
<div class="navbar-header"> | |
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> | |
<span class="sr-only">切换导航</span> | |
<span class="icon-bar"></span> | |
<span class="icon-bar"></span> | |
<span class="icon-bar"></span> | |
</button> |
Leaflet controls using components from Google's material design lite framework (www.getmdl.io).
Includes zoom, fullscreen toggle, layer selector and geocode search controls.
Get all the controls packaged together in the following repository: https://github.com/christippett/leaflet-material
I came across this Dribbble shot a little while back and thought it'd be fun to build out for myself. Yes, I am aware there's already a Mac app for it.
I used knockout.js to let the data control the markup, and used currentColor
to make the styles a little more elegant. I also added in clipboard.js to make it nice and easy to grab colors.
Suggestions welcome! Especially for how to make the "copy to clipboard" part a little more interesting, as well as any ways to improve/automate text contrast on some of the darker colors.