Действия

Widget

Страны-эксплуатанты

Материал из ВикиВоины

0.00
(0 голосов)

<style>

.wrap {
 position: relative;
 float: right;
 margin-left: 15px;
 background-color: #abc6d9;

}

.countries ul {

 max-height: 400px;
 min-width: 200px;
 overflow-y: auto;
 overflow-x: clip;
 padding-left: 20px;
 margin: 10px;

}

svg#map {

   outline: none;
   cursor: move;
   }
  1. popup {
 position: absolute;
 display: none;
 background-color: #fff;
 padding: 2px 2px 2px 7px;
 border: 1px solid #ccc;
 z-index: 2;
 font-size: small;

}

  1. tooltip {
height: 45px;
text-align: center;
background: #2786c285;
padding: 10px;
margin-top: -8px;
position: relative;

}

.fa-question-circle-map {

   position: absolute;
   top: 240px;
   left: 5px;
   color: #2d7bb0;

}

.controls {

  display: inline-grid;
  position: absolute;
  top: 10px;
  right: 10px;

}

.controls button {

  font-size: x-large;
  padding: 2px;
  margin: 2px;
  opacity: 0.9;

}

.controls button:focus {

  background-color: #2786c2;

}

  1. reset {
   font-size: medium;

}

path {

 fill: #fff;
 cursor: pointer;

} path:hover {

 fill: #2786c285;

}

.mobile { display: none; }

.desktop { display: block; }

.land-out {

  fill-opacity: 0;
  fill-rule: evenodd;
  stroke: #ffffff;
  stroke-width: 1;
  stroke-dasharray: 0 1 0;
  stroke-opacity: 0.5;

}

.land-out:hover {

  fill-opacity: 1;
  fill: #2786c285;

}

@media only screen and (max-width:640px) {

.wrap {

 margin-left: 0;    
 margin-bottom: 10px;

}

.countries ul {

margin-left: 0;

}

.fa-question-circle-map {

   top: inherit;
   bottom: 30px;

}

.controls {

   top: 2px;
   right: 5px;

}

.controls button {

   padding: 0 5px;
   margin: 2px;

}

  1. reset {
  font-size: x-small;

}

.mobile { display: block; }

.desktop { display: none; }

.selected {

   fill: #c14e48!important;

}

.land-out.selected {

   fill-opacity: 1;
   fill: #2786c285!important;

}

  1. tooltip {
   padding: 0;
   font-size: 15px;
   height: 25px;
   margin-top: -9px;

}

  1. tooltip img {
   height: 18px;

}

} </style>