Sharks are cool and comfortable!


Elden Thing | Back & Body Hurts Platinugggggh Rewards Member


Profile pic and banner credits: sharkaeopteryx art by @superkiak! eggbug by eggbug! Mash-up by me!
[Alt-text for pfp: a cute sharkaeopteryx sat on the ground with legs out, wings down, jaw ajar, and hed empty, looking at eggbug and eggbug's enigmatic smile.]
[Alt-text for banner: a Spirit Halloween banner with eggbug and the sharkaeopteryx that Superkiak drew for me looking at it with inscrutable expressions]


I'm a Vietnamese cis woman born and currently living in the U.S. You may know me from Sandwich, from Twitter or Mastodon (same username), or on Twitch as Sharkaeopteryx. I do not have a Discord or Bluesky account.

Ask me about language learning/teaching, cooking/eating food, late diagnosis ADHD, and volunteer small business mentoring. Or don't, I'm not the boss of you.


I think people deserve to be young, make mistakes, and grow without being held to standards they don't know about yet and are still learning. So, if you are under 22, please don't try to strike up a friendship or get involved in discussions on my posts.


Please don't automatically assume I follow/know/co-sign someone just because I reposted something from them—sometimes I do, sometimes I don't. Also, if you think being removed as a follower when we're not mutuals is a cardinal sin, please do not follow me.


🐘Mastodon
search for @sharksonaplane@mastodon.sandwich.net and hit follow if you want
Hang out with me on the Auldnoir forum! (you can DM there!)
discourse.auldnoir.org/
Follow me on Twitch
twitch.tv/sharkaeopteryx
Add my RSS feed (not working yet but I'll get to it!)
sharkaeopteryx.neocities.org/rss.xml

Lexfeathers
@Lexfeathers

Here's that template that I wrote for my intro post! I recommend using a code editor like sublime text and pasting your work into the post body to make it easier to see what's going on.

The default template looks like this:


DESCRIBE_THE_IMAGE

Say hello with some paragraph tags! To visually separate paragraphs on the page, stick each paragraph in a set of P tags.

Like this :)

The title of your collapsible tab

DESCRIBE_THE_IMAGE

This is where the blurb about your tab's contents goes. You can have as many of these as you want, just copy the whole details section and paste it below this one, before the closing div tag.

The title of your collapsible tab

DESCRIBE_THE_IMAGE

Like this!

And the code is here:

<!-- 

Header Section with your image and intro!

- Replace the img src with a link to your photo
- You can choose your own border gradient by replacing the "orange" and "darkred" in the first div with whichever colours you want.

-->

<section>
	<figure style="padding: 1rem; margin-bottom: 0.5rem;">
		<div style="background: linear-gradient(to bottom, orange, darkred); border-radius: 200px; overflow: hidden; width: 200px; height: auto; margin: 0.75rem auto 0 auto; border-radius:200px; overflow: hidden;">
			<div style="text-align:center; padding: 0.5rem;">
				<img style="margin:0; border-radius:200px; overflow: hidden;" width="200px" height="auto" src="https://media.discordapp.net/attachments/905515054923923508/992532005017374820/eggbug_on_white.png" title="HOVER_TEXT_GOES_HERE" alt="DESCRIBE_THE_IMAGE">
			</div>
		</div>
		<p>Say hello with some paragraph tags! To visually separate paragraphs on the page, stick each paragraph in a set of P tags.</p>
		<p>Like this :)</p>
	</figure>
</section>

<!-- Collapsible tabs section! 

- To change the tab section's border colour, replace the "darkred" in the opening div tag's styles with your colour choice.
- Same thing as before, replace the img src URLs with your own :)

-->

<section>
	<div style="background-color: darkred; border: 1px solid darkred; border-radius: 4px; padding: 0.2rem; padding-bottom: 0;">
		<details style="margin-bottom: 0.2rem; background-color: white; border-radius: 4px; padding:1rem;" title="HOVER_TEXT_GOES_HERE">
			<summary>
				<h4 style="display: inline-block; margin: auto;">The title of your collapsible tab</h4>
			</summary>
				<a href="LINK_URL_GOES_HERE_IF_YOU_WANT_A_LINK_ON_THIS_IMAGE" target="_blank" title="HOVER_TEXT_GOES_HERE">
					<img style="margin: 0.75rem auto 0 auto;" width="150px" height="auto" src="https://media.discordapp.net/attachments/905515054923923508/992532005017374820/eggbug_on_white.png" alt="DESCRIBE_THE_IMAGE" title="HOVER_TEXT_GOES_HERE">
				</a>
			<p>This is where the blurb about your tab's contents goes. You can have as many of these as you want, just copy the whole details section and paste it below this one, before the closing div tag.</p>
		</details>
		<details style="margin-bottom: 0.2rem; background-color: white; border-radius: 4px; padding:1rem;" title="HOVER_TEXT_GOES_HERE">
			<summary>
				<h4 style="display: inline-block; margin: auto;">The title of your collapsible tab</h4>
			</summary>
				<a href="LINK_URL_GOES_HERE_IF_YOU_WANT_A_LINK_ON_THIS_IMAGE" target="_blank" title="HOVER_TEXT_GOES_HERE">
					<img style="margin: 0.75rem auto 0 auto;" width="150px" height="auto" src="https://media.discordapp.net/attachments/905515054923923508/992532005017374820/eggbug_on_white.png" alt="DESCRIBE_THE_IMAGE" title="HOVER_TEXT_GOES_HERE">
				</a>
			<p>Like this!</p>
		</details>
	</div>
</section>

I hope this helps those who aren't too familiar with html or css. Enjoy ♥️


sharksonaplane
@sharksonaplane

My attempt at an introduction post (still in drafts) turned into an extra large Chef's Word Salad (add salmon) so I DEFINITELY need this 😅😅😅


You must log in to comment.

in reply to @Lexfeathers's post: