Thx Jerry,
I can´t work it out in the moment. I wonder how @pruthe made it work.
Traffic in paradise?
Thx Jerry,
I can´t work it out in the moment. I wonder how @pruthe made it work.
Traffic in paradise?
Yeah, we’re all on the way to the beach for a rum coconut
I can’t get it to work as well. Off to bed now, will give it another try tomorrow with coffee . I’m pretty sure the error is in here:
#accordion-11011 .card-header a:before
EDIT: @PeteSharp, should have finished his first coffee by now.
I’m looking at what’s going on. Will let you know if I find anything.
Hi again,
It’s necessary to force the Font Awesome icons to be included in the Blocs project. Apparently in my other project I used a Font Awesome icon somewhere. Here’s an updated sample blocs file with a change. I added an icon-heading bric over each accordion and the ± showed up.
Accordion_Toggle_Switch_Groups-icon.bloc (726.2 KB)
Hope this helps.
pruthe
Update: I used a Facebook icon in my project so that’s why Font Awesome was included.
I’m only on my phone. But from memory, yes Blocs won’t include Font Awesome unless you use it. And it doesn’t know you want to use it if your using just code.
Yes, I can confim this. It’s only working, if you use an icon with FA 5 Free somewhere on the project.
the code above doesn’t implement the font itself.
@Malachiman this time I’m asking, before trying myself for 4 hours
How do I apply it to more than 1 accordions on the same page? Do I have to repeat the whole code and change the #accordion-nr.? Or ist there a more simple solution?
Yeah that code was targeting one accordion. The easiest way would be to add a class to all your accordions like
.myaccordion
Call it what ever you want. Then use that class instead of the ID. The Accordion uses cards, so we want to still target them, other wise your CSS will effect cards on your page if you have them.
With that class in place, the CSS will style all of them.
genius solution! works perfectly.
one more time, thank you very much!!
Slightly speedier… I replied 3 hours after your post
Thanks all,
Yes, with an icon on the page it works.
I would love to try @PeteSharp ´s solution but whereever I placed the class in the code I wasn´t successful. How would the code look like?
In any case - great help
Hey @pixelwork
This
#accordion-46118 .card-header a[aria-expanded=“false”]:after{
font-family: “Font Awesome 5 Free”;
content: “\f067”
}
Becomes
.myaccordion .card-header a[aria-expanded=“false”]:after{
font-family: “Font Awesome 5 Free”;
content: “\f067”
}
Change the .myaccordion
based on what ever classs name you used.
3 hours I could spent on what I‘m good at, meaning Design, instead of code-digging… what I‘m realy bad at
Code is so freakin abstract for my brain
You‘re our guardian-code-angle @PeteSharp
btw love your new videos!
Super Pete,
I made several mistakes when inserting the class.
Now I got it…
I agree with @benfluri ´s words
Latest news…
After all your help and attention I have to shorten up my happyness
It works well on Safari and - to my surprise - also in Brave.
Firefox and Oprea do not show the +/- (not even placeholders), so does any Android device.
Looks like I have to find a nice compromise
Anyway - bless you all and great thanks for your support
The ± show up on my Blocs project using Firefox (84.0.2) on MacOS 10.15.7. Also shows up on Firefox on iOS 14.3. I don’t have Opera yet. Also don’t have Android. Maybe someone else can test.
Looks like your punishment for using Firefox
It could be related to security features of Firefox? Do you get the same result if the page is hosted?
Smart A…
Sorry, kind of my english balley feeling in resonsing
Am a German and have of course no sense of humor!!!
Am using every browser, specially those common ones!
Guess there is a friction -may be a bug as well .
Given up on this point - as it isn`t only Firefox!
Thanks to Down Under
I haven’t revisited this for a long time. Maybe sometime soon I’ll take another look and refine it.
I can confirm as being Dutch
Can´t get it to work (tryed every submitted code by this great Forum)
HELP please - Accordion is very importand to me!