Files
iD/css/app.css
2012-11-05 14:57:21 -05:00

260 lines
4.1 KiB
CSS

body {
font:normal 13px/20px Helvetica, Arial, sans-serif;
margin:0;
padding:0;
text-rendering: optimizeLegibility;
color:#444;
}
#map {
display:block;
position:absolute;
top:40px;
left:0;
right:0;
bottom:0;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAI0lEQVQIW2NkYGD4f+/ePSAFAYxAzn84D1lASUmJAaQSQwUAcxYRaXDVJ6QAAAAASUVORK5CYII=);
}
#about {
position:absolute;
bottom:5px;
right:5px;
background:#fff;
padding:2px 5px;
}
#bar {
background:#222;
position:absolute;
left:0px;
top:0px;
height:40px;
right:0;
}
#geocode-location {
position:absolute;
background:#555;
color:#fff;
}
:focus {
outline-color: transparent;
outline-style: none;
}
p {
margin:0;
padding:0;
font-size: x-small;
}
a:visited, a {
color: #345692;
}
input[type=text] {
font:normal 13px/20px Helvetica, Arial, sans-serif;
padding:1px 2px;
}
input[type=text]:focus {
border-color:#222;
}
text {
-webkit-user-select: none;
-moz-user-select: none;
}
table {
border-collapse: collapse;
border-spacing:0;
}
table th {
text-align:left;
}
table td {
padding:0;
border-spacing:0;
}
.help-pane {
position:absolute;
left:0;
width:300px;
opacity:0.9;
top:40px;
background:#FFFBD3;
}
.help-pane div {
padding:10px;
font-style:italic;
}
#zoombuttons {
position:absolute;
right:20px;
top:20px;
}
#addPOI {
display:none;
}
#bar button {
width:100px;
white-space:nowrap;
cursor:pointer;
display:inline-block;
background:#222222;
color:#999;
font:bold 19px/30px 'Helvetica Neue', sans-serif;
border:0;
border-right:1px solid #222;
padding:0 10px;
height:40px;
margin:0;
}
#bar button:hover {
background:#333;
}
#bar button.active {
background:#000;
color:#fff;
}
#bar button.mini,
#bar button.mini {
width:auto;
}
button small {
display: inline-block;
font-weight: normal;
font-size: 12px;
line-height: 30px;
vertical-align: top;
}
#bar input[type=text] {
width:150px;
height:30px;
border:0;
padding:5px;
margin:0;
}
.zoombuttons {
position:absolute;
right:0;
top:0;
}
#bar .zoombuttons button {
width:50px;
background:#333333;
color:#fff;
}
.inspector-wrap {
position:absolute;
top:40px;
right:00px;
overflow:auto;
padding:10px;
background:#222222;
border-top:1px solid #000;
color:#fff;
}
.inspector-wrap h2 {
font: normal 20px/20px 'Helvetica';
}
.inspector-wrap a.permalink {
text-decoration:none;
margin-right:1em;
font: normal 11px/20px 'Helvetica'
}
.inspector thead th {
font-size:10px;
line-height:15px;
color:#999;
font-weight:normal;
text-transform:uppercase;
}
.inspector tbody td {
border: 1px solid #ccc;
}
.inspector input {
margin:0;
padding:4px;
border:0;
background:#fff;
width:150px;
}
.inspector input.tag-key {
}
.inspector input.tag-value {
}
.presets h3 {
padding: 5px 10px;
font: normal 13px/15px Helvetica, Arial, sans-serif;
text-align:center;
margin: 0;
}
.presets a.preset-option {
text-decoration:none;
display:block;
background:#eee;
padding:5px 10px;
border-top:1px solid #ccc;
}
.presets a.preset-option span {
display:block;
color: #888;
font: normal 11px/15px Helvetica, Arial, sans-serif;
}
#progress {
position:absolute;
left:305px;
top:10px;
color:#fff;
z-index:999;
width:100px;
text-align:center;
font-size:28px;
display:none;
font-weight:bold;
}
@-webkit-keyframes spinnerAnim {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes spinnerAnim {
0% { -moz-transform: rotate(0deg); }
100% { -moz-transform: rotate(360deg); }
}
.spinner {
-webkit-animation-fill-mode: both;
-webkit-animation: spinnerAnim 1.5s infinite linear;
-webkit-transform-origin: 50% 50%;
-moz-animation-fill-mode: both;
-moz-animation: spinnerAnim 1.5s infinite linear;
-moz-transform-origin: 50% 50%;
}