wip

 

TEXT GOES HERE!!!

super

long

text

box

with

break lines

in-between

so this can look lengthy without lorem ipsum

<raw-code> <!-- TV Frame --> <div style="display:flex; gap: 10px; padding: 10px; background-color: #160d0c; width: fit-content; box-shadow: 0px 0px 5px 2px #bbb; border-top: 3px solid #422622; border-radius: 5px; border-right: 3px solid #422622;"> <div style="background-image: url('https://i.imgur.com/Z0BtAUE.jpg'); width: 60px; padding: 10px 5px; background-size: cover; border-radius: 15px; display: flex; align-items: center; justify-content: center;"> <img src="https://i.imgur.com/ae0oceY.png" style="opacity: 0.6;"> </div> <div style="background-color: #5d5a56b0; width: 20px; display: flex; flex-direction: column; border-radius: 2px; align-items: center; justify-content: flex-start; padding: 2px 0; gap: 5px;"> <div style="background-color: #202020; display: flex; flex-direction:column; gap: 2px; padding: 2px; border-radius: 2px;"> <span style="background-color: #404a54; padding: 3px; border-radius: 50%; border: 1px solid #262c32;"> </span> <span style="background-color: #404a54; padding: 3px; border-radius: 50%; border: 1px solid #262c32; display: block;"> </span> </div> <div style="background: repeating-linear-gradient(#000, transparent 2.5px); color: #747e88; width: 10px;">   </div> </div> </div> <!-- SMPTE Bars --> <div style="display: flex; gap: 10px;"> <div style="min-width: 50px; display: grid; grid-template-columns: 35% 25% 40%; grid-template-rows: repeat(28, 1fr); gap: 0;"> <span style="background-color: blue;grid-column: 1; grid-row: span 4"></span> <span style="background-color: red;grid-column: 1;grid-row: span 4"></span> <span style="background-color: magenta;grid-column: 1; grid-row: span 4"></span> <span style="background-color: lawngreen;grid-column: 1;grid-row: span 4;"></span> <span style="background-color: cyan;grid-column: 1;grid-row: span 4"></span> <span style="background-color: yellow;grid-column: 1;grid-row: span 4"></span> <span style="background-color: #e6e6e6; grid-column: 1; grid-row: span 4"></span> <span style=" background-color: #e6e6e6; grid-column: 2; grid-row: 1 / 5"></span> <span style=" background-color: black; grid-column: 2; grid-row: 5 / 9"></span> <span style="background-color: cyan; grid-column: 2; grid-row: 9 / 13"></span> <span style=" background-color: black; grid-column: 2; grid-row: 13 / 17"></span> <span style=" background-color: magenta; grid-column: 2;grid-row: 17 / 21"></span> <span style=" background-color: black; grid-column: 2;grid-row: 21 / 25"></span> <span style=" background-color: blue; grid-column: 2;grid-row: 25 / 29"></span> <span style="background-color: black; grid-column: 3; grid-row: 1 / 14;"></span> <span style="background-color: purple; grid-column: 3; grid-row: 14 / 19;"></span> <span style="background-color: #e6e6e6; grid-column: 3; grid-row: 19 / 24;"></span> <span style=" background-color: teal; grid-column: 3; grid-row: 24 / 29;"></span> </div> </raw-code> <div> TEXT GOES HERE!!! </div> </div>