Fabio/tileserver-gl
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Responsive CSS for the web page #33

Browse source
This commit is contained in:
Dalibor Janák 2016-07-27 14:05:33 +02:00
parent b257855e38
commit b048990e14
4 changed files with 40 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
public/resources/index.css
View file

@ -79,6 +79,7 @@ section{
}
.details {
float:left;
width: 50%;
}
.details h3 {
font-size:18px;
@ -153,3 +154,39 @@ body {
background-image: url(/images/header-map-2560px.png);
}
}
/* Responsive */
@media (max-width: 950px) {
section{
margin: 0;
width: 96%;
padding: 2%;
}
}
@media (max-width: 550px) {
.title{
margin: 25px 0 0 0;
}
.title img{
width: 200px;
}
.subtitle{
font-size: 20px;
margin: 0 0 35px 0;
}
.item{
height: 245px;
padding: 205px 30px 30px 30px;
}
.item img{
width: 192px;
height: 192px;
margin: -185px 0 0 0;
}
.details,.viewers{
width: 100%;
}
.viewers a{
width: 120px;
}
}

1
public/templates/data.tmpl
View file

@ -2,6 +2,7 @@
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{name}} - TileServer GL</title>
{{#is_vector}}
<link rel="stylesheet" type="text/css" href="/mapbox-gl.css{{&key_query}}" />

1
public/templates/index.tmpl
View file

@ -2,6 +2,7 @@
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>TileServerGL</title>
<link rel="stylesheet" type="text/css" href="/index.css{{&key_query}}" />
</head>

1
public/templates/viewer.tmpl
View file

@ -2,6 +2,7 @@
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{name}} - TileServer GL</title>
<link rel="stylesheet" type="text/css" href="/mapbox-gl.css{{&key_query}}" />
<script src="/mapbox-gl.js{{&key_query}}"></script>