"Outside the Box" not showing the clip details panel

[Bucketsmith]

I'm not sure how I can set this up. The clip video is taking up the entire size of the box, Ideally I would want to keep the current clip info in a separate area of my scene, or at least place it at the bottom of the box in otherwise empty banner space. When I select 'outside the box', it just doesn't show the clip details anywhere.

[teklynk]

The "outside the box" is a styling option. It puts the streamer name above the video and the details below the video. Make sure that "Show channel name on top of video" and "Show clip details panel" is checked.

[Bucketsmith]

Okay, thanks. When I select that option, that is not how it is shown to me. It still puts the optional message at the top as a banner, and no clip information is seen. This is the CSS code it gives me:

container {

display: block;
padding: 4px;
margin: 4px;
text-align: center;

}

video { width: 100%; height: auto; max-height: 100%; border-radius: 10px; }

text-container {

width: 100%;
position: absolute;
top: 10vw;

}

.title-text { font-family: Basic, Helvetica, sans-serif; font-weight: bold; font-size: 5vw; word-wrap: break-word; color: #fff; text-align: center; text-shadow: 2px 2px #000; }

details-container {

position: absolute;
top: 36vw;
background: #00000090;
padding: 12px 24px 12px 24px;
margin-right: 24px;
border-radius: 0px 24px 24px 0px;
width: auto;
animation: fadeout 15s forwards;

}

details-container .details-text {

font-family: Basic, Helvetica, sans-serif;
font-weight: bold;
word-wrap: break-word;
color: #fff;
text-align: left;
text-shadow: 2px 2px #000;

}

details-container .details-text.item-0 {

font-size: 3vw;
font-weight: bold;

}

details-container .details-text.item-1 {

font-size: 2.5vw;
font-weight: normal;

}

details-container .details-text.item-2 {

font-size: 2vw;
font-weight: normal;

}

details-container .details-text.item-3 {

font-size: 1.5vw;
font-weight: normal;

}

[teklynk]

I see. Sorry for the confusion. When you select a theme, you do not need to use or provide the css in your browser source. You can pick a Theme OR use the custom css and modify it as needed. I suggest removing the custom css from your browser source or delete the browser source and create a new one.

[Bucketsmith]

AH, thank you. I thought it would update based on the default option you picked above it, so you had a base template of that specific option you could adjust. I'm having trouble understanding CSS so I'll pick a default theme and look in to it later.

[teklynk]

Hmm,that would be a good idea to make the Theme option actually show the css for the theme that you picked. The user could then copy that themes css and use it in the browser source. This way the user could pick a theme and modify it as needed. I will think about that.