vanzhiganov/clipbucket
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

quick list thumbs and design issue fixed

Browse source
This commit is contained in:
jamilrehman 2016-04-15 15:02:50 +05:00
parent c5436d9574
commit f559070c0f
7 changed files with 56 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
upload/styles/cb_28/layout/blocks/quicklist/fast_qlist.html
View file

@ -3,7 +3,8 @@
<div class="pl_num"></div>
<div class="pl_thumb">
<a href="{videoLink($ql_item)}" >
<img src="{getThumb vdetails=$ql_item size=168x105 }"/>
<img src="{getThumb vdetails=$ql_item size=168x105}" class="img-responsive" alt="">
<img src="{$theme}/images/thumb-ratio.png" alt="" class="thumb-ratio">
</a>
<span class="pl_duration">{if $ql_item.duration>1}{$ql_item.duration|SetTime}{else}00:00{/if}</span>
</div>

3
upload/styles/cb_28/layout/blocks/quicklist/video_block.html
View file

@ -5,7 +5,8 @@
<div class="pl_num">{$smarty.section.item.iteration}</div>
<div class="pl_thumb">
<a href="{videoLink($video)}" target="blank">
<img src="{getThumb vdetails=$video}"/>
<img src="{getThumb vdetails=$video}" class="img-responsive" alt="">
<img src="{$theme}/images/thumb-ratio.png" alt="" class="thumb-ratio">
</a>
<span class="pl_duration">{$video.duration|SetTime}</span>
</div>

37
upload/styles/cb_28/layout/blocks/videos/video.html
View file

@ -24,13 +24,13 @@
<img class="img-responsive" src="{getThumb vdetails=$video size=416x260 }">
</a>
<img src="{$theme}/images/thumb-ratio.png" class="thumb-ratio" alt="">
<div class="item-footer">
{ANCHOR place='in_video_thumb' data=$video}
<button data-quick="quick-{$video.videoid}"
class="icon-plus cb_quickie cb-btn-quick-{$video.videoid} {if in_array($video.videoid, $qlist_vids)}icon-tick{/if}" vtitle="{$video.title}" v-id="{$video.videoid}" vlink="{videoLink($video)}" vthumb="{getThumb vdetails=$video size=600x338 }" vduration="{$video.duration|SetTime}" title="Add {$video.title} to Quicklist">
</button>
<span class="duration">{if $video.duration>1}{$video.duration|SetTime}{else}00:00{/if}</span>
</div>
{ANCHOR place='in_video_thumb' data=$video}
<button data-quick="quick-{$video.videoid}"
class="icon-plus cb_quickie cb-btn-quick-{$video.videoid} {if in_array($video.videoid, $qlist_vids)}icon-tick{/if}" vtitle="{$video.title}" v-id="{$video.videoid}" vlink="{videoLink($video)}" vthumb="{getThumb vdetails=$video size=600x338 }" vduration="{$video.duration|SetTime}" title="Add {$video.title} to Quicklist">
</button>
<span class="duration">{if $video.duration>1}{$video.duration|SetTime}{else}00:00{/if}</span>
</div>
<div class="clearfix video-info">
<h2 class="title"><a href="{videoLink($video)}">{$video.title|truncate:50}</a></h2>
@ -52,13 +52,13 @@
<img class="lazy img-responsive" src="{getThumb vdetails=$video size=416x260 }">
</a>
<img src="{$theme}/images/thumb-ratio.png" class="thumb-ratio" alt="">
<div class="item-footer">
<span class="duration">{if $video.duration>1}{$video.duration|SetTime}{else}00:00{/if}</span>
{ANCHOR place='in_video_thumb' data=$video}
<button data-quick="quick-{$video.videoid}"
class="icon-plus add_icon cb_quickie cb-btn-quick-{$video.videoid} {if in_array($video.videoid, $qlist_vids)}icon-tick{/if}" vtitle="{$video.title}" v-id="{$video.videoid}" vlink="{videoLink($video)}" vthumb="{getThumb vdetails=$video size=600x338 }" vduration="{$video.duration|SetTime}" title="Add {$video.title} to Quicklist">
</button>
</div>
{ANCHOR place='in_video_thumb' data=$video}
<button data-quick="quick-{$video.videoid}"
class="icon-plus add_icon cb_quickie cb-btn-quick-{$video.videoid} {if in_array($video.videoid, $qlist_vids)}icon-tick{/if}" vtitle="{$video.title}" v-id="{$video.videoid}" vlink="{videoLink($video)}" vthumb="{getThumb vdetails=$video size=600x338 }" vduration="{$video.duration|SetTime}" title="Add {$video.title} to Quicklist">
</button>
<span class="duration">{if $video.duration>1}{$video.duration|SetTime}{else}00:00{/if}</span>
</div>
<div class="clearfix video-info">
<h2 class="title"><a href="{videoLink($video)}">{$video.title|truncate:50}</a></h2>
@ -103,13 +103,12 @@
<h2 class="title">{$video.title|truncate:50}</h2>
</a>
<img src="{$theme}/images/thumb-ratio.png" class="thumb-ratio" alt="">
<div class="item-footer">
<span class="duration">{if $video.duration>1}{$video.duration|SetTime}{else}00:00{/if}</span>
{ANCHOR place='in_video_thumb' data=$video}
<button data-quick="quick-{$video.videoid}"
<button data-quick="quick-{$video.videoid}"
class="icon-plus add_icon cb_quickie cb-btn-quick-{$video.videoid} {if in_array($video.videoid, $qlist_vids)}icon-tick{/if}" vtitle="{$video.title}" v-id="{$video.videoid}" vlink="{videoLink($video)}" vthumb="{getThumb vdetails=$video size=600x338 }" vduration="{$video.duration|SetTime}" title="Add {$video.title} to Quicklist">
</button>
</div>
</button>
<span class="duration">{if $video.duration>1}{$video.duration|SetTime}{else}00:00{/if}</span>
</div>
</div>
{/if}

2
upload/styles/cb_28/theme/css/all.css
View file

File diff suppressed because one or more lines are too long

2
upload/styles/cb_28/theme/css/all.css.map
View file

File diff suppressed because one or more lines are too long

2
upload/styles/cb_28/theme/js/fast_qlist.js
View file

@ -37,7 +37,7 @@
vduration = $(obj).attr("vduration");
if (notInList == true) {
$('<div style="display:none" class="qlist_item clearfix" style="background-color:#fff; " id="quicklist_playlist_cont_'+thevid+'"><div class="pl_num"></div><div class="pl_thumb"><a href="'+obj.attr("vlink")+'" ><img src="'+vthumb+'"/></a><span class="pl_duration">'+vduration+'</span></div><div class="pl_details" "><p><a href="'+vlink+'" >'+vtitle+'</a></p></div><button todel="'+thevid+'" class="ql_delete glyphicon glyphicon-trash btn btn-danger btn-sm" title="remove '+vtitle+' from qucklist" alt="quicklist"></button></div>').appendTo('#my_quicklist').fadeIn('slow');
$('<div style="display:none" class="qlist_item clearfix" style="background-color:#fff; " id="quicklist_playlist_cont_'+thevid+'"><div class="pl_num"></div><div class="pl_thumb"><a href="'+obj.attr("vlink")+'" ><img src="'+vthumb+'" class="img-responsive" ><img src="'+baseurl+'/styles/cb_28/theme/images/thumb-ratio.png" alt="" class="thumb-ratio"></a><span class="pl_duration">'+vduration+'</span></div><div class="pl_details" "><p><a href="'+vlink+'" >'+vtitle+'</a></p></div><button todel="'+thevid+'" class="ql_delete glyphicon glyphicon-trash btn btn-danger btn-sm" title="remove '+vtitle+' from qucklist" alt="quicklist"></button></div>').appendTo('#my_quicklist').fadeIn('slow');
}
$.cookie("quick_list_box", "show", { expires : 10 });

48
upload/styles/cb_28/theme/scss/all.scss
View file

@ -298,6 +298,7 @@ h1{
.thumb-holder{
position: relative;
z-index: 2;
color: $white;
.video-link{
position: absolute;
width: 100%;
@ -327,17 +328,23 @@ h1{
padding: 10px 94px 15px 10px;
margin: 0;
}
&:after{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 40px;
z-index: 2;
@include gradientbottom-bg();
}
}
.item-footer{
.duration,
.cb_quickie{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
z-index: 2;
padding:10px;
@include gradientbottom-bg();
overflow: hidden;
color: #fff;
z-index: 3;
bottom: 10px;
left: 10px;
}
.duration{
font-size: 14px;
@ -349,10 +356,10 @@ h1{
padding: 0 4px;
background: $black;
border-radius: 2px;
float: right;
left:auto;
right: 10px;
}
.cb_quickie{
float: left;
width: 24px;
height: 20px;
padding: 0;
@ -559,7 +566,7 @@ h1{
bottom:0;
right:0;
background-color:#f1f1f1;
width:350px;
width:350px;
color:#fff;
position:fixed;
z-index:1000;
@ -603,8 +610,10 @@ h1{
z-index:10;
}
.quicklist_cont{
float: left;
width: 100%;
height: 100%;
max-height: 334px;
overflow-y: auto;
display: none;
}
.my_quicklist{
@ -641,10 +650,15 @@ h1{
width: 100%;
height: 100%;
display: block;
}
.pl_thumb a img{
width: 100%;
height: 100%;
position: relative;
.img-responsive{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
}
.ql_delete{
position: absolute;