MediaWiki:Common.less/leaflet.less: Difference between revisions
Jump to navigation
Jump to search
Content added Content deleted
No edit summary |
(Try to autogenerate icons and themes) |
||
Line 1: | Line 1: | ||
.leaflet-wiki-coordinates.leaflet-control { |
|||
/* MAPS */ |
|||
margin: 0; |
|||
color: white; |
|||
padding: 5px 10px; |
|||
filter: drop-shadow(0 0 2px black); |
|||
} |
|||
@square: 3px; |
|||
.map.leaflet-container { |
|||
@circle: 50%; |
|||
.leaflet-wiki-coordinates.leaflet-control { |
|||
margin: 0; |
|||
@inherit: inherit; |
|||
color: white; |
|||
@chef: #9C8474; |
|||
padding: 5px 10px; |
|||
@fisher: #98D3CC; |
|||
filter: drop-shadow(0 0 2px black); |
|||
@forager: #DDDB93; |
|||
} |
|||
@alchemist: #83C8A1; |
|||
@gatherer: #C8C87C; |
|||
/* ICONS */ |
|||
@woodcutter: #78C86C; |
|||
@carpenter: #9C8A7C; |
|||
.leaflet-marker-icon { |
|||
@bonewright: #B0B897; |
|||
border-radius: 3px; |
|||
@miner: #749696; |
|||
@blacksmith: #B4A432; |
|||
/* professions */ |
|||
@stonemason: #808789; |
|||
&.guard, |
|||
@detective: #5AB2BE; |
|||
&.guard_foe { |
|||
@leatherworker: #866E62; |
|||
background: #CA9C62 url(/images/Guard_small_icon.png) no-repeat center / contain; |
|||
@merchant: #78B492; |
|||
} |
|||
@palette: #DEDAD4; |
|||
&.chef, |
|||
@item: #90908C; |
|||
&.theme-chef, |
|||
@interactable: #927DCE; |
|||
&.chef_obj { |
|||
@neutral: #C0925A; |
|||
background: #8E7A6C url(/images/Chef_small_icon.png) no-repeat center / contain; |
|||
@aggressive: #D75650; |
|||
} |
|||
&.fisher, |
|||
@icons: guard inherit @circle, |
|||
&.theme-fisher { |
|||
chef chef @square, |
|||
background: #98D3CC url(/images/Fisher_small_icon.png) no-repeat center / contain; |
|||
fisher fisher @circle, |
|||
} |
|||
forager forager @square, |
|||
alchemist alchemist @square, |
|||
background: #DDDB93 url(/images/Forager_small_icon.png) no-repeat center / contain; |
|||
scout inherit @circle, |
|||
} |
|||
gatherer gatherer @square, |
|||
&.alchemist, |
|||
woodcutter woodcutter @square, |
|||
&.theme-alchemist { |
|||
carpenter carpenter @square, |
|||
background: #84CAA2 url(/images/Alchemist_small_icon.png) no-repeat center / contain; |
|||
minefighter inherit @circle, |
|||
} |
|||
bonewright bonewright @square, |
|||
&.scout { |
|||
miner miner @square, |
|||
background: #C09A60 url(/images/Scout_small_icon.png) no-repeat center / contain; |
|||
blacksmith blacksmith @square, |
|||
} |
|||
stonemason stonemason @square, |
|||
&.gatherer { |
|||
watchperson inherit @circle, |
|||
background: #C8C87C url(/images/Gatherer_small_icon.png) no-repeat center / contain; |
|||
detective detective @square, |
|||
} |
|||
leatherworker leatherworker @square, |
|||
&.woodcutter, |
|||
merchant merchant @square, |
|||
&.theme-woodcutter { |
|||
bank inherit @square, |
|||
background: #78C86C url(/images/Woodcutter_small_icon.png) no-repeat center / contain; |
|||
clipboard chef @square, |
|||
} |
|||
enchant item @circle, |
|||
&.carpenter, |
|||
hairdresser interactable @circle, |
|||
&.theme-carpenter, |
|||
interactable interactable @square, |
|||
&.carpenter_obj { |
|||
item item @square, |
|||
background: #9C8A7C url(/images/Carpenter_small_icon.png) no-repeat center / contain; |
|||
talk item @circle, |
|||
} |
|||
obelisk item @square, |
|||
&.minefighter { |
|||
palette palette @square, |
|||
background: #B2865D url(/images/Minefighter_small_icon.png) no-repeat center / contain; |
|||
portal_stone item @square, |
|||
} |
|||
search item @square, |
|||
&.bonewright, |
|||
shop inherit @circle, |
|||
&.theme-bonewright { |
|||
strange_stone item @square; |
|||
background: #B0B897 url(/images/Bonewright_small_icon.png) no-repeat center / contain; |
|||
} |
|||
@theme-onlys: aggressive aggressive, |
|||
&.miner { |
|||
interactable interactable, |
|||
background: #749696 url(/images/Miner_small_icon.png) no-repeat center / contain; |
|||
neutral neutral; |
|||
} |
|||
&.blacksmith { |
|||
.image(@str) { |
|||
background: #B4A432 url(/images/Blacksmith_small_icon.png) no-repeat center / contain; |
|||
@first: to-upper-case(extract(@str, 1)); |
|||
} |
|||
@rest: to-lower-case(extract(@str, 2)); |
|||
&.stonemason, |
|||
@image: ~'/images/@{first}@{rest}_small_icon.png'; |
|||
&.theme-stonemason { |
|||
} |
|||
background: #808789 url(/images/Stonemason_small_icon.png) no-repeat center / contain; |
|||
} |
|||
.generate-map-icon-rules(@classname, @color, @shape) { |
|||
&.watchperson { |
|||
.image(@classname); |
|||
background: #AE8653 url(/images/Watchperson_small_icon.png) no-repeat center / contain; |
|||
.leaflet-marker-icon-icon-@{classname} { |
|||
} |
|||
background: @color url(@image) no-repeat center / contain; |
|||
&.detective { |
|||
border-radius: @shape; |
|||
background: #5AB2BE url(/images/Detective_small_icon.png) no-repeat center / contain; |
|||
} |
|||
} |
|||
} |
|||
&.leatherworker { |
|||
.generate-map-theme-rules(@classname, @color) when (@classname = @color) { |
|||
background: #866E62 url(/images/Leatherworker_small_icon.png) no-repeat center / contain; |
|||
.image(@classname); |
|||
} |
|||
.leaflet-marker-icon-theme-@{classname} { |
|||
&.merchant { |
|||
background-color: @color; |
|||
background: #78B492 url(/images/Merchant_small_icon.png) no-repeat center / contain; |
|||
} |
|||
} |
|||
} |
|||
&.shieldbearer { |
|||
background: red url(/images/Shieldbearer_small_icon.png) no-repeat center / contain; |
|||
.leaflet-marker-icon-entity { |
|||
} |
|||
background-color: red; |
|||
&.builder { |
|||
} |
|||
background: red url(/images/Builder_small_icon.png) no-repeat center / contain; |
|||
.each(@icons, { |
|||
} |
|||
@classname: extract(@value, 1); |
|||
&.armorer { |
|||
@color: extract(@value, 2); |
|||
background: red url(/images/Armorer_small_icon.png) no-repeat center / contain; |
|||
@shape: extract(@value, 3); |
|||
} |
|||
.generate-map-icon-rules(@classname, @color, @shape); |
|||
}); |
|||
/* extra themes */ |
|||
.each(@themes-only, { |
|||
&.theme-neutral { |
|||
@classname: extract(@value, 1); |
|||
background-color: #C0925A; |
|||
@color: extract(@value, 2); |
|||
} |
|||
.generate-map-theme-rules(@classname, @color) |
|||
&.theme-aggressive { |
|||
}); |
|||
background-color: #C44A44; |
|||
.leaflet-marker-icon-shape-circle { |
|||
} |
|||
border-radius: @circle; |
|||
} |
|||
&.theme-item { |
|||
.leaflet-marker-icon-shape-square { |
|||
background-color: white; |
|||
border-radius: @square; |
|||
} |
|||
/* shapes */ |
|||
&.shape-square, |
|||
&.theme-square { |
|||
border-radius: 3px; |
|||
} |
|||
&.shape-circle { |
|||
border-radius: 50px; |
|||
} |
|||
/* other */ |
|||
&.strange_stone, |
|||
&.portal_stone { |
|||
background-color: #949A90; |
|||
} |
|||
} |
|||
} |
} |
Revision as of 04:37, 27 November 2024
.leaflet-wiki-coordinates.leaflet-control {
margin: 0;
color: white;
padding: 5px 10px;
filter: drop-shadow(0 0 2px black);
}
@square: 3px;
@circle: 50%;
@inherit: inherit;
@chef: #9C8474;
@fisher: #98D3CC;
@forager: #DDDB93;
@alchemist: #83C8A1;
@gatherer: #C8C87C;
@woodcutter: #78C86C;
@carpenter: #9C8A7C;
@bonewright: #B0B897;
@miner: #749696;
@blacksmith: #B4A432;
@stonemason: #808789;
@detective: #5AB2BE;
@leatherworker: #866E62;
@merchant: #78B492;
@palette: #DEDAD4;
@item: #90908C;
@interactable: #927DCE;
@neutral: #C0925A;
@aggressive: #D75650;
@icons: guard inherit @circle,
chef chef @square,
fisher fisher @circle,
forager forager @square,
alchemist alchemist @square,
scout inherit @circle,
gatherer gatherer @square,
woodcutter woodcutter @square,
carpenter carpenter @square,
minefighter inherit @circle,
bonewright bonewright @square,
miner miner @square,
blacksmith blacksmith @square,
stonemason stonemason @square,
watchperson inherit @circle,
detective detective @square,
leatherworker leatherworker @square,
merchant merchant @square,
bank inherit @square,
clipboard chef @square,
enchant item @circle,
hairdresser interactable @circle,
interactable interactable @square,
item item @square,
talk item @circle,
obelisk item @square,
palette palette @square,
portal_stone item @square,
search item @square,
shop inherit @circle,
strange_stone item @square;
@theme-onlys: aggressive aggressive,
interactable interactable,
neutral neutral;
.image(@str) {
@first: to-upper-case(extract(@str, 1));
@rest: to-lower-case(extract(@str, 2));
@image: ~'/images/@{first}@{rest}_small_icon.png';
}
.generate-map-icon-rules(@classname, @color, @shape) {
.image(@classname);
.leaflet-marker-icon-icon-@{classname} {
background: @color url(@image) no-repeat center / contain;
border-radius: @shape;
}
}
.generate-map-theme-rules(@classname, @color) when (@classname = @color) {
.image(@classname);
.leaflet-marker-icon-theme-@{classname} {
background-color: @color;
}
}
.leaflet-marker-icon-entity {
background-color: red;
}
.each(@icons, {
@classname: extract(@value, 1);
@color: extract(@value, 2);
@shape: extract(@value, 3);
.generate-map-icon-rules(@classname, @color, @shape);
});
.each(@themes-only, {
@classname: extract(@value, 1);
@color: extract(@value, 2);
.generate-map-theme-rules(@classname, @color)
});
.leaflet-marker-icon-shape-circle {
border-radius: @circle;
}
.leaflet-marker-icon-shape-square {
border-radius: @square;
}