mirror of
https://github.com/iv-org/invidious.git
synced 2025-08-28 07:28:31 +00:00
Merge pull request #4 from rocket2021/rocket2021-watch
Rocket2021 watch
This commit is contained in:
commit
d3b8279c70
389
assets/css/index1.css
Normal file
389
assets/css/index1.css
Normal file
@ -0,0 +1,389 @@
|
|||||||
|
.login-buttom {
|
||||||
|
margin-right: 15px;
|
||||||
|
border: 1px solid;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
/*/Modul/*/
|
||||||
|
.d-modal {
|
||||||
|
z-index: 3;
|
||||||
|
display: none;
|
||||||
|
padding-top: 100px;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
background-color: rgb(0, 0, 0);
|
||||||
|
background-color: rgba(0, 0, 0, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.d-modal-content {
|
||||||
|
margin: auto;
|
||||||
|
background-color: #fff;
|
||||||
|
position: relative;
|
||||||
|
padding: 0;
|
||||||
|
outline: 0;
|
||||||
|
width: 600px;
|
||||||
|
}
|
||||||
|
.d-container {
|
||||||
|
padding: 0.01em 16px;
|
||||||
|
}
|
||||||
|
.d-panel {
|
||||||
|
margin-top: 16px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
.d-modal-content {
|
||||||
|
margin: 0 10px;
|
||||||
|
width: auto !important;
|
||||||
|
}
|
||||||
|
.d-modal {
|
||||||
|
padding-top: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.d-modal-content {
|
||||||
|
width: 500px;
|
||||||
|
}
|
||||||
|
.d-modal {
|
||||||
|
padding-top: 50px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 993px) {
|
||||||
|
.d-modal-content {
|
||||||
|
width: 900px;
|
||||||
|
}
|
||||||
|
.d-hide-large {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.d-teal,
|
||||||
|
.hover-teal:hover {
|
||||||
|
color: #fff !important;
|
||||||
|
background-color: #009688 !important;
|
||||||
|
}
|
||||||
|
.d-button1 {
|
||||||
|
background-color: #000;
|
||||||
|
padding: 12px 12px;
|
||||||
|
text-align: center;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 17px;
|
||||||
|
border: none;
|
||||||
|
color: #fff;
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
overflow: hidden;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
cursor: pointer;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
/*end*/
|
||||||
|
x1 {
|
||||||
|
font-size: 30px;
|
||||||
|
}
|
||||||
|
.datenschutz {
|
||||||
|
margin-left: 250px;
|
||||||
|
bottom: 0;
|
||||||
|
display: block;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 24px;
|
||||||
|
display: block;
|
||||||
|
background: #384859;
|
||||||
|
width: (100% - 250px);
|
||||||
|
}
|
||||||
|
.datenschutz a {
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 24px;
|
||||||
|
color: #ffffff;
|
||||||
|
background: #384859;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar .item .sub-menu {
|
||||||
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.rotate {
|
||||||
|
transform: rotate(90deg);
|
||||||
|
}
|
||||||
|
/**/
|
||||||
|
body {
|
||||||
|
padding: 0;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 780px) {
|
||||||
|
header {
|
||||||
|
z-index: 2000;
|
||||||
|
position: fixed;
|
||||||
|
padding: 20px;
|
||||||
|
width: calc(100% - 0%);
|
||||||
|
top: 0;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
header {
|
||||||
|
background: #22242a;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
.left_area h3 {
|
||||||
|
color: #fff;
|
||||||
|
margin: 0;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-size: 22px;
|
||||||
|
font-weight: 900;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left_area span {
|
||||||
|
color: #19b3d3;
|
||||||
|
}
|
||||||
|
.right_area {
|
||||||
|
float: right;
|
||||||
|
display: contents;
|
||||||
|
}
|
||||||
|
.logout_btn {
|
||||||
|
padding: 5px;
|
||||||
|
background: #19b3d3;
|
||||||
|
text-decoration: none;
|
||||||
|
float: right;
|
||||||
|
margin-top: -30px;
|
||||||
|
margin-right: 40px;
|
||||||
|
border-radius: 2px;
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #fff;
|
||||||
|
transition: 0.5s;
|
||||||
|
/*/transition-property: background;/*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.logout_btn:hover {
|
||||||
|
background: #0b87a6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar {
|
||||||
|
z-index: 2;
|
||||||
|
top: 0;
|
||||||
|
background: #333;
|
||||||
|
margin-top: 70px;
|
||||||
|
/*/padding-top: 30px;/*/
|
||||||
|
position: fixed;
|
||||||
|
left: -250px;
|
||||||
|
width: 250px;
|
||||||
|
height: calc(100% - 8%);
|
||||||
|
transition: 0.5s;
|
||||||
|
transition-property: left;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.profile_info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar .profile_info .profile_image {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
border-radius: 100px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar .profile_info h4 {
|
||||||
|
color: #ccc;
|
||||||
|
margin-top: 0;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar .profile_info a {
|
||||||
|
padding-left: 0px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar a {
|
||||||
|
color: #fff;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
line-height: 60px;
|
||||||
|
text-decoration: none;
|
||||||
|
padding-left: 40px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
transition: 0.5s;
|
||||||
|
transition-property: background;
|
||||||
|
margin-left: 165px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar a:hover {
|
||||||
|
background: #19b3d3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar i {
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
label #sidebar_btn {
|
||||||
|
z-index: 1;
|
||||||
|
color: #fff;
|
||||||
|
position: fixed;
|
||||||
|
cursor: pointer;
|
||||||
|
left: 300px;
|
||||||
|
font-size: 20px;
|
||||||
|
margin: 5px 0;
|
||||||
|
transition: 0.5s;
|
||||||
|
transition-property: color;
|
||||||
|
}
|
||||||
|
|
||||||
|
label #sidebar_btn:hover {
|
||||||
|
color: #19b3d3;
|
||||||
|
}
|
||||||
|
|
||||||
|
#check:checked ~ .sidebar {
|
||||||
|
left: 0;
|
||||||
|
background-color: #2f323a;
|
||||||
|
}
|
||||||
|
|
||||||
|
#check:checked ~ .topnav {
|
||||||
|
min-width: 85%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#check:checked ~ .sidebar a span {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar a span {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#check:checked ~ .sidebar a {
|
||||||
|
/*/font-size: 20px;/*/
|
||||||
|
margin-left: 0;
|
||||||
|
/*/width: 100%;/*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar a {
|
||||||
|
font-size: 20px;
|
||||||
|
margin-left: 165px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
width: (100% - 250px);
|
||||||
|
margin-top: 60px;
|
||||||
|
padding: 20px;
|
||||||
|
margin-left: 60px;
|
||||||
|
min-height: 100vh;
|
||||||
|
transition: 0.5s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#check:checked ~ .content {
|
||||||
|
/*margin-left: 60px;*/
|
||||||
|
}
|
||||||
|
|
||||||
|
#check:checked ~ .sidebar .profile_info {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar .profile_info {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#check {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile_nav {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content .card p {
|
||||||
|
background: #fff;
|
||||||
|
padding: 15px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive CSS */
|
||||||
|
|
||||||
|
@media screen and (max-width: 780px) {
|
||||||
|
.sidebar {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar_btn {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
margin-left: 0;
|
||||||
|
margin-top: 0;
|
||||||
|
padding: 10px 20px;
|
||||||
|
transition: 0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#check:checked ~ .content {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile_nav {
|
||||||
|
display: block;
|
||||||
|
width: calc(100% - 0%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_bar {
|
||||||
|
background: #222;
|
||||||
|
width: (100% - 0px);
|
||||||
|
margin-top: 70px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_bar .mobile_profile_image {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_bar .nav_btn {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 22px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: 0.5s;
|
||||||
|
transition-property: color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_bar .nav_btn:hover {
|
||||||
|
color: #19b3d3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile_nav_items {
|
||||||
|
background: #2f323a;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile_nav_items a {
|
||||||
|
color: #fff;
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
line-height: 60px;
|
||||||
|
text-decoration: none;
|
||||||
|
box-sizing: border-box;
|
||||||
|
transition: 0.5s;
|
||||||
|
transition-property: background;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile_nav_items a:hover {
|
||||||
|
background: #19b3d3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile_nav_items i {
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
37
assets/css/video-inv.css
Normal file
37
assets/css/video-inv.css
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
@media (min-width: 1200px) {
|
||||||
|
.video-title{
|
||||||
|
width: 78%
|
||||||
|
}
|
||||||
|
.video-infos{
|
||||||
|
width:60%;
|
||||||
|
}
|
||||||
|
.video-playlist{
|
||||||
|
right: 0;
|
||||||
|
position: absolute;
|
||||||
|
width: 20%;
|
||||||
|
top:9vh;
|
||||||
|
background-color: ;
|
||||||
|
}
|
||||||
|
#player-container{
|
||||||
|
width: 80%;
|
||||||
|
left: 0;
|
||||||
|
position: sticky;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
margin-top: 50px;
|
||||||
|
margin-left: 45px;
|
||||||
|
width: 95%;
|
||||||
|
}
|
||||||
|
#contents {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
footer{
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-theme .video-title{background-color: #444;}
|
||||||
|
.dark-theme .video-settings{background-color: #28323D;}
|
||||||
|
.dark-theme .video-infos{ background-color: #333;}
|
||||||
|
.dark-theme .video-playlist{background-color: #28323D;}
|
@ -18,6 +18,10 @@
|
|||||||
<link rel="stylesheet" href="/css/ionicons.min.css?v=<%= ASSET_COMMIT %>">
|
<link rel="stylesheet" href="/css/ionicons.min.css?v=<%= ASSET_COMMIT %>">
|
||||||
<link rel="stylesheet" href="/css/default.css?v=<%= ASSET_COMMIT %>">
|
<link rel="stylesheet" href="/css/default.css?v=<%= ASSET_COMMIT %>">
|
||||||
<script src="/js/_helpers.js?v=<%= ASSET_COMMIT %>"></script>
|
<script src="/js/_helpers.js?v=<%= ASSET_COMMIT %>"></script>
|
||||||
|
|
||||||
|
<link rel="stylesheet" type="text/css" href="/css/index1.css?v=<%= ASSET_COMMIT %>">
|
||||||
|
<link rel="stylesheet" type="text/css" href="/css/video-inv.css?v=<%= ASSET_COMMIT %>">
|
||||||
|
<script src="/js/jquery.js" charset="utf-8"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<%
|
<%
|
||||||
@ -27,19 +31,24 @@
|
|||||||
|
|
||||||
<body class="<%= dark_mode.blank? ? "no" : dark_mode %>-theme">
|
<body class="<%= dark_mode.blank? ? "no" : dark_mode %>-theme">
|
||||||
<span style="display:none" id="dark_mode_pref"><%= env.get("preferences").as(Preferences).dark_mode %></span>
|
<span style="display:none" id="dark_mode_pref"><%= env.get("preferences").as(Preferences).dark_mode %></span>
|
||||||
<div class="pure-g">
|
<input type="checkbox" id="check">
|
||||||
<div class="pure-u-1 pure-u-md-2-24"></div>
|
<!--header area start-->
|
||||||
<div class="pure-u-1 pure-u-md-20-24" id="contents">
|
<header>
|
||||||
|
<label for="check">
|
||||||
|
<i class="icon ion-ios-menu" id="sidebar_btn"></i>
|
||||||
|
</label>
|
||||||
<div class="pure-g navbar h-box">
|
<div class="pure-g navbar h-box">
|
||||||
<% if navbar_search %>
|
<% if navbar_search %>
|
||||||
|
<div class="left_area">
|
||||||
<div class="pure-u-1 pure-u-md-4-24">
|
<div class="pure-u-1 pure-u-md-4-24">
|
||||||
<a href="/" class="index-link pure-menu-heading">Invidious</a>
|
<a href="/" class="index-link pure-menu-heading"><h3><t1>Invidious</t1> | <span>UTNW</span></h3></a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="pure-u-1 pure-u-md-12-24 searchbar">
|
<div class="pure-u-1 pure-u-md-12-24 searchbar">
|
||||||
<% autofocus = false %><%= rendered "components/search_box" %>
|
<% autofocus = false %><%= rendered "components/search_box" %>
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
<div class="right_area">
|
||||||
<div class="pure-u-1 pure-u-md-8-24 user-field">
|
<div class="pure-u-1 pure-u-md-8-24 user-field">
|
||||||
<% if env.get? "user" %>
|
<% if env.get? "user" %>
|
||||||
<div class="pure-u-1-4">
|
<div class="pure-u-1-4">
|
||||||
@ -54,7 +63,7 @@
|
|||||||
<div class="pure-u-1-4">
|
<div class="pure-u-1-4">
|
||||||
<a id="notification_ticker" title="<%= translate(locale, "Subscriptions") %>" href="/feed/subscriptions" class="pure-menu-heading">
|
<a id="notification_ticker" title="<%= translate(locale, "Subscriptions") %>" href="/feed/subscriptions" class="pure-menu-heading">
|
||||||
<% notification_count = env.get("user").as(Invidious::User).notifications.size %>
|
<% notification_count = env.get("user").as(Invidious::User).notifications.size %>
|
||||||
<% if CONFIG.enable_user_notifications && notification_count > 0 %>
|
<% if notification_count > 0 %>
|
||||||
<span id="notification_count"><%= notification_count %></span> <i class="icon ion-ios-notifications"></i>
|
<span id="notification_count"><%= notification_count %></span> <i class="icon ion-ios-notifications"></i>
|
||||||
<% else %>
|
<% else %>
|
||||||
<i class="icon ion-ios-notifications-outline"></i>
|
<i class="icon ion-ios-notifications-outline"></i>
|
||||||
@ -67,14 +76,14 @@
|
|||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<% if env.get("preferences").as(Preferences).show_nick %>
|
<% if env.get("preferences").as(Preferences).show_nick %>
|
||||||
<div class="pure-u-1-4" style="overflow: hidden; white-space: nowrap;">
|
<div class="pure-u-1-4">
|
||||||
<span id="user_name"><%= HTML.escape(env.get("user").as(Invidious::User).email) %></span>
|
<span id="user_name"><%= env.get("user").as(Invidious::User).email %></span>
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
<div class="pure-u-1-4">
|
<div class="pure-u-1-4">
|
||||||
<form action="/signout?referer=<%= env.get?("current_page") %>" method="post">
|
<form action="/signout?referer=<%= env.get?("current_page") %>" method="post">
|
||||||
<input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
|
<input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
|
||||||
<a class="pure-menu-heading" href="#">
|
<a class="pure-menu-heading login-buttom" href="#">
|
||||||
<input style="all:unset" type="submit" value="<%= translate(locale, "Log out") %>">
|
<input style="all:unset" type="submit" value="<%= translate(locale, "Log out") %>">
|
||||||
</a>
|
</a>
|
||||||
</form>
|
</form>
|
||||||
@ -95,7 +104,7 @@
|
|||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<% if CONFIG.login_enabled %>
|
<% if CONFIG.login_enabled %>
|
||||||
<div class="pure-u-1-3">
|
<div class="pure-u-1-3 login-buttom">
|
||||||
<a href="/login?referer=<%= env.get?("current_page") %>" class="pure-menu-heading">
|
<a href="/login?referer=<%= env.get?("current_page") %>" class="pure-menu-heading">
|
||||||
<%= translate(locale, "Log in") %>
|
<%= translate(locale, "Log in") %>
|
||||||
</a>
|
</a>
|
||||||
@ -104,15 +113,23 @@
|
|||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</header>
|
||||||
|
<!--sidebar start-->
|
||||||
|
<div class="sidebar">
|
||||||
|
<%= rendered "components/feed_menu" %>
|
||||||
|
</div>
|
||||||
|
<!--sidebar end-->
|
||||||
|
<div class="content">
|
||||||
|
<div class="pure-g">
|
||||||
|
<div class="pure-u-1 pure-u-md-20-24" id="contents">
|
||||||
<% if CONFIG.banner %>
|
<% if CONFIG.banner %>
|
||||||
<div class="h-box">
|
<div class="h-box">
|
||||||
<h3><%= CONFIG.banner %></h3>
|
<h3><%= CONFIG.banner %></h3>
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|
||||||
<%= content %>
|
<%= content %>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<footer>
|
<footer>
|
||||||
<div class="pure-g">
|
<div class="pure-g">
|
||||||
<div class="pure-u-1 pure-u-md-1-3">
|
<div class="pure-u-1 pure-u-md-1-3">
|
||||||
@ -175,5 +192,29 @@
|
|||||||
<% end %>
|
<% end %>
|
||||||
<% end %>
|
<% end %>
|
||||||
</body>
|
</body>
|
||||||
|
<script type="text/javascript">
|
||||||
|
$(document).ready(function() {
|
||||||
|
$('.nav_btn').click(function() {
|
||||||
|
$('.mobile_nav_items').toggleClass('active');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<script type="text/javascript">
|
||||||
|
$(document).ready(function() {
|
||||||
|
//jquery for toggle sub menus
|
||||||
|
$('.sub-btn').click(function() {
|
||||||
|
$(this).next('.sub-menu').slideToggle();
|
||||||
|
$(this).find('.dropdown').toggleClass('rotate');
|
||||||
|
});
|
||||||
|
//jquery for expand and collapse the sidebar
|
||||||
|
$('.menu-btn').click(function() {
|
||||||
|
$('.side-bar').addClass('active');
|
||||||
|
$('.menu-btn').css("visibility", "hidden");
|
||||||
|
});
|
||||||
|
$('.close-btn').click(function() {
|
||||||
|
$('.side-bar').removeClass('active');
|
||||||
|
$('.menu-btn').css("visibility", "visible");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</html>
|
</html>
|
||||||
|
@ -73,7 +73,7 @@ we're going to need to do it here in order to allow for translations.
|
|||||||
<%= rendered "components/player" %>
|
<%= rendered "components/player" %>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="h-box">
|
<div class="h-box video-title">
|
||||||
<h1>
|
<h1>
|
||||||
<%= title %>
|
<%= title %>
|
||||||
<% if params.listen %>
|
<% if params.listen %>
|
||||||
@ -109,7 +109,7 @@ we're going to need to do it here in order to allow for translations.
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="pure-g">
|
<div class="pure-g">
|
||||||
<div class="pure-u-1 pure-u-lg-1-5">
|
<div class="pure-u-1 pure-u-lg-1-5 video-settings">
|
||||||
<div class="h-box">
|
<div class="h-box">
|
||||||
<span id="watch-on-youtube">
|
<span id="watch-on-youtube">
|
||||||
<a href="https://www.youtube.com/watch?v=<%= video.id %>"><%= translate(locale, "videoinfo_watch_on_youTube") %></a>
|
<a href="https://www.youtube.com/watch?v=<%= video.id %>"><%= translate(locale, "videoinfo_watch_on_youTube") %></a>
|
||||||
@ -250,7 +250,7 @@ we're going to need to do it here in order to allow for translations.
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<% if params.related_videos || plid %>
|
<% if params.related_videos || plid %>
|
||||||
<div class="pure-u-1 pure-u-lg-1-5">
|
<div class="pure-u-1 pure-u-lg-1-5 video-playlist">
|
||||||
<% if plid %>
|
<% if plid %>
|
||||||
<div id="playlist" class="h-box"></div>
|
<div id="playlist" class="h-box"></div>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
Loading…
Reference in New Issue
Block a user