You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
93 lines
2.9 KiB
CSS
93 lines
2.9 KiB
CSS
/*
|
|
This Source Code Form is subject to the terms of the Mozilla Public
|
|
License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
|
*/
|
|
|
|
#mapbox {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
}
|
|
|
|
/*
|
|
TODO: Change image based on place health/strength {0,1,2}.png
|
|
*/
|
|
#mapbox .place-marker {
|
|
width: 10em;
|
|
height: 10em;
|
|
background-image: url(../img/place/2.png);
|
|
background-size: contain;
|
|
}
|
|
|
|
|
|
/*
|
|
Colorize images for map display
|
|
|
|
CSS filters made with https://codepen.io/sosuke/pen/Pjoqqp
|
|
*/
|
|
|
|
/*
|
|
TODO: Adjust green and lightblue for better map visibility
|
|
*/
|
|
.color-filter-red {
|
|
filter: brightness(0) saturate(100%) invert(43%) sepia(63%) saturate(6607%) hue-rotate(344deg) brightness(111%) contrast(101%);
|
|
}
|
|
|
|
.color-filter-green {
|
|
filter: brightness(0) saturate(100%) invert(82%) sepia(6%) saturate(5468%) hue-rotate(70deg) brightness(96%) contrast(76%);
|
|
}
|
|
|
|
.color-filter-blue {
|
|
filter: brightness(0) saturate(100%) invert(51%) sepia(33%) saturate(1529%) hue-rotate(172deg) brightness(94%) contrast(104%);
|
|
}
|
|
|
|
.color-filter-pink {
|
|
filter: brightness(0) saturate(100%) invert(54%) sepia(96%) saturate(5960%) hue-rotate(330deg) brightness(99%) contrast(106%);
|
|
}
|
|
|
|
.color-filter-yellow {
|
|
filter: brightness(0) saturate(100%) invert(76%) sepia(89%) saturate(2826%) hue-rotate(8deg) brightness(112%) contrast(103%);
|
|
}
|
|
|
|
.color-filter-orange {
|
|
filter: brightness(0) saturate(100%) invert(53%) sepia(77%) saturate(1004%) hue-rotate(359deg) brightness(103%) contrast(108%);
|
|
}
|
|
|
|
.color-filter-purple {
|
|
filter: brightness(0) saturate(100%) invert(18%) sepia(61%) saturate(4153%) hue-rotate(281deg) brightness(95%) contrast(89%);
|
|
}
|
|
|
|
.color-filter-deeppurple {
|
|
filter: brightness(0) saturate(100%) invert(26%) sepia(27%) saturate(4860%) hue-rotate(246deg) brightness(89%) contrast(93%);
|
|
}
|
|
|
|
.color-filter-lightblue {
|
|
filter: brightness(0) saturate(100%) invert(78%) sepia(10%) saturate(4807%) hue-rotate(168deg) brightness(99%) contrast(98%);
|
|
}
|
|
|
|
.color-filter-teal {
|
|
filter: brightness(0) saturate(100%) invert(32%) sepia(93%) saturate(1351%) hue-rotate(149deg) brightness(94%) contrast(101%);
|
|
}
|
|
|
|
.color-filter-lime {
|
|
filter: brightness(0) saturate(100%) invert(80%) sepia(12%) saturate(1890%) hue-rotate(22deg) brightness(95%) contrast(114%);
|
|
}
|
|
|
|
.color-filter-deeporange {
|
|
filter: brightness(0) saturate(100%) invert(67%) sepia(41%) saturate(6786%) hue-rotate(342deg) brightness(98%) contrast(106%);
|
|
}
|
|
|
|
.color-filter-gray {
|
|
filter: brightness(0) saturate(100%) invert(64%) sepia(7%) saturate(162%) hue-rotate(202deg) brightness(87%) contrast(86%);
|
|
}
|
|
|
|
.color-filter-white {
|
|
filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
|
|
}
|
|
|
|
.color-filter-black {
|
|
filter: brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(7432%) hue-rotate(210deg) brightness(88%) contrast(115%);
|
|
} |