10billionghosts | code: TELEGRAM

TELEGRAM

Gummies pudding lollipop toffee chupa chups brownie. Bonbon bear claw apple pie dessert soufflé cookie bear claw. Dragée liquorice candy muffin lemon drops pie. Jelly beans tiramisu biscuit pie chocolate dessert dragée chocolate bar. Jujubes fruitcake pudding tart oat cake. Danish fruitcake muffin tiramisu chocolate powder soufflé dragée. Dragée pastry sweet roll croissant cupcake sweet roll.

Marshmallow topping candy sesame snaps sweet roll cotton candy cake cake marzipan. Danish toffee soufflé biscuit pie macaroon chocolate bar chupa chups. Cotton candy wafer candy canes chupa chups chocolate. Jelly beans lemon drops tart gingerbread lollipop. Jelly beans lemon drops cake croissant marshmallow powder.

code

Desperately wanted to release a code after so long without. So! Here's a simple block text code you can use for info pages or announcements or permissions or what have you.

GET THE CODE:

<lj-raw><div style="width:100%;max-width:550px;min-height:100px;margin:0 auto;display:grid;grid-template-columns:8px 1fr 16px;grid-template-rows:22px 8px 1fr 15px;gap:0;font-family:courier;color:#000;">

<div style="box-sizing:border-box;grid-column-start:1;grid-column-end:3;grid-row-start:1;grid-row-end:2;font-size:22px;font-weight:bold;letter-spacing:1.5px;text-align:right;line-height:1.3;color:#c42359">HEADER</div>

</lj-raw>YOUR TEXT HERE<lj-raw>

</div>

<div style="grid-column-start:3;grid-column-end:4;grid-row-start:3;grid-row-end:4;height: calc(100% + 7px);transform: skewY(45deg);border:4px solid #000;border-bottom:0;background:#c42359;"></div>

<div style="box-sizing:border-box;grid-column-start:2;grid-column-end:3;grid-row-start:4;grid-row-end:5;width: calc(100% + 10px);transform: skewX(45deg);border:4px solid #000;background:#c42359;"></div>

<div style="grid-column-start:1;grid-column-end:3;grid-row-start:5;text-align:right;font-size:10px;"><a title="code credit!" href="http://10billionghosts.dreamwidth.org" style="text-decoration:none;color:#ccc;">code</a></div>

</div></lj-raw>

HOW TO USE:

❣️ Mind those lj-raw tags!!

❣️ This code is mobile compatible! It is probably insanejournal friendly, but is not optimized for insanejournal and so may not look 100% over there.

❣️ By default, the text body is set to courier. Search for "font-family:courier" and change to the web safe font you'd prefer. You can adjust the text size for the body by changing "font-size:13px." Aaaand for alignment, change "text-align:justify" - you can set it to left (how text usually looks), center, or right.

❣️ Paste your text body where indicated in the code: the part that says YOUR CONTENT HERE.

❣️ Don't forget to update the "HEADER" placeholder text! You can also delete the word HEADER and forego a header entirely.

❣️ For updating colors:

hex code #c42359 is the color for the header text and the drop shadow effect.
hex code #fcfcf2 is the off-white color used for the background of the main text area.
hex code #000 is just black, and is used for both the body text and the border.

❣️ This code comes with a credit by default. Appreciate it if you leave it in!

❣️ I love peeking at what people do with my codes, so feel free to comment if you use! If you're feeling generous, you can also donate to my ko-fi -- it's always greatly appreciated!

Flat | Top-Level Comments Only

I know this looks really simple but I kind of lost my mind over how you used skew for this. It looks dope. I love it. Great idea and great job. Your codes are always so so cool.

aaaa THANK YOU!! I'm glad you like my codes ;u;

I feel like there must've been an easier way to achieve this effect lmao but I was hellbent on using skew for it. There is a discord group chat out there in the universe spammed with progress shots and proof of me going slowly mad trying to get it to work lmao

If there is an easier way, I'm definitely not sure of it. I get that same feeling every time I try out something new, too, though, lmao. ♥♥ But YEAH your codes are super cool and I love how your always making NEW stuff and testing out NEW things. It's very fun seeing your stuff. ♥

code: TELEGRAM - a simple info code

no subject

no subject

no subject