Help [BBCodeRequest] Can you help me?

[screaming.virgo]

Hello!

I have a strange request that may or may not be possible, but like, y'all are stunning coders on here.

I'm looking for an IC event post template. Something like an e-vite (I'm aging myself, but go with me here).
It would be cool for it to look like an envelop that opens to a second block with the text information (with a hidden scroller because I'm spoiled now).
If it could be mobile friendly, that would rock my socks, but I'm not gonna argue if it's not even possible.

Let me know if you have questions. More information can be found at the request page here.
( lavendre - I used one of your templates and your notes in the code were very helpful. Thank you so so much for your awesome work!)

Molly
She/Her

 

[Ayama]

Since this is beyond my current knowledge and skills...
sox constellation -summons the masters- xD

​

 

[screaming.virgo]

Since this is beyond my current knowledge and skills...
sox constellation -summons the masters- xD

​

I feel blessed <Offers cookies to the BBCode Masters>

 

[weldherwings]

do you mean something like this?

[div class=body][div class=rectangle][/div][div class=triangle][/div][div class=seal][/div] [div class=note][div class="scroll1"]Lorem ipsum dolor sit amet, habeo postea commodo sed ei, agam dicat disputando an vis. Aliquid eleifend sed ne, te brute labores eum. Sit velit deterruisset ne, liber periculis salutatus his eu, ex dicunt euismod sententiae sit. Nonumy eligendi reprehendunt ne mea, altera nostrud facilis et eam. Suavitate philosophia qui an, vis in natum nonumy dictas. Cu dicit putant nusquam quo, nec ei audire impedit tibique, modus utroque disputando at vis. Diceret consetetur mei at. Pro facer euismod ocurreret an. Fastidii tacimates vix te. Id sumo velit accusamus vim, nam no vero viris. Ut pri ullum propriae atomorum, ex vis soluta aliquip. Per ea tritani quaeque. Vim ut noluisse invenire perpetua, duo aperiam graecis ocurreret ad. Ea choro commodo per. Utinam consequat inciderint ne per. Albucius scaevola vix ut. Eam ad amet rebum, nam minimum consequuntur an, et option laoreet usu. At choro phaedrum liberavisse cum, ne natum appellantur vim, facete quodsi virtute an ius. Aeque dignissim mel in, cu vim rebum incorrupte, ad choro detracto antiopam est. Vix ex laudem liberavisse, epicuri recusabo ad vel. Persius detraxit quaerendum cum ad. At pri facer noluisse. Nec elitr intellegat efficiantur et. No nam omnium rationibus temporibus. Altera animal at ius. Vix cu iracundia scribentur, ut pri deterruisset definitionem.[/div][/div] [/div] [class=body]width:500px; height:400px; position:relative; margin:auto;[/class] [class=triangle]position:absolute;clip-path: polygon(51% 29%, 0 0, 100% 0); width:480px; height:600px; background-color:#f2bf68; [/class] [class=rectangle]width:480px; height:300px; background-color: #f0c273;position:absolute;[/class] [class=seal]cursor: pointer; width:150px; height:150px; background:URL(https://i.ya-webdesign.com/images/wax-seal-stamp-png-letters-8.png); background-size:cover; position:absolute; top:80px; left:165px;[/class] [class name=scroll1]width: 100%;height: 100%; overflow: hidden;box-sizing: content-box;padding-right:30px; overflow-Y: scroll;overflow-X: hidden; font-family:Karla; font-size:16px;line height:15px; letter-spacing:-0.5px;[/class] [class=note]width:460px; height:280px; background-color: #fcd99d;position:absolute; display:none; padding:10px; overflow:hidden;[/class] [class=flipup]animation-name: {post_id}flip1; animation-duration: 6s; animation-iteration-count: 1; [/class] [script class=seal on=click] addClass flipup triangle fadeToggle 3000 triangle fadeToggle 2000 rectangle fadeToggle 50 seal fadeToggle 4000 note[/script] [animation=flip1][keyframe=0] transform: translateY(0px); opacity: 1;[/keyframe] [keyframe=100] transform: translateY(-1000px); opacity: 0;[/keyframe] [/animation]

 

[screaming.virgo]

do you mean something like this?

[div class=body][div class=rectangle][/div][div class=triangle][/div][div class=seal][/div] [div class=note][div class="scroll1"]Lorem ipsum dolor sit amet, habeo postea commodo sed ei, agam dicat disputando an vis. Aliquid eleifend sed ne, te brute labores eum. Sit velit deterruisset ne, liber periculis salutatus his eu, ex dicunt euismod sententiae sit. Nonumy eligendi reprehendunt ne mea, altera nostrud facilis et eam. Suavitate philosophia qui an, vis in natum nonumy dictas. Cu dicit putant nusquam quo, nec ei audire impedit tibique, modus utroque disputando at vis. Diceret consetetur mei at. Pro facer euismod ocurreret an. Fastidii tacimates vix te. Id sumo velit accusamus vim, nam no vero viris. Ut pri ullum propriae atomorum, ex vis soluta aliquip. Per ea tritani quaeque. Vim ut noluisse invenire perpetua, duo aperiam graecis ocurreret ad. Ea choro commodo per. Utinam consequat inciderint ne per. Albucius scaevola vix ut. Eam ad amet rebum, nam minimum consequuntur an, et option laoreet usu. At choro phaedrum liberavisse cum, ne natum appellantur vim, facete quodsi virtute an ius. Aeque dignissim mel in, cu vim rebum incorrupte, ad choro detracto antiopam est. Vix ex laudem liberavisse, epicuri recusabo ad vel. Persius detraxit quaerendum cum ad. At pri facer noluisse. Nec elitr intellegat efficiantur et. No nam omnium rationibus temporibus. Altera animal at ius. Vix cu iracundia scribentur, ut pri deterruisset definitionem.[/div][/div] [/div] [class=body]width:500px; height:400px; position:relative; margin:auto;[/class] [class=triangle]position:absolute;clip-path: polygon(51% 29%, 0 0, 100% 0); width:480px; height:600px; background-color:#f2bf68; [/class] [class=rectangle]width:480px; height:300px; background-color: #f0c273;position:absolute;[/class] [class=seal]cursor: pointer; width:150px; height:150px; background:URL(https://i.ya-webdesign.com/images/wax-seal-stamp-png-letters-8.png); background-size:cover; position:absolute; top:80px; left:165px;[/class] [class name=scroll1]width: 100%;height: 100%; overflow: hidden;box-sizing: content-box;padding-right:30px; overflow-Y: scroll;overflow-X: hidden; font-family:Karla; font-size:16px;line height:15px; letter-spacing:-0.5px;[/class] [class=note]width:460px; height:280px; background-color: #fcd99d;position:absolute; display:none; padding:10px; overflow:hidden;[/class] [class=flipup]animation-name: {post_id}flip1; animation-duration: 6s; animation-iteration-count: 1; [/class] [script class=seal on=click] addClass flipup triangle fadeToggle 3000 triangle fadeToggle 2000 rectangle fadeToggle 50 seal fadeToggle 4000 note[/script] [animation=flip1][keyframe=0] transform: translateY(0px); opacity: 1;[/keyframe] [keyframe=100] transform: translateY(-1000px); opacity: 0;[/keyframe] [/animation]

Oh my goodness. YES.
You're a beauty of a mind reader, Would you mind if I changed the color to deep blue (or if you are able to that would rock).

 

[weldherwings]

Go for it dude! Here are the color references :3 feel free to change font, seal image, colors, font sizes etc :3

note bg color - #fcd99d

rectangle bg color - #f0c273

triangle bg color - #f0c273

 

[Ayama]

weldherwings Wow, that is awesome >w<

​

 

[screaming.virgo]

weldherwings You're incredible! Thank you so so much!

 

[constellation]

glad to see you’ve been assisted! sorry i couldn’t be here earlier, timezones suck c:

 

[sox]

oof i didn't see this either ;-; i'm glad it worked out!

 

[screaming.virgo]

glad to see you’ve been assisted! sorry i couldn’t be here earlier, timezones suck c:

oof i didn't see this either ;-; i'm glad it worked out!

That is all okay! Thank you for checking in!