MediaWiki:Common.less/dooglemaps.less
Ir para navegação
Ir para pesquisar
/* =======================
DOOGLE MAPS
======================== */
.oo-ui-window-foot.mw-kartographer-mapDialog-foot {
.mw-kartographer-inlinefoot {
.mw-kartographer-captionfoot {
font-size: 1.25em;
}
}
}
.mw-kartographer-interactive {
&.leaflet-container {
.marker-description {
img {
margin-bottom: .5em;
}
p:last-child {
margin-bottom: 0;
}
}
}
/* Fix arrow on visible labels */
.leaflet-tooltip-left::before {
margin-right: -10px;
}
.leaflet-tooltip-right::before {
margin-left: -10px;
}
.leaflet-tooltip-top::before {
margin-bottom: -10px;
}
.leaflet-tooltip-bottom::before {
margin-top: -10px;
}
/* Leaving this commented out for now because I'm not a huge fan, needs more styling
.leaflet-div-dot div {
-webkit-box-shadow: inset 1px -1px 5px 1px #000000;
-moz-box-shadow: inset 1px -1px 5px 1px #000000;
box-shadow: inset 1px -1px 5px 1px #000000;
}
*/
}
/* =======================
VISIBLE LABEL STYLES
======================== */
/* Mixin for colored labels */
.lbl-bg-mixin(@lbl-background, @lbl-text, @lbl-link) {
background: @lbl-background;
color: @lbl-text;
text-shadow: none;
body.wgl-darkmode & {
color: @lbl-text;
}
a,
a:visited,
a:active,
a.mw-selflink.selflink {
color: @lbl-text;
body.wgl-darkmode & {
color: @lbl-text;
}
}
&.leaflet-tooltip-left::before {
display: block;
border-left-color: @lbl-background;
}
&.leaflet-tooltip-right::before {
display: block;
border-right-color: @lbl-background;
}
&.leaflet-tooltip-top::before {
display: block;
border-top-color: @lbl-background;
}
&.leaflet-tooltip-bottom::before {
display: block;
border-bottom-color: @lbl-background;
}
}
.lbl-color-mixin(@lbl-color) {
color: darken( @lbl-color, 15% );
text-shadow: none;
background: #fff;
border: solid 2px darken( @lbl-color, 15% );
body.wgl-darkmode & {
color: darken( @lbl-color, 15% );
}
a,
a:visited,
a:active,
a.mw-selflink.selflink {
color: darken( @lbl-color, 15% );
body.wgl-darkmode & {
color: darken( @lbl-color, 15% );
}
}
&.leaflet-tooltip-left::before {
display: block;
border-left-color: darken( @lbl-color, 15% );
margin-right: -12px;
}
&.leaflet-tooltip-right::before {
display: block;
border-right-color: darken( @lbl-color, 15% );
margin-left: -12px;
}
&.leaflet-tooltip-top::before {
display: block;
border-top-color: darken( @lbl-color, 15% );
margin-bottom: -12px;
}
&.leaflet-tooltip-bottom::before {
display: block;
border-bottom-color: darken( @lbl-color, 15% );
margin-top: -12px;
}
}
/* visible text labels */
.leaflet-vis-tooltip {
color: #fff;
text-shadow: 0 0 1px #000;
body.wgl-darkmode & {
color: #fff;
}
a,
a:visited,
a:active,
a.mw-selflink.selflink {
color: #ffffff;
body.wgl-darkmode & {
color: #ffffff;
}
}
/* Optional label styles */
&.large-label {
font-size: 1.2em;
font-weight: bold;
}
&.dark-label {
color: #000;
text-shadow: 0 0 1px #fff;
body.wgl-darkmode & {
color: #000;
}
a,
a:visited,
a:active,
a.mw-selflink.selflink {
color: #000;
body.wgl-darkmode & {
color: #000;
}
}
}
/* Color options */
&.lbl-bg-red {
.lbl-bg-mixin(@apricot-peach, @mocaccino, @old-brick);
}
&.lbl-bg-orange {
.lbl-bg-mixin(@corvette, @antique-bronze, @korma);
}
&.lbl-bg-yellow {
.lbl-bg-mixin(@golden, @cinnamon, @olive);
}
&.lbl-bg-green {
.lbl-bg-mixin(@caper, @san-felix, @la-palma);
}
&.lbl-bg-blue {
.lbl-bg-mixin(@jordy-blue, @regal-blue, @venice-blue);
}
&.lbl-bg-purple {
.lbl-bg-mixin(@perfume, @honey-flower, @seance);
}
&.lbl-bg-pink {
.lbl-bg-mixin(@cherub, @cosmic, @cannon-pink);
}
&.lbl-bg-gray,
&.lbl-bg-grey {
.lbl-bg-mixin(@mystic, @river-bed, @shuttle-gray);
}
&.lbl-red {
.lbl-color-mixin(@flamingo);
}
&.lbl-orange {
.lbl-color-mixin(@ecstasy);
}
&.lbl-yellow {
.lbl-color-mixin(@supernova);
}
&.lbl-green {
.lbl-color-mixin(@lima);
}
&.lbl-blue {
.lbl-color-mixin(@curious-blue);
}
&.lbl-purple {
.lbl-color-mixin(@medium-purple);
}
&.lbl-pink {
.lbl-color-mixin(@lavender);
}
&.lbl-gray,
&.lbl-grey {
.lbl-color-mixin(@gray-chateau);
}
}
/* =======================
ADVANCED MAPS SPECIFICS
======================== */
.advanced-map {
background: #000000;
padding: 10px;
position: relative;
/* Center by default, like maps */
margin: 0 auto;
overflow: hidden;
/* Max width for small screens */
max-width: 100%;
max-width: calc(100% - 20px);
body.wgl-darkmode & {
background: #000000;
}
/* Align left and right */
&.amap-left {
float: left;
clear: left;
margin:0.3em 0.5em 0.5em 0
}
&.amap-right {
float: right;
clear: right;
margin: 0 0 1em 1em;
}
/* Nested advanced maps */
.advanced-map {
padding: 0;
}
/* Add drop shadows to icons for clarity */
&.amap-droplight img.leaflet-marker-icon {
-webkit-filter: drop-shadow(0px 0px 3px #fff);
filter: drop-shadow(0px 0px 3px #fff);
}
&.amap-dropdark img.leaflet-marker-icon {
-webkit-filter: drop-shadow(0px 0px 3px #000);
filter: drop-shadow(0px 0px 3px #000);
}
.thumbcaption,
body.wgl-darkmode & .thumbcaption {
background: #000000;
color: #ffffff;
}
}
/* Nav links to map, talk and edit pages */
.amap-nav {
position: absolute;
top: 3px;
left: 5px;
text-align: left;
font-size: xx-small;
white-space: nowrap;
a,
a:visited,
a:active,
a.mw-selflink.selflink {
color: #ffffff;
body.wgl-darkmode & {
color: #ffffff;
}
}
}
.amap-title {
margin-bottom: 10px;
font-size: 1.2em;
text-align: center;
color: #ffffff;
body.wgl-darkmode & {
color: #ffffff;
}
a,
a:visited,
a:active,
a.mw-selflink.selflink {
color: #ffffff;
body.wgl-darkmode & {
color: #ffffff;
}
}
> a,
> span {
padding: 0.3em 30px;
background-image: url("/images/6/63/TitleBackground-left.png?8d416"), url("/images/c/c7/TitleBackground-right.png?8d416"), url("/images/6/69/TitleBackground-center.png?8d416");
background-repeat: no-repeat, no-repeat, repeat-x;
background-size: auto 100%, auto 100%, auto 100%;
background-position: left, right, center;
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
display: inline-block;
line-height: 1.5;
}
}
.amap-key {
margin-top: 10px;
color: #ffffff;
body.wgl-darkmode & {
color: #ffffff;
}
a,
a:active,
a:visited,
a.mw-selflink.selflink {
color: #ffffff;
body.wgl-darkmode & {
color: #ffffff;
}
}
ul {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-flow: row wrap;
/* within ul so more specific than column # classes */
/* last item expands to fill rest of space */
li:last-child {
flex-grow: 1;
}
/* full width key item */
li.amap-full {
flex-basis: 100%
}
}
li {
flex: 0 1 50%;
min-width: 175px;
margin-bottom: 0.4em;
display: flex;
align-items: center;
/* other number of key columns */
.amap-1col& {
flex: 0 1 100%;
}
.amap-3col& {
flex: 0 1 33%;
}
.amap-4col& {
flex: 0 1 25%;
}
}
.amap-key-text {
&.amap-key-compass {
flex-grow: 1;
text-align: center;
}
}
.amap-key-symb {
width: 30px;
padding: 0 10px;
/* For full width key things */
&.amap-key-nosymb {
width: 10px;
padding: 0;
}
div,
img {
display: block;
text-align: center;
margin: 0 auto;
}
.amap-key-dots {
width: 12px;
height: 12px;
div {
width: 100%;
height: 100%;
}
.leaflet-dot {
border-radius: 50%;
}
}
.amap-key-circ,
.amap-key-poly {
width: 20px;
height: 20px;
div {
width: 100%;
height: 100%;
}
}
.amap-key-circ {
border-radius: 50%;
div {
border-radius: 50%;
}
}
}
}