diff --git a/static/favicon.ico b/static/favicon.ico new file mode 100644 index 0000000..7a0a2e3 Binary files /dev/null and b/static/favicon.ico differ diff --git a/static/index.css b/static/index.css new file mode 100644 index 0000000..3f69d51 --- /dev/null +++ b/static/index.css @@ -0,0 +1,210 @@ +@font-face { + font-family: 'OpenSans'; + src: url('/fonts/OpenSans-Regular.ttf'); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: 'OpenSans'; + src: url('/fonts/OpenSans-Italic.ttf'); + font-weight: normal; + font-style: italic; +} +@font-face { + font-family: 'OpenSans'; + src: url('/fonts/OpenSans-Bold.ttf'); + font-weight: bold; + font-style: normal; +} + +body{ + background-color: #fff; + color: #212121; + font-family:'OpenSans', sans-serif, Arial; + font-size: 14px; + margin:0; + background-repeat:no-repeat !important; + background-size: contain !important; + background-image: url(/images/header-map-1280px.png); +} +a{ + color: #499DCE; + transition: color .2s; +} +a:hover { + color: #395D73; +} +.title { + font-weight: bold; + font-size: 32px; + text-align:center; + margin:20px 0 0 0; + position:relative; +} +.title.light:after { + content: "light"; + display: block; + position: absolute; + left: 50%; + bottom: -5px; + color: #499DCE; + font-size:.8em; +} +section { + margin: 15px auto; + width: 930px; + padding: 30px 0; +} +.title img { + width: 290px; +} +.subtitle { + font-size: 20px; + font-style: italic; + font-weight:normal; + text-align:center; + margin:10px 0 10px 0; +} +.box-header { + text-align:left; + text-transform:uppercase; + border:1px solid #ededed; + margin:25px 0 0 0; + padding:12px 30px; + font-size:20px; + background:#fff; +} +.item { + background:#fff; + height: 191px; + border: 1px solid #ededed; + border-top:none; +} +.item:nth-child(odd) { + background-color:#fbfbfb; +} +.item img { + position: absolute; + display: block; + margin: 30px; + width: 128px; + height: 128px; + border: 1px solid #ccc; +} +.icon img { + position: relative; + width: 16px; + height: 16px; + display: inline; + margin: 0 3px -3px 0; + border: 0; + padding: 0; +} +.details { + float:left; + height: 128px; + padding: 20px 30px 20px 188px; +} +.details h3 { + font-size:18px; + margin-top: 25px; +} +.details p { + padding:0; + margin:18px 0; +} +.viewers { + float:right; + text-align:center; + width: 120px; + margin-top: 25px; + padding-right: 30px; +} +.btn { + display:block; + margin: 0; + line-height: 36px; +} +.btn:first-child { + position: relative; + padding: 0; + overflow: hidden; + border-radius:4px; + background-color: #499DCE; + background: linear-gradient(90deg, #5aaad8, #4a9ecf); + color: #fff; + text-decoration: none; + font-weight: bold; +} +.btn:first-child:hover { + background: #395D73; +} +footer { + width:100%; + border-top:1px solid #ededed; + text-align:center; + color:#b3b3b3; + padding-top:10px; + font-size:12px; +} +footer img { + width: 113px; + height: 31px; +} +footer .t { + display:none; +} +footer p { + margin-top:0; +} +footer a { + text-decoration: none; +} +.details h3, .identifier { + max-width: 550px; + word-break: break-all; +} + +/* Responsive */ +@media (max-width: 950px) { + section{ + margin: 0; + width: 96%; + padding: 2%; + } +} +@media (max-width: 600px) { + .title{ + margin: 25px 0 0 0; + } + .title.light:after { + font-size:.6em; + } + .title img { + width: 200px; + } + .subtitle { + font-size: 20px; + margin: 0 0 35px 0; + } + .item { + height: 245px; + } + .viewers { + float: left; + text-align: left; + width: 100%; + margin-left: 30px; + margin-top: 15px; + } + .viewers a { + display: inline-block; + vertical-align: middle; + } + .btn { + margin: 0 20px 0 0; + } + .btn:first-child { + padding: 0 20px; + } +} diff --git a/static/index.html b/static/index.html new file mode 100644 index 0000000..429d71a --- /dev/null +++ b/static/index.html @@ -0,0 +1,59 @@ + + +
+ + +OpenMapTiles vector tiles as used by OSM Americana.
+
Rendered on servers provided by OSMUS.
+
Zoom 13 building merge is disabled, additional languages from Wikidata.
+
Schema © OpenMapTiles, map data © OpenStreetMap contributors.
+ services: TileJSON | Build Status +
+65535)e(new Error("glyphs > 65535 not supported"));else if(a.ranges[s])e(null,{stack:i,id:o,glyph:n});else {var l=a.requests[s];l||(l=a.requests[s]=[],f.loadGlyphRange(i,s,r.url,r.requestManager,(function(t,e){if(e){for(var i in e)r._doesCharSupportLocalGlyph(+i)||(a.glyphs[+i]=e[+i]);a.ranges[s]=!0;}for(var o=0,n=l;ol&&(r=l-y);}void 0===r&&void 0===o||(this.center=this.unproject(new t.pointGeometry(void 0!==r?r:d.x,void 0!==o?o:d.y)).wrap()),this._unmodified=h,this._constraining=!1;}},tr.prototype._calcMatrices=function(){if(this.height){var e=this.centerOffset,i=this.point.x,r=this.point.y;this.cameraToCenterDistance=.5/Math.tan(this._fov/2)*this.height,this._pixelPerMeter=t.mercatorZfromAltitude(1,this.center.lat)*this.worldSize;var o=t.identity(new Float64Array(16));t.scale(o,o,[this.width/2,-this.height/2,1]),t.translate(o,o,[1,-1,0]),this.labelPlaneMatrix=o,o=t.identity(new Float64Array(16)),t.scale(o,o,[1,-1,1]),t.translate(o,o,[-1,-1,0]),t.scale(o,o,[2/this.width,2/this.height,1]),this.glCoordMatrix=o,this.cameraToSeaLevelDistance=this.cameraToCenterDistance+this._elevation*this._pixelPerMeter/Math.cos(this._pitch);var a=Math.PI/2+this._pitch,n=this._fov*(.5+e.y/this.height),s=Math.sin(n)*this.cameraToSeaLevelDistance/Math.sin(t.clamp(Math.PI-a-n,.01,Math.PI-.01)),l=this.getHorizon(),c=2*Math.atan(l/this.cameraToCenterDistance)*(.5+e.y/(2*l)),h=Math.sin(c)*this.cameraToSeaLevelDistance/Math.sin(t.clamp(Math.PI-a-c,.01,Math.PI-.01)),u=Math.cos(Math.PI/2-this._pitch)*s+this.cameraToSeaLevelDistance,p=Math.cos(Math.PI/2-this._pitch)*h+this.cameraToSeaLevelDistance,d=1.01*Math.min(u,p),_=this.height/50;o=new Float64Array(16),t.perspective(o,this._fov,this.width/this.height,_,d),o[8]=2*-e.x/this.width,o[9]=2*e.y/this.height,t.scale(o,o,[1,-1,1]),t.translate(o,o,[0,0,-this.cameraToCenterDistance]),t.rotateX(o,o,this._pitch),t.rotateZ(o,o,this.angle),t.translate(o,o,[-i,-r,0]),this.mercatorMatrix=t.scale([],o,[this.worldSize,this.worldSize,this.worldSize]),t.scale(o,o,[1,1,this._pixelPerMeter]),this.pixelMatrix=t.multiply(new Float64Array(16),this.labelPlaneMatrix,o),t.translate(o,o,[0,0,-this.elevation]),this.projMatrix=o,this.invProjMatrix=t.invert([],o),this.pixelMatrix3D=t.multiply(new Float64Array(16),this.labelPlaneMatrix,o);var f=this.width%2/2,m=this.height%2/2,g=Math.cos(this.angle),v=Math.sin(this.angle),y=i-Math.round(i)+g*f+v*m,x=r-Math.round(r)+g*m+v*f,b=new Float64Array(o);if(t.translate(b,b,[y>.5?y-1:y,x>.5?x-1:x,0]),this.alignedProjMatrix=b,!(o=t.invert(new Float64Array(16),this.pixelMatrix)))throw new Error("failed to invert matrix");this.pixelMatrixInverse=o,this._posMatrixCache={},this._alignedPosMatrixCache={};}},tr.prototype.maxPitchScaleFactor=function(){if(!this.pixelMatrixInverse)return 1;var e=this.pointCoordinate(new t.pointGeometry(0,0)),i=[e.x*this.worldSize,e.y*this.worldSize,0,1];return t.transformMat4(i,i,this.pixelMatrix)[3]/this.cameraToCenterDistance},tr.prototype.getCameraPoint=function(){var e=Math.tan(this._pitch)*(this.cameraToCenterDistance||1);return this.centerPoint.add(new t.pointGeometry(0,e))},tr.prototype.getCameraQueryGeometry=function(e){var i=this.getCameraPoint();if(1===e.length)return [e[0],i];for(var r=i.x,o=i.y,a=i.x,n=i.y,s=0,l=e;s