As I was implementing the XFN relations to the links on the People page I figured that Madhvi used to be my sweetheart, but now is just someone I met (shit happens).
Since XFN doesn't offer a x-sweetheart relation of some sort —and I try to stick to the profile— I thought of what could be a semantically correct solution to this issue.
It wasn't too long for I realized that the del and ins elements would be the way to go.
This is the XHTML code I came up with:
<del><a rel="friend met sweetheart" href="#"><ins><a rel="met" href="#"><img alt="Madhvi Ghiraw" src="mad.jpg" /></a></ins></a></del>
I could even add dates and times, but I don't remember those by the second. Blah...
I also implimented some visual indications to the pictures of people on the People page about my relation to them (in a rather abstract way), using CSS.
For example; if the cursor is hovered over an image and the left border lights up green, this indicates I met that person (in real life
).
This only works in modern visual browsers that have above average support for CSS (Mozilla for example).
Here is the code so far:
:link[rel~='acquaintance']:hover img { border-top: 1px solid #33c !important }
:link[rel~='friend']:hover img { border-top: 1px solid #33f !important }
:link[rel~='met']:hover img { border-left: 1px solid #0c0 !important }
:link[rel~='muse']:hover img { background-color: #dcc !important }
:link[rel~='crush']:hover img { background-color: #ecc !important }
:link[rel~='date']:hover img { background-color: #fcc !important }
:link[rel~='sweetheart']:hover img { background-color: pink !important }
8:05 AM