rating style updated
watch video completed 95%
This commit is contained in:
jamilrehman
parent
b2064091b2
commit
699e369d8e
8 changed files with 418 additions and 553 deletions
|
|
@ -1,53 +1,25 @@
|
|||
<!-- CB like and dislike section -->
|
||||
<div class="rating clearfix">
|
||||
<!--CB like and dislike section-->
|
||||
<div id="" class="clearfix rating">
|
||||
<div class="clearfix rating-holder">
|
||||
<div class="like-dislike">
|
||||
<a {if !$disable} onclick="rate('{$id}','5','{$type}')"{/if} href="javascript:void(0)" class="btn-like">Likes <i></i></a>
|
||||
<span>{$likes} Likes</span>
|
||||
<div class="likes like-dislike">
|
||||
<a {if !$disable} onclick="rate('{$id}','5','{$type}')"{/if} href="javascript:void(0)"><span class="icon-thumbup"></span></a>
|
||||
<span>{prettyNum($likes)}</span>
|
||||
</div>
|
||||
|
||||
<div id="circle"></div>
|
||||
|
||||
<div class="like-dislike">
|
||||
<a {if !$disable} onclick="rate('{$id}','1','{$type}')"{/if} href="javascript:void(0)" class="btn-dislike"><i></i> Dislike</a>
|
||||
<span>{$dislikes} Dislike</span>
|
||||
<div class="dislikes like-dislike">
|
||||
<a {if !$disable} onclick="rate('{$id}','1','{$type}')"{/if} href="javascript:void(0)"><span class="icon-thumbdown"></span></a>
|
||||
<span>{prettyNum($dislikes)}</span>
|
||||
</div>
|
||||
</div>
|
||||
{if $rating_msg}
|
||||
<div id="rating_result_container" class="like-error clearfix">
|
||||
{$rating_msg}
|
||||
<div id="rating_result_container" class="clearfix rating-alert">
|
||||
{if $rating_msg}{$rating_msg}{/if}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
var _percent = 0;
|
||||
|
||||
{if $perc}
|
||||
_percent = '{$perc}';
|
||||
_percent = parseInt(_percent);
|
||||
{/if}
|
||||
|
||||
var _numb = parseInt(_percent);
|
||||
if ( _numb > 49 )
|
||||
$('._percentage').addClass('likes_perc_more');
|
||||
else
|
||||
$('._percentage').addClass('likes_perc_less');
|
||||
|
||||
function updateLikeCircle(pre) {
|
||||
|
||||
if(pre)
|
||||
_percent=pre;
|
||||
|
||||
console.log('hello '+_percent);
|
||||
$( '#circle' ).progressCircle({
|
||||
nPercent : _percent,
|
||||
showPercentText : _percent,
|
||||
thickness : 5,
|
||||
/*circleSize : 50*/
|
||||
});
|
||||
}
|
||||
|
||||
updateLikeCircle();
|
||||
|
||||
var _percent = '{$perc}';
|
||||
var _numb = parseInt(_percent);
|
||||
if ( _numb > 49 )
|
||||
$('._percentage').addClass('likes_perc_more');
|
||||
else
|
||||
$('._percentage').addClass('likes_perc_less');
|
||||
</script>
|
||||
|
|
@ -1,81 +1,49 @@
|
|||
{$video=$vdo}
|
||||
{$type='video'}
|
||||
{$channel = $userquery->get_user_details($video.userid)}
|
||||
<div id="main" class="clearfix">
|
||||
<div class="custom-container clearfix">
|
||||
<div class="col-lg-8 col-md-8 col-sm-12 col-xs-12 player-holder">
|
||||
<div id="main" class="clearfix container">
|
||||
<div class="clearfix">
|
||||
<section id="content" class="clearfix videos">
|
||||
<div class="clearfix player-holder">
|
||||
<div id="cb_player" class="cb_player">
|
||||
{FlashPlayer vdetails=$video width='100%' height='100%'}
|
||||
</div><!-- cb_player end -->
|
||||
</div>
|
||||
<!-- end of player-holder -->
|
||||
|
||||
<div class="col-lg-4 col-md-4 col-sm-12 col-xs-12 pull-right popular-vids watch_vids clearfix">
|
||||
<div class="adbox-holder clearfix hidden-xs">
|
||||
<p>Advertisement <span class="caret"></span></p>
|
||||
{AD place='ad_300x250'}
|
||||
<div class="clearfix leaderboard-ad ad">
|
||||
{AD place='ad_728x90'}
|
||||
</div>
|
||||
|
||||
{if $smarty.get.play_list}
|
||||
{section name=plist loop=$items}
|
||||
{include file="$style_dir/blocks/manage/account_video.html" video=$items[plist] control="onWatch" pid=$playlist.playlist_id}
|
||||
{/section}
|
||||
{else}
|
||||
|
||||
{$most_viewed=$cbvid->get_videos(["order"=>"views DESC","limit"=>$limit])}
|
||||
{if $most_viewed}
|
||||
{foreach from=$most_viewed item=pop_video}
|
||||
|
||||
{if $pop_video@iteration == 9}
|
||||
{break}
|
||||
{/if}
|
||||
<div class="clearfix popular-video">
|
||||
{include file="$style_dir/blocks/videos/video.html" display_type='popVideos'}
|
||||
</div>
|
||||
{/foreach}
|
||||
|
||||
{else}
|
||||
<div class="well well-info">No Videos Found !</div>
|
||||
{/if}
|
||||
{/if}
|
||||
</div>
|
||||
<!-- end of related videos and ad box -->
|
||||
|
||||
<div class="col-lg-8 col-md-8 col-sm-12 col-xs-12 video_info_actions clearfix">
|
||||
|
||||
<div class="clearfix title-area">
|
||||
<div class="video-details clearfix">
|
||||
<header class="clearfix details">
|
||||
<h1>{$video.title|truncate:55}</h1>
|
||||
<span class="views-count clearfix">
|
||||
<i class="fa fa-eye"></i> {$vdo.views|number_format}
|
||||
</span>
|
||||
</div>
|
||||
<div class="user-likes-count clearfix">
|
||||
<div class="user-info col-lg-6 col-md-6 col-sm-6 col-xs-12">
|
||||
<a href="{$userquery->profile_link($channel)}" class="avatar">
|
||||
<img src="{$userquery->avatar($video,'small',userid())}" width="55" height="55">
|
||||
<div class="user-video-info clearfix">
|
||||
<a href="{$userquery->profile_link($video)}" class="avatar">
|
||||
<img src="{$userquery->avatar($video,'small',userid())}" class="img-responsive">
|
||||
</a>
|
||||
<div class="sub-title">
|
||||
<strong class="user_title">
|
||||
<h2 class="user-title">
|
||||
<a href="{$userquery->profile_link($video)}"> {$video.username}</a>
|
||||
</strong>
|
||||
|
||||
{if $video.userid != userid()}
|
||||
<a id="subscribeUser" class="btn btn-subscribe btn-primary" href="javascript:void(0)">
|
||||
<span>{lang('Subscribe')}</span>
|
||||
<i>{$video.subscribers}</i>
|
||||
</a>
|
||||
{/if}
|
||||
</h2>
|
||||
<div class="views-counter">
|
||||
<span>{prettyNum($vdo.views)}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="user-likes-sub clearfix">
|
||||
<div class="clearfix like-rating col-lg-6 col-md-6 col-sm-6 col-xs-12" id="rating_container">
|
||||
{if $vdo.allow_rating != 'no'}
|
||||
{show_video_rating rating=$vdo.rating ratings=$vdo.rated_by total='10' id=$vdo.videoid type=video}
|
||||
{/if}
|
||||
</div>
|
||||
<div class="clearfix subscribe-col col-lg-6 col-md-6 col-sm-6 col-xs-12">
|
||||
{if $video.userid != userid()}
|
||||
<a id="subscribeUser" class="btn btn-subscribe btn-primary" href="javascript:void(0)">
|
||||
<span>{lang('Subscribe')}</span>
|
||||
</a>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<div class="tune-tabs clearfix">
|
||||
</div>
|
||||
</header>
|
||||
<div id="messageFav" class="alert alert-info marginTop" style="display:none"></div>
|
||||
<div class="view-tabs clearfix">
|
||||
<ul class="clearfix nav nav-tabs">
|
||||
<li class="active">
|
||||
<a href="#cb-item-info" data-toggle="tab"><span class="icon-info"></span>{lang('Info')}</a>
|
||||
|
|
@ -84,7 +52,7 @@
|
|||
<a href="#cb-item-share" data-toggle="tab"><span class="icon-share"></span>Share/Embed</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#cb-item-addto" data-toggle="tab"><span class="icon-add"></span>{lang('Add to')}</a>
|
||||
<a href="#cb-item-addto" data-toggle="tab"><span class="icon-plusrounded"></span>{lang('Add to')}</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#cb-item-report" data-toggle="tab"><span class="icon-flag"></span>{lang('Report')}
|
||||
|
|
@ -174,6 +142,35 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<aside id="sidebar">
|
||||
<div class="box-ad ad">{AD place='ad_300x250'}</div>
|
||||
<h2>Popular Videos</h2>
|
||||
<div class="clearfix sidebar-videos">
|
||||
{if $smarty.get.play_list}
|
||||
{section name=plist loop=$items}
|
||||
{include file="$style_dir/blocks/manage/account_video.html" video=$items[plist] control="onWatch" pid=$playlist.playlist_id}
|
||||
{/section}
|
||||
{else}
|
||||
|
||||
{$most_viewed=$cbvid->get_videos(["order"=>"views DESC","limit"=>$limit])}
|
||||
{if $most_viewed}
|
||||
{foreach from=$most_viewed item=pop_video}
|
||||
|
||||
{if $pop_video@iteration == 9}
|
||||
{break}
|
||||
{/if}
|
||||
<div class="clearfix popular-video">
|
||||
{include file="$style_dir/blocks/videos/video.html" display_type='popVideos_sidebar'}
|
||||
</div>
|
||||
{/foreach}
|
||||
|
||||
{else}
|
||||
<div class="well well-info">No Videos Found !</div>
|
||||
{/if}
|
||||
{/if}
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -12,13 +12,13 @@
|
|||
border-color: #e0e0e0; }
|
||||
|
||||
.btn-primary {
|
||||
background: #1976d2;
|
||||
border-color: #1976d2;
|
||||
font-weight: 700;
|
||||
background: #0080b4;
|
||||
border-color: #0080b4;
|
||||
font-weight: 400;
|
||||
color: #fff; }
|
||||
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary:hover {
|
||||
background: #1976d2;
|
||||
border-color: #1976d2;
|
||||
background: #0080b4;
|
||||
border-color: #0080b4;
|
||||
color: #fff; }
|
||||
|
||||
.btn-success {
|
||||
|
|
@ -63,13 +63,13 @@
|
|||
border-color: #e0e0e0; }
|
||||
|
||||
.btn-primary {
|
||||
background: #1976d2;
|
||||
border-color: #1976d2;
|
||||
font-weight: 700;
|
||||
background: #0080b4;
|
||||
border-color: #0080b4;
|
||||
font-weight: 400;
|
||||
color: #fff; }
|
||||
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary:hover {
|
||||
background: #1976d2;
|
||||
border-color: #1976d2;
|
||||
background: #0080b4;
|
||||
border-color: #0080b4;
|
||||
color: #fff; }
|
||||
|
||||
.btn-success {
|
||||
|
|
@ -528,13 +528,13 @@
|
|||
border-color: #e0e0e0; }
|
||||
|
||||
.btn-primary {
|
||||
background: #1976d2;
|
||||
border-color: #1976d2;
|
||||
font-weight: 700;
|
||||
background: #0080b4;
|
||||
border-color: #0080b4;
|
||||
font-weight: 400;
|
||||
color: #fff; }
|
||||
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary:hover {
|
||||
background: #1976d2;
|
||||
border-color: #1976d2;
|
||||
background: #0080b4;
|
||||
border-color: #0080b4;
|
||||
color: #fff; }
|
||||
|
||||
.btn-success {
|
||||
|
|
@ -654,13 +654,13 @@
|
|||
border-color: #e0e0e0; }
|
||||
|
||||
.btn-primary {
|
||||
background: #1976d2;
|
||||
border-color: #1976d2;
|
||||
font-weight: 700;
|
||||
background: #0080b4;
|
||||
border-color: #0080b4;
|
||||
font-weight: 400;
|
||||
color: #fff; }
|
||||
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary:hover {
|
||||
background: #1976d2;
|
||||
border-color: #1976d2;
|
||||
background: #0080b4;
|
||||
border-color: #0080b4;
|
||||
color: #fff; }
|
||||
|
||||
.btn-success {
|
||||
|
|
@ -1628,140 +1628,95 @@ h1 {
|
|||
.video_player {
|
||||
height: inherit; }
|
||||
|
||||
.watch_vids .popular-video .cb_quickie {
|
||||
padding: 3px 0; }
|
||||
|
||||
.video-details {
|
||||
background: #fff;
|
||||
padding: 0; }
|
||||
.video-details .title-area {
|
||||
margin: 0 0 13px; }
|
||||
.video-details .title-area h1 {
|
||||
float: left;
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
margin: 0 5px 0 0;
|
||||
font-weight: 400;
|
||||
color: #333; }
|
||||
.video-details .title-area .views-count {
|
||||
float: right;
|
||||
font-size: 14px;
|
||||
line-height: 28px; }
|
||||
.video-details .user-likes-count {
|
||||
margin: 0 -15px; }
|
||||
.video-details .user-likes-count .user-info .avatar {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
margin: 0 5px 0 0;
|
||||
border-radius: 50%; }
|
||||
.video-details .user-likes-count .user-info .avatar img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 50%; }
|
||||
.video-details .user-likes-count .user-info .sub-title {
|
||||
display: inline-block;
|
||||
vertical-align: middle; }
|
||||
.video-details .user-likes-count .user-info .sub-title .user_title {
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
padding: 16px; }
|
||||
.video-details header.details {
|
||||
margin: 0 0 20px; }
|
||||
.video-details header.details h1 {
|
||||
font-size: 25px;
|
||||
line-height: 25 px;
|
||||
margin: 0 0 16px;
|
||||
font-weight: 600;
|
||||
margin: 0 0 3px; }
|
||||
.video-details .user-likes-count .user-info .sub-title .user_title a {
|
||||
color: #333; }
|
||||
.video-details .user-likes-count .user-info .sub-title .user_title a:hover {
|
||||
text-decoration: none; }
|
||||
.video-details .user-likes-count .user-info .sub-title .btn-subscribe {
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
.video-details header.details .user-video-info {
|
||||
margin: 0 0 12px;
|
||||
display: table;
|
||||
width: 100%; }
|
||||
.video-details header.details .user-video-info .views-counter,
|
||||
.video-details header.details .user-video-info .avatar,
|
||||
.video-details header.details .user-video-info .user-title {
|
||||
display: table-cell;
|
||||
vertical-align: middle; }
|
||||
.video-details header.details .user-video-info .avatar {
|
||||
width: 58px; }
|
||||
.video-details header.details .user-video-info .avatar img {
|
||||
width: 58px;
|
||||
height: 58px;
|
||||
border-radius: 29px; }
|
||||
.video-details header.details .user-video-info .user-title {
|
||||
font-size: 18px;
|
||||
line-height: 20px;
|
||||
font-weight: 400;
|
||||
padding: 0;
|
||||
border: none; }
|
||||
.video-details .user-likes-count .user-info .sub-title .btn-subscribe span {
|
||||
float: left;
|
||||
padding: 0 6px;
|
||||
border: solid #0059b3;
|
||||
border-width: 1px 0 1px 1px;
|
||||
border-radius: 2px 0 0 2px; }
|
||||
.video-details .user-likes-count .user-info .sub-title .btn-subscribe i {
|
||||
float: right;
|
||||
background: #f0f0f0;
|
||||
color: #333;
|
||||
padding: 0 6px;
|
||||
width: 25px;
|
||||
border: solid #adadad;
|
||||
border-width: 1px 1px 1px 0;
|
||||
border-radius: 0 2px 2px 0;
|
||||
font-style: normal; }
|
||||
margin: 0;
|
||||
padding: 0 0 0 16px; }
|
||||
.video-details header.details .user-video-info .user-title a {
|
||||
color: #000; }
|
||||
.video-details header.details .user-video-info .views-counter {
|
||||
text-align: right;
|
||||
width: 166px;
|
||||
font-size: 25px;
|
||||
line-height: 25px;
|
||||
padding: 12px 0 11px 16px; }
|
||||
.video-details header.details .user-video-info .views-counter span {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
border-bottom: 3px solid #e7e7e7;
|
||||
width: 100%;
|
||||
height: 34px; }
|
||||
.video-details .user-likes-sub {
|
||||
margin: 0 -15px; }
|
||||
.video-details .user-likes-sub .like-rating .rating {
|
||||
padding: 3px 0 2px; }
|
||||
.video-details .user-likes-sub .subscribe-col {
|
||||
text-align: right; }
|
||||
.video-details .user-likes-sub .btn-subscribe {
|
||||
font-size: 14px;
|
||||
line-height: 14px; }
|
||||
|
||||
/* rating */
|
||||
.rating {
|
||||
text-align: right;
|
||||
color: #7e7e7e;
|
||||
font-size: 12px;
|
||||
line-height: 17px;
|
||||
padding: 0 0 40px;
|
||||
margin: 0 0 -40px;
|
||||
position: relative; }
|
||||
.rating .rating-holder {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: top; }
|
||||
.rating .rating-holder:before, .rating .rating-holder:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 85px;
|
||||
height: 1px;
|
||||
background: #e1e1e1;
|
||||
top: 50%;
|
||||
left: 0; }
|
||||
.rating .rating-holder:after {
|
||||
left: auto;
|
||||
right: 0; }
|
||||
.rating #circle,
|
||||
color: silver;
|
||||
font-size: 16px;
|
||||
line-height: 20px; }
|
||||
.rating .like-dislike {
|
||||
display: inline-block;
|
||||
vertical-align: middle; }
|
||||
.rating .like-dislike {
|
||||
width: 80px;
|
||||
margin: 0 0 0 5px;
|
||||
text-align: right; }
|
||||
.rating .like-dislike:first-child {
|
||||
margin: 0 5px 0 0;
|
||||
text-align: left; }
|
||||
.rating .like-dislike a {
|
||||
display: block; }
|
||||
.rating .like-dislike a:hover {
|
||||
text-decoration: none; }
|
||||
.rating .like-dislike a i {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
height: 14px;
|
||||
width: 24px; }
|
||||
.rating .like-dislike a.btn-like i {
|
||||
margin: 0 5px 0 0;
|
||||
background: url(../images/sprite.png) no-repeat -15px -1361px; }
|
||||
.rating .like-dislike a.btn-like:hover i {
|
||||
background-position: -15px -1380px; }
|
||||
.rating .like-dislike a.btn-dislike i {
|
||||
margin: 0 5px 0 0;
|
||||
background: url(../images/sprite.png) no-repeat -12px -1411px; }
|
||||
.rating .like-dislike a.btn-dislike:hover i {
|
||||
background-position: -12px -1428px; }
|
||||
margin: 0 16px 0 0; }
|
||||
.rating .like-dislike a {
|
||||
color: silver; }
|
||||
.rating .like-dislike a span {
|
||||
font-size: 18px;
|
||||
line-height: 20px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin: 0 10px 0 0; }
|
||||
.rating .like-dislike.likes {
|
||||
color: #0080b4; }
|
||||
.rating .like-dislike.likes a {
|
||||
color: #0080b4; }
|
||||
.rating .like-error {
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 40px; }
|
||||
display: block; }
|
||||
.rating .like-error span {
|
||||
display: block; }
|
||||
|
||||
/* tune-tabs */
|
||||
.error {
|
||||
display: block;
|
||||
padding: 10px;
|
||||
background: #f97373;
|
||||
color: #fff; }
|
||||
|
||||
/* view-tabs */
|
||||
.cat-tabs {
|
||||
margin: 0 0 20px;
|
||||
border: 1px solid #d9d9d9;
|
||||
|
|
@ -1787,44 +1742,49 @@ h1 {
|
|||
border-color: #0080b4;
|
||||
font-weight: 700; }
|
||||
|
||||
.tune-tabs {
|
||||
.view-tabs {
|
||||
color: #333;
|
||||
margin: 0 0 20px; }
|
||||
.tune-tabs h2 {
|
||||
.view-tabs h2 {
|
||||
font-size: 16px;
|
||||
line-height: 18px;
|
||||
margin: 0 0 10px; }
|
||||
.tune-tabs .alert-info {
|
||||
.view-tabs .alert-info {
|
||||
background: none;
|
||||
color: #333;
|
||||
font-size: 13px;
|
||||
line-height: 18px;
|
||||
border: none;
|
||||
padding: 0; }
|
||||
.tune-tabs .nav-tabs.nav {
|
||||
font-size: 13px;
|
||||
border-bottom: 1px solid #d9d9d9;
|
||||
border-bottom-width: 1px; }
|
||||
.tune-tabs .nav-tabs.nav > li {
|
||||
margin: 0 0 -1px; }
|
||||
.tune-tabs .nav-tabs.nav > li > a {
|
||||
border-bottom: 1px solid #d9d9d9;
|
||||
border-width: 0 0 2px;
|
||||
border-color: transparent;
|
||||
.view-tabs .nav-tabs.nav {
|
||||
font-size: 16px;
|
||||
border: 1px solid #d9d9d9;
|
||||
border-width: 1px 0; }
|
||||
.view-tabs .nav-tabs.nav > li {
|
||||
margin: 0; }
|
||||
.tune-tabs .nav-tabs.nav > li > a:hover {
|
||||
.view-tabs .nav-tabs.nav > li > a {
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 10px 16px 10px 0;
|
||||
color: #7c7c7c; }
|
||||
.view-tabs .nav-tabs.nav > li > a:hover {
|
||||
border-color: #0080b4;
|
||||
background: none;
|
||||
color: #333; }
|
||||
.tune-tabs .nav-tabs.nav > li.active > a, .tune-tabs .nav-tabs.nav > li.active > a:hover, .tune-tabs .nav-tabs.nav > li.active > a:focus {
|
||||
border-color: #0080b4;
|
||||
color: #333;
|
||||
.view-tabs .nav-tabs.nav > li > a span {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin: 0 10px 0 0;
|
||||
font-size: 18px;
|
||||
line-height: 22px; }
|
||||
.view-tabs .nav-tabs.nav > li.active > a, .view-tabs .nav-tabs.nav > li.active > a:hover, .view-tabs .nav-tabs.nav > li.active > a:focus {
|
||||
color: #0080b4;
|
||||
background: none; }
|
||||
.tune-tabs .tab-content > .tab-pane {
|
||||
.view-tabs .tab-content > .tab-pane {
|
||||
padding: 10px 0 0; }
|
||||
.tune-tabs .tab-content .infotable table td {
|
||||
.view-tabs .tab-content .infotable table td {
|
||||
width: 50%; }
|
||||
.tune-tabs .tab-content .infotable table td img {
|
||||
.view-tabs .tab-content .infotable table td img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin: 0 5px 0 0; }
|
||||
|
|
@ -2672,11 +2632,6 @@ textarea#comment_box {
|
|||
margin: 0;
|
||||
padding: 10px; }
|
||||
|
||||
.error {
|
||||
padding: 10px;
|
||||
background: #f97373;
|
||||
color: #fff; }
|
||||
|
||||
.form_result,
|
||||
#flag_form_result {
|
||||
margin: 0 0 10px; }
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -3,7 +3,7 @@
|
|||
position:absolute;
|
||||
width:100%;
|
||||
bottom:0;
|
||||
background:$blue-color;
|
||||
background:$blue;
|
||||
padding:18px 0;
|
||||
font-size: 16px;
|
||||
line-height:20px;
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
color: #fff;
|
||||
&:hover{
|
||||
text-decoration: none;
|
||||
//color: $blue-color;
|
||||
//color: $blue;
|
||||
}
|
||||
}
|
||||
.icon-holder{
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@
|
|||
left: 0;
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
background: $blue-color;
|
||||
background: $blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -95,7 +95,7 @@
|
|||
left: 0;
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
background: $blue-color;
|
||||
background: $blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -144,7 +144,7 @@
|
|||
box-shadow: none;
|
||||
color: $black;
|
||||
&.btn-search{
|
||||
background: $blue-color;
|
||||
background: $blue;
|
||||
color: $white;
|
||||
font-size: 20px;
|
||||
width: 40px;
|
||||
|
|
@ -200,7 +200,7 @@
|
|||
}
|
||||
&:hover{
|
||||
color: $white;
|
||||
background:$blue-color;
|
||||
background:$blue;
|
||||
}
|
||||
}
|
||||
&:first-child >a{
|
||||
|
|
@ -213,7 +213,7 @@
|
|||
> .active > a,
|
||||
> .active > a:hover,
|
||||
> .active > a:focus{
|
||||
background:$blue-color;
|
||||
background:$blue;
|
||||
color:$white;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,15 +13,13 @@ $dark-btn:#17181a;
|
|||
$header-btn:#262727;
|
||||
$dropdown-bg:#424242;
|
||||
// $duration-bg:rgba(0,0,0,0.8);
|
||||
|
||||
$blue-color:#0080b4;
|
||||
$blue:#0080b4;
|
||||
$body-bg:#eee;
|
||||
$block-bg:#eee;
|
||||
$block-color:#333;
|
||||
$heading-color:#666;
|
||||
$search-toggle:#999;
|
||||
$base-font:'Source Sans Pro', sans-serif;
|
||||
$base-color:#000;
|
||||
$base-color:$black;
|
||||
$iconfont: 'icomoon';
|
||||
$default-border:1px solid #d9d9d9;
|
||||
$fb-color:#2b4b90;
|
||||
|
|
@ -215,17 +213,17 @@ $probox-bg: #f8f8f8;
|
|||
}
|
||||
}
|
||||
.btn-primary{
|
||||
background:#1976d2;
|
||||
border-color:#1976d2;
|
||||
font-weight: 700;
|
||||
background:$blue;
|
||||
border-color:$blue;
|
||||
font-weight: 400;
|
||||
color:#fff;
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
&:hover{
|
||||
background:#1976d2;
|
||||
border-color:#1976d2;
|
||||
background:$blue;
|
||||
border-color:$blue;
|
||||
color:#fff;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -209,15 +209,15 @@ h1{
|
|||
color: $black;
|
||||
text-decoration: none;
|
||||
&:hover{
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
.author{
|
||||
margin: 0 0 2px;
|
||||
color:$blue-color;
|
||||
color:$blue;
|
||||
a{
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -308,8 +308,8 @@ h1{
|
|||
background: none;
|
||||
cursor: pointer;
|
||||
&.icon-tick{
|
||||
background:$blue-color;
|
||||
border-color:$blue-color;
|
||||
background:$blue;
|
||||
border-color:$blue;
|
||||
}
|
||||
}
|
||||
.vid-type{
|
||||
|
|
@ -436,16 +436,16 @@ h1{
|
|||
color: $black;
|
||||
text-decoration: none;
|
||||
&:hover{
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
.author{
|
||||
display: block;
|
||||
margin: 0 0 5px;
|
||||
color:$blue-color;
|
||||
color:$blue;
|
||||
a{
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -724,11 +724,11 @@ h1{
|
|||
font-size: 15px;
|
||||
@include vertical-top();
|
||||
i{
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
@include transition($transition:all 0.1s ease-in-out);
|
||||
}
|
||||
&:hover{
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
text-decoration: none;
|
||||
i{
|
||||
margin: 0 0 0 5px;
|
||||
|
|
@ -916,174 +916,116 @@ h1{
|
|||
.video_player{
|
||||
height: inherit;
|
||||
}
|
||||
|
||||
.watch_vids{
|
||||
.popular-video .cb_quickie{
|
||||
padding: 3px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.video-details{
|
||||
background: $white;
|
||||
padding: 0;
|
||||
.title-area{
|
||||
margin: 0 0 13px;
|
||||
padding: 16px;
|
||||
header.details{
|
||||
margin: 0 0 20px;
|
||||
h1{
|
||||
float: left;
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
margin: 0 5px 0 0;
|
||||
font-weight: 400;
|
||||
color:$block-color;
|
||||
}
|
||||
.views-count{
|
||||
float: right;
|
||||
font-size: 14px;
|
||||
line-height: 28px;
|
||||
}
|
||||
}
|
||||
.user-likes-count{
|
||||
margin: 0 -15px;
|
||||
.user-info{
|
||||
.avatar{
|
||||
@include vertical-middle();
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
margin: 0 5px 0 0;
|
||||
border-radius: 50%;
|
||||
img{
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.sub-title{
|
||||
@include vertical-middle();
|
||||
.user_title{
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
font-size: 25px;
|
||||
line-height: 25 px;
|
||||
margin: 0 0 16px;
|
||||
font-weight: 600;
|
||||
margin: 0 0 3px;
|
||||
a{
|
||||
color:$block-color;
|
||||
&:hover{
|
||||
text-decoration: none;
|
||||
}
|
||||
.user-video-info{
|
||||
margin: 0 0 12px;
|
||||
display: table;
|
||||
width: 100%;
|
||||
.views-counter,
|
||||
.avatar,
|
||||
.user-title{
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.avatar{
|
||||
width: 58px;
|
||||
img{
|
||||
width:58px;
|
||||
height:58px;
|
||||
border-radius: 29px;
|
||||
}
|
||||
}
|
||||
.user-title{
|
||||
font-size: 18px;
|
||||
line-height: 20px;
|
||||
font-weight: 400;
|
||||
margin: 0;
|
||||
padding: 0 0 0 16px;
|
||||
a{
|
||||
color: $black;
|
||||
}
|
||||
}
|
||||
.views-counter{
|
||||
text-align: right;
|
||||
width: 166px;
|
||||
font-size: 25px;
|
||||
line-height: 25px;
|
||||
padding: 12px 0 11px 16px;
|
||||
span{
|
||||
@include vertical-top();
|
||||
border-bottom: 3px solid darken($body-bg,2.6%);
|
||||
width: 100%;
|
||||
height: 34px;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.user-likes-sub{
|
||||
margin: 0 -15px;
|
||||
.like-rating{
|
||||
.rating{
|
||||
padding: 3px 0 2px;
|
||||
}
|
||||
}
|
||||
.subscribe-col{
|
||||
text-align: right;
|
||||
}
|
||||
.btn-subscribe{
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
font-weight: 400;
|
||||
padding: 0;
|
||||
border:none;
|
||||
span{
|
||||
float: left;
|
||||
padding: 0 6px;
|
||||
border:solid #0059b3;
|
||||
border-width: 1px 0 1px 1px;
|
||||
border-radius:2px 0 0 2px;
|
||||
}
|
||||
i{
|
||||
float: right;
|
||||
background:#f0f0f0;
|
||||
color:$block-color;
|
||||
padding: 0 6px;
|
||||
width: 25px;
|
||||
border:solid #adadad;
|
||||
border-width: 1px 1px 1px 0;
|
||||
border-radius: 0 2px 2px 0;
|
||||
font-style: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
font-size: 14px;
|
||||
line-height: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
/* rating */
|
||||
.rating{
|
||||
text-align: right;
|
||||
color: #7e7e7e;
|
||||
font-size: 12px;
|
||||
line-height: 17px;
|
||||
padding: 0 0 40px;
|
||||
margin: 0 0 -40px;
|
||||
position: relative;
|
||||
.rating-holder{
|
||||
position: relative;
|
||||
@include vertical-top();
|
||||
&:before,
|
||||
&:after{
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 85px;
|
||||
height: 1px;
|
||||
background:#e1e1e1;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
}
|
||||
&:after{
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
#circle,
|
||||
color: darken($body-bg,18%);
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
.like-dislike{
|
||||
@include vertical-middle();
|
||||
}
|
||||
.like-dislike{
|
||||
width: 80px;
|
||||
margin: 0 0 0 5px;
|
||||
text-align:right;
|
||||
&:first-child{
|
||||
margin: 0 5px 0 0;
|
||||
text-align:left;
|
||||
}
|
||||
margin: 0 16px 0 0;
|
||||
a{
|
||||
display: block;
|
||||
&:hover{
|
||||
text-decoration: none;
|
||||
}
|
||||
i{
|
||||
color: darken($body-bg,18%);
|
||||
span{
|
||||
font-size: 18px;
|
||||
line-height: 20px;
|
||||
@include vertical-middle();
|
||||
height: 14px;
|
||||
width: 24px;
|
||||
}
|
||||
&.btn-like{
|
||||
i{
|
||||
margin: 0 5px 0 0;
|
||||
background: $sprite -15px -1361px;
|
||||
}
|
||||
&:hover i{
|
||||
background-position: -15px -1380px;
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
}
|
||||
&.btn-dislike{
|
||||
i{
|
||||
margin: 0 5px 0 0;
|
||||
background: $sprite -12px -1411px;
|
||||
}
|
||||
&:hover i{
|
||||
background-position: -12px -1428px;
|
||||
}
|
||||
&.likes{
|
||||
color: $blue;
|
||||
a{
|
||||
color: $blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
.like-error{
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
display: block;
|
||||
span{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
/* tune-tabs */
|
||||
.error{
|
||||
display: block;
|
||||
padding: 10px;
|
||||
background: #f97373;
|
||||
color: #fff;
|
||||
}
|
||||
/* view-tabs */
|
||||
.cat-tabs{
|
||||
margin: 0 0 20px;
|
||||
border:$default-border;
|
||||
|
|
@ -1101,19 +1043,19 @@ h1{
|
|||
border-bottom: 3px solid transparent;
|
||||
&:hover{
|
||||
text-decoration: none;
|
||||
border-color: $blue-color;
|
||||
border-color: $blue;
|
||||
}
|
||||
}
|
||||
&.selected{
|
||||
a{
|
||||
border-color: $blue-color;
|
||||
border-color: $blue;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.tune-tabs{
|
||||
.view-tabs{
|
||||
color: $block-color;
|
||||
margin: 0 0 20px;
|
||||
h2{
|
||||
|
|
@ -1130,27 +1072,32 @@ h1{
|
|||
padding: 0;
|
||||
}
|
||||
.nav-tabs.nav{
|
||||
font-size: 13px;
|
||||
border-bottom:$default-border;
|
||||
border-bottom-width: 1px;
|
||||
font-size: 16px;
|
||||
border:$default-border;
|
||||
border-width: 1px 0;
|
||||
>li{
|
||||
margin: 0 0 -1px;
|
||||
>a{
|
||||
border-bottom:$default-border;
|
||||
border-width: 0 0 2px;
|
||||
border-color:transparent;
|
||||
margin: 0;
|
||||
>a{
|
||||
border:none;
|
||||
margin: 0;
|
||||
padding: 10px 16px 10px 0;
|
||||
color: lighten($grey-txt,2.7%);
|
||||
&:hover{
|
||||
border-color:$blue-color;
|
||||
border-color:$blue;
|
||||
background: none;
|
||||
color: $block-color;
|
||||
}
|
||||
span{
|
||||
@include vertical-top();
|
||||
margin: 0 10px 0 0;
|
||||
font-size: 18px;
|
||||
line-height: 22px;
|
||||
}
|
||||
}
|
||||
&.active > a,
|
||||
&.active > a:hover,
|
||||
&.active > a:focus{
|
||||
border-color:$blue-color;
|
||||
color: $block-color;
|
||||
color: $blue;
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -1182,10 +1129,10 @@ h1{
|
|||
li{
|
||||
margin: 0 0 10px;
|
||||
a{
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
&:hover{
|
||||
text-decoration: none;
|
||||
color: darken($blue-color,10%);
|
||||
color: darken($blue,10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1302,7 +1249,7 @@ h1{
|
|||
&:hover{
|
||||
background:$white;
|
||||
border-color:$white;
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
}
|
||||
i{
|
||||
@include vertical-top();
|
||||
|
|
@ -1319,7 +1266,7 @@ h1{
|
|||
> span:hover{
|
||||
background:$white;
|
||||
border-color:$white;
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1607,7 +1554,7 @@ textarea#comment_box{
|
|||
&:hover{
|
||||
text-decoration: none;
|
||||
.avatar{
|
||||
background:$blue-color;
|
||||
background:$blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1618,7 +1565,7 @@ textarea#comment_box{
|
|||
border-radius:50%;
|
||||
padding: 3px;
|
||||
background: #fff;
|
||||
border:1px solid $blue-color;
|
||||
border:1px solid $blue;
|
||||
margin: 0 auto 10px;
|
||||
}
|
||||
h2{
|
||||
|
|
@ -1857,7 +1804,7 @@ textarea#comment_box{
|
|||
}
|
||||
.changeCover{
|
||||
display: none;
|
||||
background: $blue-color;
|
||||
background: $blue;
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
|
|
@ -2032,7 +1979,7 @@ textarea#comment_box{
|
|||
font-size: 20px;
|
||||
line-height: 20px;
|
||||
&:hover{
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -2222,11 +2169,7 @@ textarea#comment_box{
|
|||
}
|
||||
|
||||
|
||||
.error{
|
||||
padding: 10px;
|
||||
background: #f97373;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.form_result,
|
||||
#flag_form_result{
|
||||
margin: 0 0 10px;
|
||||
|
|
@ -2703,7 +2646,7 @@ textarea#comment_box{
|
|||
padding: 5px 10px;
|
||||
min-width: 50px;
|
||||
border-radius:12px;
|
||||
background:$blue-color;
|
||||
background:$blue;
|
||||
color: #fff;
|
||||
i{
|
||||
vertical-align: middle;
|
||||
|
|
@ -2711,7 +2654,7 @@ textarea#comment_box{
|
|||
line-height: 8px;
|
||||
background: #fff;
|
||||
padding: 2px 5px 1px;
|
||||
color: $blue-color;
|
||||
color: $blue;
|
||||
margin: 0 5px 0 0;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue