I found that the "EWRmedio_MediaView_Sidebar" "create new Playlist" is breaking out of the container. I cannot figure out what to change. Here is the code.
<xen:sidebar>
<xen:if is="{$playlist}">
<div class="section" id="Playlist">
<div class="secondaryContent mediaSmall">
<h3>{xen
hrase playlist_details}</h3>
<div style="font-size: 1.3em; margin-bottom: 10px; text-align: center;">
<b><a href="{xen:link 'media/playlist', $playlist}">{$playlist.playlist_name}</a></b>
</div>
<ul>
<xen:if is="{$playlist.prev}">
<li>
<div class="mediaContent">
<div style="position: relative;" title="{$playlist.prev.media_title}">
<div class="overlays" style="bottom: 7px; right: 5px;"><b>{$playlist.prev.media_minutes}:{$playlist.prev.media_seconds}</b></div>
<a href="{xen:link 'media/media', $playlist.prev, 'id={$playlist.playlist_id}'}"><img src="{xen:helper medio, $playlist.prev}" border="0" style="width: 100%;" alt="{$playlist.prev.media_title}" /></a>
</div>
<b>« {xen
hrase previous}</b>
</div>
</li>
<xen:else />
<li><div class="mediaContent">
<img src="styles/8wayrun/media_blank.png" border="0" style="width: 100%;" alt="" /><br />
<span class="muted"><b>« {xen
hrase previous}</b></span>
</div></li>
</xen:if>
<xen:if is="{$playlist.next}">
<li>
<div class="mediaContent">
<div style="position: relative;" title="{$playlist.next.media_title}">
<div class="overlays" style="bottom: 7px; right: 5px;"><b>{$playlist.next.media_minutes}:{$playlist.next.media_seconds}</b></div>
<a href="{xen:link 'media/media', $playlist.next, 'id={$playlist.playlist_id}'}"><img src="{xen:helper medio, $playlist.next}" border="0" style="width: 100%;" alt="{$playlist.next.media_title}" /></a>
</div>
<b>{xen
hrase next} »</b>
</div>
</li>
<xen:else />
<li><div class="mediaContent">
<img src="styles/8wayrun/media_blank.png" border="0" style="width: 100%;" alt="" /><br />
<span class="muted"><b>{xen
hrase next} »</b></span>
</div></li>
</xen:if>
</ul>
<xen:if is="{$playlist.next} && {$media.service_name} == 'YouTube'">
<div style="margin-top: 5px; text-align: center;">
<label for="ctrl_autoplay">
<input type="checkbox" name="autoplay" value="1" id="ctrl_autoplay" CHECKED>
<span style="font-size: 1.1em;">{xen
hrase autoplay_next_item_in_playlist}</span>
<p class="muted">{xen
hrase only_supported_by_x, 'services=YouTube'}</p>
</label>
</div>
<script language="javascript">
var tag = document.createElement('script');
tag.src = "//
www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
function onYouTubeIframeAPIReady() {
new YT.Player('ytplayer', {
events: {
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.ENDED && document.getElementById('ctrl_autoplay').checked) {
window.location="{xen:link 'media/media', $playlist.next, 'id={$playlist.playlist_id}'}";
}
}
</script>
</xen:if>
</div>
</div>
</xen:if>
<div class="section mediaDetails" id="Details">
<div class="secondaryContent">
<h3>
{xen
hrase media_details}
<div style="float: right;">
<xen:if is="{$perms.mod} || {$media.user_id} === {$visitor.user_id}">
(<a href="{xen:link 'media/media/edit', $media}">{xen
hrase edit}</a>)
</xen:if>
</div>
</h3>
<div style="text-align: center;">
<span style="font-size: 1.4em"><b>{xen
hrase date_x_at_time_y, 'date={xen:date $media.media_date}', 'time={xen:time $media.media_date}'}</b></span><br />
{xen
hrase posted_by} <a href="{xen:link 'media/user', $media}">{$media.username}</a><br />
<br />
{xen:raw $media.HTML}<br />
<br />
<xen:if hascontent="true">
<div class="pairsJustified" style="margin-left: 30px; margin-right: 30px;">
<xen:contentcheck>
<xen:foreach loop="$customs" value="$custom">
<dl>
<dt>{$custom.name}:</dt>
<dd>{$custom.value}</dd>
</dl>
</xen:foreach>
</xen:contentcheck>
</div>
<br />
</xen:if>
<xen:include template="EWRmedio_Bit_Keywords" />
<xen:include template="EWRmedio_Bit_Users" />
<div id="mediaStats">
<span style="font-size: 1.4em"><b><a href="{xen:link 'media/category', $media}">{$media.category_name}</a></b></span><br />
{xen
hrase comments}: {$media.media_comments} - {xen
hrase likes}: {$media.media_likes} - {xen
hrase views}: {$media.media_views}<br />
<br />
</div>
<input type="text" name="media_url" value="{xen:link 'full:media/media', $media}" readonly="readonly" class="textCtrl" style="width: 200px;" onclick="this.focus(); this.select()" /><br />
<input type="text" name="bbcode" value="[medio]{$media.media_id}[/medio]" readonly="readonly" class="textCtrl" style="width: 200px;" onclick="this.focus(); this.select()" />
</div>
</div>
</div>
<xen:if is="{$perms.keyword}">
<div class="section" id="Keywords">
<div class="secondaryContent">
<h3>{xen
hrase tag_keywords}</h3>
<div style="text-align: center;">
<form action="{xen:link 'media/media/keywords', $media}" method="post" class="KeywordEdit AutoValidator">
<input type="search" name="keywords" value="" id="keywordAdd" placeholder="{xen
hrase media_keyword}..." results="0" class="textCtrl AutoComplete"
data-autoSubmit="true" data-acurl="{xen:link media/keyword/find}" autocomplete="off" style="width: 200px;" />
<input type="hidden" name="_xfToken" value="{$visitor.csrf_token_page}" />
</form>
</div>
</div>
</div>
<div class="section" id="Users">
<div class="secondaryContent">
<h3>{xen
hrase tag_users}</h3>
<div style="text-align: center;">
<form action="{xen:link 'media/media/users', $media}" method="post" class="UserEdit AutoValidator">
<input type="search" name="users" value="" id="userAdd" placeholder="{xen
hrase media_username}..." results="0" class="textCtrl AutoComplete"
data-autoSubmit="true" autocomplete="off" style="width: 200px;" />
<input type="hidden" name="_xfToken" value="{$visitor.csrf_token_page}" />
</form>
</div>
</div>
</div>
</xen:if>
<xen:if is="{$perms.playlist}">
<div class="section" id="Playlists">
<div class="secondaryContent">
<h3>{xen
hrase add_to_playlist}</h3>
<form action="{xen:link 'media/playlist/addto'}" method="post" style="text-align: center;">
<select name="playlist_id" id="ctrl_playlist" class="textCtrl autoSize" style="margin-bottom: 10px;">
<option value="0">({xen
hrase create_new_playlist})</option>
<xen:if is="{$playlistList}">
<xen:foreach loop="$playlistList" value="$list">
<option value="{$list.playlist_id}">{xen:raw $list.playlist_name}</option>
</xen:foreach>
</xen:if>
</select>
<input type="submit" value="{xen
hrase add_to_playlist}" name="submit" accesskey="s" class="button primary" />
<input type="hidden" name="media_id" value="{$media.media_id}" />
<input type="hidden" name="_xfToken" value="{$visitor.csrf_token_page}" />
</form>
</div>
</div>
</xen:if>
<xen:include template="sidebar_share_page">
<xen:set var="$url">{xen:link canonical:media/media, $media}</xen:set>
</xen:include>
</xen:sidebar>