Post by Reyn on Mar 13, 2021 20:36:17 GMT
[attr="style","color:black;background:url(https://i.imgur.com/rT6jxSN.png);background-size:100%;width:1000px;"]
[attr="style","height:600px;"]
[attr="style","background-color:#BDBDBD;cursor:not-allowed;"]
[attr="style","float:left;width:15%;height:30px;"]
[attr="style","width:60%;float:left;height:30px;"]
[attr="style","padding-bottom:5px;height:100%;"]
[attr="style","padding:2px"]
[attr="style","border:2px #AAAAAA outset;height:25px;position:relative;"]
[attr="style","overflow:hidden;white-space:nowrap;padding-left:5px;padding-top:3px;font-size:120%;"] Start
[attr="style","width:auto;float:right;height:25px;padding-top:5px;border-left:2px solid white;border-right:2px solid white;padding-left:4px"]📄x⏰x
[attr="style","float:right;width:10%;height:30px;border-left:2px solid white;"]
[PTabbedContent][PTab=1️⃣ Window One][attr="style","padding-bottom:5px;height:100%;"]
[attr="style","padding:2px"]
[attr="style","border:2px #AAAAAA inset;height:25px;position:relative;"]
[attr="style","overflow:hidden;white-space:nowrap;padding-left:5px;padding-top:3px;font-size:110%;"]📅 21:32
[attr="style","position:absolute;top:-500px;left:-50px;background-color:white;width:700px;border:2px #AAAAAA outset"]
[/PTab={tab-background:url(https://i.imgur.com/ZJSjCsL.png);tab-background-size:cover;tab-color:black;tab-font-size:120%;tab-selected-background:url(https://i.imgur.com/NuUsZA3.png);tab-selected-background-size:cover;tab-hover-background:url(https://i.imgur.com/FaNqaKQ.png);tab-hover-background-size:cover;tab-text-align:left;tab-padding:5px}][PTab=2️⃣ Window Two][attr="style","color:white;background: linear-gradient(90deg, rgba(0,3,123,1) 0%, rgba(8,126,203,1) 100%);padding:3px;font-size:120%;text-align:right"]
[attr="style","float:left"]Window One
[attr="style,"border:2px #AAAAAA outset;display:inline;background-color:#bdbdbd;color:black;font-family:monospace;padding-left:4px;padding-right:4px;cursor:not-allowed;"]?
[attr="style,"border:2px #AAAAAA outset;display:inline;background-color:#bdbdbd;color:black;font-family:monospace;padding-left:4px;padding-right:4px;cursor:not-allowed;"]X
[attr="style","overflow:auto;height:400px;cursor:auto;background-color:white;color:black;"]CONTENT FOR FIRST LITTLE THING
[attr="style","position:absolute;top:-600px;left:0px;background-color:white;width:800px;border:2px #AAAAAA outset"]
[/PTab={tab-background:url(https://i.imgur.com/ZJSjCsL.png);tab-background-size:cover;tab-color:black;tab-font-size:120%;tab-selected-background:url(https://i.imgur.com/NuUsZA3.png);tab-selected-background-size:cover;tab-hover-background:url(https://i.imgur.com/FaNqaKQ.png);tab-hover-background-size:cover;tab-text-align:left;}][PTab=3️⃣ Window Three][attr="style","color:white;background: linear-gradient(90deg, rgba(0,3,123,1) 0%, rgba(8,126,203,1) 100%);padding:3px;font-size:120%;text-align:right"]
[attr="style","float:left"]Window Two
[attr="style,"border:2px #AAAAAA outset;display:inline;background-color:#bdbdbd;color:black;font-family:monospace;padding-left:4px;padding-right:4px;cursor:not-allowed;"]?
[attr="style,"border:2px #AAAAAA outset;display:inline;background-color:#bdbdbd;color:black;font-family:monospace;padding-left:4px;padding-right:4px;cursor:not-allowed;"]X
[attr="style","overflow:auto;cursor:auto;height:450px;background-color:white;color:black;"]CONTENT FOR SECOND LITTLE THING
[attr="style","position:absolute;top:-600px;left:-100px;color:white;width:850px;background-color:white;border:2px #AAAAAA outset"]
[/PTab={tab-background:url(https://i.imgur.com/ZJSjCsL.png);tab-background-size:cover;tab-color:black;tab-font-size:120%;tab-selected-background:url(https://i.imgur.com/NuUsZA3.png);tab-selected-background-size:cover;tab-hover-background:url(https://i.imgur.com/FaNqaKQ.png);tab-hover-background-size:cover;tab-text-align:left;}][/PTabbedContent={border:0px;padding:0px;cursor: default;}][attr="style","color:white;background: linear-gradient(90deg, rgba(0,3,123,1) 0%, rgba(8,126,203,1) 100%);padding:3px;font-size:120%;text-align:right"]
[attr="style","float:left"]Window Three
[attr="style,"border:2px #AAAAAA outset;display:inline;background-color:#bdbdbd;color:black;font-family:monospace;padding-left:4px;padding-right:4px;cursor:not-allowed;"]?
[attr="style,"border:2px #AAAAAA outset;display:inline;background-color:#bdbdbd;color:black;font-family:monospace;padding-left:4px;padding-right:4px;cursor:not-allowed;"]X
[attr="style",";height:490px;overflow:auto;background-color:white;color:black"]CONTENT FOR THE THIRD LITTLE WINDOW THING
[attr="style","border-bottom:2px solid #505050;transform:translate(0px, -10px);width:74.2%;margin-left:15.3%"]
[attr="style","font-size:75%"]Code by Reyn
IMPORTANT THINGS TO NOTE
- DO NOT remove the credit line
- images dont work in the tab part of the tab, so you have to use text and emojis only
- you CAN NOT change the colour scheme of the bottom bar, UNLESS you're willing to edit the images used as background for the tabs
- all windows are set to overflow:auto by default. they should be, anyway. if it doesnt scroll, maybe put one in there.
- you can change the background image, gradient colour, add a cursor, etc.
- i think this will break if you add more windows
ctrl+f "CONTENT FOR" to find the 3 editable zones, ctrl+f "Window" to find the window titles
this code is extremely temperamental and kinda complicated, which is why its not in div templates. you are free to use this one (WITH CREDIT), but i highly recommend keeping in contact with me (discord, rpf dms, whatever) if you intend on using or editing this, since it's really.... it's really dense and spaghetti.
i would say have fun but i dont think you will