WBCE CMS Forum

WBCE CMS – Way Better Content Editing.

You are not logged in.

#1 30.10.2019 00:09:39

dev4me
Developer

Numbers

You see them all the time these days... Those nice counters with numbers of satisfied customers, products delivered or foreign branches.

Just for fun I made this module: https://dev4me.com/modules-snippets/opensource/numbers/

numbers-frontend.jpg

Offline

Liked by:

losttrip, florian, giz, ice, byteworker, jean

#2 30.10.2019 07:51:25

florian
Administrator

Re: Numbers

Awesome! I've added it to the Addon Repository.
https://addons.wbce.org/pages/addons.ph … m&item=123


Code allein macht nicht glücklich. Jetzt spenden!

Offline

#3 30.10.2019 10:04:22

giz
Member

Re: Numbers

Cool! thanks for it.

with WBCE 1.4.0 and Fraggy 2.2.0 the fontawesome icons in the preview are hard to recognize.
and: is it possible to include fontisto icons as well?
and²: what does "private class" do/mean?


WBCE 1.6.1 - Fraggy 2.7.1 - PHP 8.2.13- All-inkl
Ein Leben ohne Hund ist möglich, aber sinnlos

Offline

#4 30.10.2019 10:45:41

florian
Administrator

Re: Numbers

with WBCE 1.4.0 and Fraggy 2.2.0 the fontawesome icons in the preview are hard to recognize.

change the very long line 22 in backend.css to

.howl-iconpicker-outer{background:rgba(0,0,0,.78);display:none;position:fixed;height:100%;width:100%;top:0;bottom:0;left:0;right:0;z-index:999999999}.howl-iconpicker-middle{display:table-cell;vertical-align:middle}.howl-iconpicker-close{background:#e83131;color:#fff;padding:10px;text-transform:uppercase;font-size:14px;letter-spacing:1px;text-align:center;width:242px;margin:0 auto;cursor:pointer}.howl-iconpicker-close:hover{background:#e62323}.howl-iconpicker{border:1px solid #ccc;background:#efefef;width:260px;margin:0 auto;//display:none;position:relative}.howl-iconpicker:active,.howl-iconpicker:focus,.howl-iconpicker:hover{display:block!important}.howl-iconpicker .geticonval .fa{font-size:28px;margin-right:10px;padding-bottom:10px}.howl-iconpicker .geticonval{background:#fcfcfc;border:1px solid #ccc;padding:10px;border-radius:3px;margin:5px;width:45px;height:45px;overflow:hidden;float:left}.howl-iconpicker .geticonval:hover{background:#efefef;cursor:pointer}.howl-iconpicker .geticonval:active{background:#ccc}.srchicons{margin:5px 5px 60px;border:1px solid #ccc;padding:10px;border-radius:3px;width:225px;position:absolute;display:block}.iconsholder{height:300px;overflow:auto;margin-top:50px}.selectedicon{background:#f55e4f!important;border-color:#f55e4f!important;color:#fff}

and: is it possible to include fontisto icons as well?

Basically yes, but that would mean a heavy rework of the module and also only either FA or Fontisto, not both of them at the same time. To be honest, I'm afraid it's not worth the effort. I know I was very euphoric about Fontisto, but in the meantime I have figured out that every time I needed a certain symbol it was not included in Fontisto.

and²: what does "private class" do/mean?

You cann add additional CSS classes there to apply additional styles to the output. Simple example: enter "greenish"  (without "") in the field and add the line

.greenish {color:green}

to your template, than that block will apear in green color.


(Edit: These are just my opinions, I am not the module author)

Last edited by florian (30.10.2019 10:49:23)


Code allein macht nicht glücklich. Jetzt spenden!

Offline

Liked by:

giz

#5 30.10.2019 11:31:53

dev4me
Developer

Re: Numbers

florian wrote:

with WBCE 1.4.0 and Fraggy 2.2.0 the fontawesome icons in the preview are hard to recognize.

change the very long line 22 in backend.css to

Better is to add a line below (in the "some tweaks" part). That way it will work in both themes.

.howl-iconpicker .geticonval {width: 48px;height: 48px; box-sizing: border-box;}

Next version will have this tweak added


florian wrote:

and²: what does "private class" do/mean?

You cann add additional CSS classes there to apply additional styles to the output. Simple example: enter "greenish"  (without "") in the field and add the line

.greenish {color:green}

to your template, than that block will apear in green color.
(Edit: These are just my opinions, I am not the module author)

Exactly  thumb_up
This way you can change a single block to a different layout/color/size/backgroud/etc..

Last edited by dev4me (30.10.2019 11:32:14)

Offline

Liked by:

giz

#6 30.10.2019 11:33:55

giz
Member

Re: Numbers

Dankeschön für die schnelle Umsetzung!
Und das mit Fontisto dachte ich mir schon; und die Tatsache, daß immer mal wieder ein bestimmtes Icon nicht existiert, kenne ich auch  wink
Geht mir mit FontAwesome aber auch so.

Also danke nochmal! thumb_up


WBCE 1.6.1 - Fraggy 2.7.1 - PHP 8.2.13- All-inkl
Ein Leben ohne Hund ist möglich, aber sinnlos

Offline

#7 31.10.2019 13:20:59

dev4me
Developer

Re: Numbers

Just released a new version. (v1.1.1)

- Fixed the double loading of FontAwesome (from CDN) if it was already loaded in the template.
- Made it mulitlanguage (EN/NL/DE)

Download: https://dev4me.com/modules-snippets/opensource/numbers/

Offline

Liked by:

giz, florian, byteworker

Board footer

up