From 414ef2d90b0ebe54bb18fa5e288f1dd8849ae35a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20P=C3=A9ters?= Date: Sun, 21 Jan 2018 10:46:41 +0100 Subject: [PATCH 1/2] maps: use scss to handle list of marker icons (#21289) --- MANIFEST.in | 2 +- combo/apps/maps/static/css/combo.map.css | 173 ------------------------------ combo/apps/maps/static/css/combo.map.scss | 94 ++++++++++++++++ debian/control | 2 +- setup.py | 35 +++++- 5 files changed, 130 insertions(+), 176 deletions(-) delete mode 100644 combo/apps/maps/static/css/combo.map.css create mode 100644 combo/apps/maps/static/css/combo.map.scss diff --git a/MANIFEST.in b/MANIFEST.in index 5c39d3f..8531310 100644 --- a/MANIFEST.in +++ b/MANIFEST.in @@ -6,7 +6,7 @@ recursive-include combo/apps/usersearch/static *.css *.js *.ico *.gif *.png *.jp recursive-include combo/apps/lingo/static *.css *.js *.ico *.gif *.png *.jpg recursive-include combo/apps/dataviz/static *.css *.js *.ico *.gif *.png *.jpg recursive-include combo/apps/dashboard/static *.js -recursive-include combo/apps/maps/static *.css *.js +recursive-include combo/apps/maps/static *.css *.scss *.js recursive-include combo/manager/static *.css *.js *.ico *.gif *.png *.jpg recursive-include combo/public/static *.css *.js *.ico *.gif *.png *.jpg recursive-include data/themes *.css *.js *.gif *.png *.jpg *.jpeg *.html diff --git a/combo/apps/maps/static/css/combo.map.css b/combo/apps/maps/static/css/combo.map.css deleted file mode 100644 index 46b6cea..0000000 --- a/combo/apps/maps/static/css/combo.map.css +++ /dev/null @@ -1,173 +0,0 @@ -div.combo-cell-map.leaflet-container { - height: 60vh; - font: inherit; -} - -/* leaflet styles */ - -div.leaflet-marker-icon { - border: none; - background: transparent; -} - -div.leaflet-div-icon span { - width: 2.3em; - height: 2.3em; - display: block; - left: -1.15em; /* 2.3 / 2 */ - top: -3em; /* 2.3 * 1.2 */ - position: relative; - border-radius: 11em 6em 0.8em; - transform: scale(1, 1.3) rotate(45deg); - box-sizing: border-box; -} - -div.leaflet-div-icon span { - border: 1px solid white; - box-shadow: 0 0 0 1px #aaa; -} - -div.leaflet-div-icon span i { - display: block; - width: 100%; - text-align: center; - transform: translateY(50%) rotate(-45deg); - height: 50%; -} - -div.leaflet-popup-content span.field-value { - font-weight: bold; -} - -div.leaflet-div-icon span i:before { - display: inline-block; - background: white; - border-radius: 100%; - padding: 0.5ex; - transform: scale(1.3, 1); - margin-top: -0.3ex; -} - -/* leaflet markers icons */ - -.layers a::before, -select#id_icon option::before, -i.leaflet-marker-icon { - font: normal normal normal 1em/1 FontAwesome; -} - -.layers a::before, -select#id_icon option::before { - padding-right: 1ex; - display: inline-block; - width: 3ex; - text-align: center; -} - -a.layer-icon-house::before, -select#id_icon option[value=house]::before, -i.leaflet-marker-icon.house::before { - content: "\f015"; /* home */ -} - -a.layer-icon-building::before, -select#id_icon option[value=building]::before, -i.leaflet-marker-icon.building::before { - content: "\f0f7"; /* building */ -} - -a.layer-icon-hospital::before, -select#id_icon option[value=hospital]::before, -i.leaflet-marker-icon.hospital::before { - content: "\f0f8"; /* hospital */ -} - -a.layer-icon-ambulance::before, -select#id_icon option[value=ambulance]::before, -i.leaflet-marker-icon.ambulance::before { - content: "\f0f9"; /* ambulance */ -} - -a.layer-icon-taxi::before, -select#id_icon option[value=taxi]::before, -i.leaflet-marker-icon.taxi::before { - content: "\f1ba"; /* taxi */ -} - -a.layer-icon-subway::before, -select#id_icon option[value=subway]::before, -i.leaflet-marker-icon.subway::before { - content: "\f239"; /* subway */ -} - -a.layer-icon-wheelchair::before, -select#id_icon option[value=wheelchair]::before, -i.leaflet-marker-icon.wheelchair::before { - content: "\f193"; /* wheelchair */ -} - -a.layer-icon-bicycle::before, -select#id_icon option[value=bicycle]::before, -i.leaflet-marker-icon.bicycle::before { - content: "\f206"; /* bicycle */ -} - -a.layer-icon-car::before, -select#id_icon option[value=car]::before, -i.leaflet-marker-icon.car::before { - content: "\f1b9"; /* car */ -} - -a.layer-icon-train::before, -select#id_icon option[value=train]::before, -i.leaflet-marker-icon.train::before { - content: "\f238"; /* train */ -} - -a.layer-icon-bus::before, -select#id_icon option[value=bus]::before, -i.leaflet-marker-icon.bus::before { - content: "\f207"; /* bus */ -} - -a.layer-icon-motorcycle::before, -select#id_icon option[value=motorcycle]::before, -i.leaflet-marker-icon.motorcycle::before { - content: "\f21c"; /* motorcycle */ -} - -a.layer-icon-truck::before, -select#id_icon option[value=truck]::before, -i.leaflet-marker-icon.truck::before { - content: "\f0d1"; /* truck */ -} - -a.layer-icon-book::before, -select#id_icon option[value=book]::before, -i.leaflet-marker-icon.book::before { - content: "\f02d"; /* book */ -} - -a.layer-icon-shower::before, -select#id_icon option[value=shower]::before, -i.leaflet-marker-icon.shower::before { - content: "\f2cc"; /* shower */ -} - -a.layer-icon-trash::before, -select#id_icon option[value=trash]::before, -i.leaflet-marker-icon.trash::before { - content: "\f1f8"; /* trash */ -} - -a.layer-icon-recycle::before, -select#id_icon option[value=recycle]::before, -i.leaflet-marker-icon.recycle::before { - content: "\f1b8"; /* recycle */ -} - -a.layer-icon-university::before, -select#id_icon option[value=university]::before, -i.leaflet-marker-icon.university::before { - content: "\f19c"; /* university */ -} diff --git a/combo/apps/maps/static/css/combo.map.scss b/combo/apps/maps/static/css/combo.map.scss new file mode 100644 index 0000000..de188bd --- /dev/null +++ b/combo/apps/maps/static/css/combo.map.scss @@ -0,0 +1,94 @@ +$marker_icons: ( + (ambulance, "\f0f9"), + (bicycle, "\f206"), + (book, "\f02d"), + (building, "\f0f7"), + (bus, "\f207"), + (car, "\f1b9"), + (hospital, "\f0f8"), + (house, "\f015"), + (motorcycle, "\f21c"), + (recycle, "\f1b8"), + (shower, "\f2cc"), + (subway, "\f239"), + (taxi, "\f1ba"), + (train, "\f238"), + (trash, "\f1f8"), + (truck, "\f9d1"), + (university, "\f19c"), + (wheelchair, "\f193"), +); + +div.combo-cell-map.leaflet-container { + height: 60vh; + font: inherit; +} + +/* leaflet styles */ + +div.leaflet-marker-icon { + border: none; + background: transparent; +} + +div.leaflet-div-icon span { + width: 2.3em; + height: 2.3em; + display: block; + left: -1.15em; /* 2.3 / 2 */ + top: -3em; /* 2.3 * 1.2 */ + position: relative; + border-radius: 11em 6em 0.8em; + transform: scale(1, 1.3) rotate(45deg); + box-sizing: border-box; +} + +div.leaflet-div-icon span { + border: 1px solid white; + box-shadow: 0 0 0 1px #aaa; +} + +div.leaflet-div-icon span i { + display: block; + width: 100%; + text-align: center; + transform: translateY(50%) rotate(-45deg); + height: 50%; +} + +div.leaflet-popup-content span.field-value { + font-weight: bold; +} + +div.leaflet-div-icon span i:before { + display: inline-block; + background: white; + border-radius: 100%; + padding: 0.5ex; + transform: scale(1.3, 1); + margin-top: -0.3ex; +} + +/* leaflet markers icons */ + +.layers a::before, +select#id_icon option::before, +i.leaflet-marker-icon { + font: normal normal normal 1em/1 FontAwesome; +} + +.layers a::before, +select#id_icon option::before { + padding-right: 1ex; + display: inline-block; + width: 3ex; + text-align: center; +} + +@each $marker_icon_name, $marker_icon_symbol in $marker_icons { + a.layer-icon-#{$marker_icon_name}::before, + select#id_icon option[value=#{$marker_icon_name}]::before, + i.leaflet-marker-icon.#{$marker_icon_name}::before { + content: $marker_icon_symbol; + } +} diff --git a/debian/control b/debian/control index bbd4a11..96a1465 100644 --- a/debian/control +++ b/debian/control @@ -2,7 +2,7 @@ Source: combo Maintainer: Jérôme Schneider Section: python Priority: optional -Build-Depends: python-setuptools (>= 0.6b3), python-all (>= 2.6.6-3), debhelper (>= 7), python-django, dh-systemd +Build-Depends: python-setuptools (>= 0.6b3), python-all (>= 2.6.6-3), debhelper (>= 7), python-django, dh-systemd, ruby-sass Standards-Version: 3.9.6 X-Python-Version: >= 2.7 diff --git a/setup.py b/setup.py index 953e90e..5eff8f4 100644 --- a/setup.py +++ b/setup.py @@ -72,8 +72,40 @@ class compile_translations(Command): sys.stderr.write('!!! Please install Django >= 1.4 to build translations\n') +class compile_scss(Command): + description = 'compile scss files into css files' + user_options = [] + + def initialize_options(self): + pass + + def finalize_options(self): + pass + + def run(self): + sass_bin = None + for program in ('sass', 'sassc'): + sass_bin = find_executable(program) + if sass_bin: + break + if not sass_bin: + raise CompileError('A sass compiler is required but none was found. See sass-lang.com for choices.') + + for package in self.distribution.packages: + for package_path in __import__(package).__path__: + for path, dirnames, filenames in os.walk(package_path): + for filename in filenames: + if not filename.endswith('.scss'): + continue + if filename.startswith('_'): + continue + subprocess.check_call([sass_bin, '%s/%s' % (path, filename), + '%s/%s' % (path, filename.replace('.scss', '.css'))]) + + class build(_build): - sub_commands = [('compile_translations', None)] + _build.sub_commands + sub_commands = [('compile_translations', None), + ('compile_scss', None) ] + _build.sub_commands class install_lib(_install_lib): @@ -125,6 +157,7 @@ setup( zip_safe=False, cmdclass={ 'build': build, + 'compile_scss': compile_scss, 'compile_translations': compile_translations, 'install_lib': install_lib, 'sdist': eo_sdist, -- 2.15.1