Ion-item design


#1

Hi, i would like to ask for recommendation on how to code and design each ion-item in a ion-list, specifically the small rectangular colored column at the right such as shown in the picture above.


#2

I would go for it like this:

Hope this helps!


#3

Thanks. I’d study your code and hopefully be able to implement it to my project :wink: Dōmo arigatō


#4

Let me know if you need any further help :wink:


#5

Hi @iwantwin. Notice the top and bottom of the colored side, they are ragged. Do you have any idea how to smoothen the edges?


#6

Hey! I’ve tried my approach a lot, because borders just defaultly come with borders in a diagonal edge… But hey, this fixes it I guess?


#7

@iwantwin yea it did. thanks. kudos to you :smile: