search

face-hh / webx

An alternative for the World Wide Web - browse websites such as buss://yippie.rizz made in HTML, CSS and Lua. Custom web browser, custom HTML rendering engine, custom search engine, and more.
Apache License 2.0
1.86k stars 152 forks source link

Added <avatar> object #196

Open JanluOfficial opened 5 months ago

JanluOfficial commented 5 months ago

grafik (Ignore the first five commits)

Let me introduce the newest technology in webx: Avatars!

Utilizing the libadwaita avatar object, you can now add avatars directly to your webpage using the tag. Here's how it works.

<avatar size="caseoh" text="Case Oh" src="path/to/caseoh.png"/>

Size

This attribute controls the size of the avatar object. There are a select few pre-set sizes.

Additionally, if a number is entered, the size will be set to that. If not defined, it will default to 48.

Text

This attribute is used to show initials on the avatar. This is only really useful if you don't apply an image to the avatar. If not defined, an avatar icon will be shown.

Src

This attribute defines the image set in the avatar. If not defined, the default icon/initials will be used. If the image is unable to load, the avatar will simply turn invisible, which is not intentional but I'm too lazy to fix it.

JanluOfficial commented 5 months ago

I don't know why there's 25 removed lines, I don't remember doing that. They didn't impact me during testing though.

inventionpro commented 5 months ago

This is very cool, is there a way for the avatars to not be a perfect circle? maybe like a rounded square or just a square

JanluOfficial commented 5 months ago

This is very cool, is there a way for the avatars to not be a perfect circle? maybe like a rounded square or just a square

@inventionpro unfortunately not currently. Since I'm using libadwaitas built in Avatar Object, it's limited to a circle. Maybe in the future, I can try to rework it to use a regular image, so it can be a rounded square.