Skip to content

S
smogonet
Commit c5b18595 authored by Antek Grzanka's avatar Antek Grzanka
Browse files
Options

Align CSS with main onet page.

parent ab7099d3
Show whitespace changes
Inline Side-by-side
Showing with 102 additions and 9 deletions
index.html
View file @ c5b18595
...@@ -8,7 +8,6 @@ ...@@ -8,7 +8,6 @@
font-size: 0.75rem; font-size: 0.75rem;
font-family: "Open Sans","Arial","sans-serif"; font-family: "Open Sans","Arial","sans-serif";
color: #003f65; color: #003f65;
font-weight: bold;
width: 350px; width: 350px;
padding: 1px; padding: 1px;
} }
...@@ -34,6 +33,78 @@ ...@@ -34,6 +33,78 @@
} }
.mr-10 { margin-right: 10px; } .mr-10 { margin-right: 10px; }
.ml-30 { margin-left: 30px; } .ml-30 { margin-left: 30px; }
.selectedPollutionCity {
float: right;
display: table;
height: 1.5rem;
font-size: 12px;
position: relative;
cursor: pointer;
}
.arrowDown {
margin-top: 3px;
margin-left: 3px;
width: 15px;
height: 15px;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAHCAYAAADebrddAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OEVBM0FEN0I0MjM5MTFFNEJERjZDMEM3NEIzOTQyQ0MiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OEVBM0FEN0M0MjM5MTFFNEJERjZDMEM3NEIzOTQyQ0MiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4RUEzQUQ3OTQyMzkxMUU0QkRGNkMwQzc0QjM5NDJDQyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4RUEzQUQ3QTQyMzkxMUU0QkRGNkMwQzc0QjM5NDJDQyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlPSTfsAAABmSURBVHjaYqyZutyVgYFhOxAzM+AHZ5mAxB0g/sJAGFwAKb4PxEFA/AuPwn1AnMWExEnEofAyzDAmJMFlQFyJpvApEHsC8UcQhwlNsgOIp0PZH6EKn8IkWbBYmwv19EGoE+AAIMAAslAWHnRivoAAAAAASUVORK5CYII=);
background-repeat: no-repeat;
background-position: left top;
}
.showList {
display: table-cell;
text-indent: -9999px;
float: right;
}
.select-box {
width: 330px;
height: 50px;
position: absolute;
z-index: 10;
background: #152a36;
background: -moz-linear-gradient(top,#152a36 0,#061a25 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#152a36),color-stop(100%,#061a25));
background: -webkit-linear-gradient(top,#152a36 0,#061a25 100%);
background: -o-linear-gradient(top,#152a36 0,#061a25 100%);
background: -ms-linear-gradient(top,#152a36 0,#061a25 100%);
background: linear-gradient(to bottom,#152a36 0,#061a25 100%);
right: 0px;
padding-top: 10px;
padding-bottom: 10px;
letter-spacing: -0.7px;
font-size: 14px;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.select-box .city-list {
width: 50%;
float: left;
}
.select-box .city-list li {
color: white;
}
.select-box .city-list li:hover {
background: #173c57;
border-radius: 3.873px;
}
ul {
list-style-type: none;
padding: 0;
margin: 0;
}
</style> </style>
</head> </head>
...@@ -53,14 +124,36 @@ ...@@ -53,14 +124,36 @@
<span id="pollution-value">?</span> <span id="pollution-value">?</span>
<select id="select-station" style="float: right; display: center; font-weight: bold;"> <!--<select id="select-station" style="float: right; display: center; font-weight: bold;">-->
<option value="00000000-0000-0000-0000-000000000003">ul. Bujaka</option> <!--<option value="00000000-0000-0000-0000-000000000003">ul. Bujaka</option>-->
<option value="00000000-0000-0000-0000-000000000002">ul. Bulwarowa</option> <!--<option value="00000000-0000-0000-0000-000000000002">ul. Bulwarowa</option>-->
<option value="00000000-0000-0000-0000-00000000000f">ul. Złoty Róg</option> <!--<option value="00000000-0000-0000-0000-00000000000f">ul. Złoty Róg</option>-->
<option value="00000000-0000-0000-0000-000000000001">Al. Krasińskiego</option> <!--<option value="00000000-0000-0000-0000-000000000001">Al. Krasińskiego</option>-->
<option value="00000000-0000-0000-0000-00000000000e">os. Piastów</option> <!--<option value="00000000-0000-0000-0000-00000000000e">os. Piastów</option>-->
<option value="00000000-0000-0000-0000-00000000000d">ul. Dietla</option> <!--<option value="00000000-0000-0000-0000-00000000000d">ul. Dietla</option>-->
</select> <!--</select>-->
<a class="selectedPollutionCity selectedPollutionCitySmall">
<span class="selectedPollutionCityWrapper">
<span class="stationName">Al. Krasińskiego</span>
</span>
<span class="selectedPollutionCityWrapper">
<span class="showList arrowDown">rozwiń</span>
</span>
<div class="select-box">
<ul class="city-list left">
<li value="00000000-0000-0000-0000-000000000001">Al. Krasińskiego</li>
<li value="00000000-0000-0000-0000-000000000003">ul. Bujaka</li>
<li value="00000000-0000-0000-0000-000000000002">ul. Bulwarowa</li>
</ul>
<ul class="city-list right">
<li value="00000000-0000-0000-0000-00000000000f">ul. Złoty Róg</li>
<li value="00000000-0000-0000-0000-00000000000e">os. Piastów</li>
<li value="00000000-0000-0000-0000-00000000000d">ul. Dietla</li>
</ul>
</div>
</a>
<span id="value-id">µg/m³</span> <span id="value-id">µg/m³</span>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment