feat: Add YouTube video support and update admin templates
- Introduced a new YouTube tech integration in `youtube.min.js` for enhanced video playback. - Created new admin template files for managing video settings, including `index.php` and `steasyvideo-pro.tpl`. - Updated hook templates (`device_mode.tpl`, `forquickview.tpl`, `header.tpl`, `miniature.tpl`, `miniature_tb.tpl`, and predefined templates) to include video functionality. - Implemented caching headers in several PHP files to improve performance. - Ensured all new templates include proper licensing information and copyright notices.
This commit is contained in:
150
modules/steasyvideo/views/css/front.css
Normal file
150
modules/steasyvideo/views/css/front.css
Normal file
@@ -0,0 +1,150 @@
|
||||
.st_easy_video_box{
|
||||
position: relative;
|
||||
background: #fff;
|
||||
}
|
||||
.st_easy_video_box.st_easy_video_box_absolute{
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
.pro_gallery_top .st_easy_video_box{
|
||||
}
|
||||
@media (min-width: 1200px){
|
||||
}
|
||||
@media only screen and (max-width: 991px) and (min-width: 768px){
|
||||
}
|
||||
@media (max-width: 767px){
|
||||
}
|
||||
|
||||
.pro_video_cover_invisible .pro_gallery_thumb, .hightlight_curr_thumbs .pro_video_cover_invisible.clicked_thumb .pro_gallery_thumb, .st_easy_video_placeholder, .st_easy_video_thumb_invisiable .thumb,.st_easy_video_no_image_thumb{
|
||||
opacity: 0;
|
||||
}
|
||||
.pro_video_cover_invisible .pro_gallery_thumb_box{
|
||||
border: none;
|
||||
}
|
||||
.st_easy_video_btn:focus,.video-js button:focus{
|
||||
outline: none;
|
||||
}
|
||||
.st_easy_video.video-js{position: static;}
|
||||
.st_easy_video_btn{
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
z-index: 10;
|
||||
outline: none;
|
||||
border:none;
|
||||
background: transparent;
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.st_easy_video_btn.st_easy_video_btn_absolute{
|
||||
position: absolute;
|
||||
}
|
||||
.st_easy_video_btn .vjs-icon-placeholder{
|
||||
display: block;
|
||||
width:36px;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
background: rgba(0,0,0,0.5);
|
||||
color: #fff;
|
||||
font-size: 22px;
|
||||
border-radius: 100%;
|
||||
padding: 0;
|
||||
border:none;
|
||||
border-style: solid;
|
||||
border-width: 0;
|
||||
font-size: 30px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.st_play_video_text{display: block;}
|
||||
.st_easy_video_btn.st_easy_video_close{
|
||||
right: 10px; top: 10px;left:auto;bottom: auto;
|
||||
}
|
||||
.st_easy_video_play_icon{pointer-events:none;}
|
||||
.pro_gallery_thumbs_container .st_easy_video_play,
|
||||
.st_easy_video_play_icon{
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
margin-left: -18px;
|
||||
margin-top: -18px;
|
||||
bottom: auto;
|
||||
}
|
||||
.st_easy_video_btn .vjs-icon-placeholder:before{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
font-family: VideoJS;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
content: "\f101";
|
||||
}
|
||||
.st_easy_video_btn.st_easy_video_close .vjs-icon-placeholder:before{
|
||||
content: "\f119";
|
||||
}
|
||||
|
||||
.st_easy_video_play{z-index: 10;}
|
||||
.st_easy_video_flex{display:-webkit-box;display:-moz-box;display:box;display:-moz-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;box-align:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;-ms-flex-align:center}
|
||||
.st_easy_video_invisible, .st_easy_video_btn.st_easy_video_invisible{display: none;}
|
||||
.pro_popup_trigger.layer_icon_wrap.st_active.st_easy_video_invisible{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.product-images>li.thumb-container{position: relative;}
|
||||
.st_easy_video_relative{
|
||||
position: relative;
|
||||
}
|
||||
.st_easy_video_absolute{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
.st_easy_video_layer{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #fff;
|
||||
}
|
||||
.vjs-youtube-mobile .vjs-big-play-button { display: none!important; }
|
||||
.vjs-youtube-mobile .vjs-resize-manager { display: none!important; }
|
||||
.st_easy_video_controls_youtubev .js-youtube .vjs-poster{display: none;}/*when youtube control is on, youtube de poster hui ba bo fang qi dang zhu*/
|
||||
.st_easy_video_miaoshu{margin-bottom: 30px;}
|
||||
.st_easy_video_miaoshu .st_easy_video_invisible{display: block;}
|
||||
.st_easy_video_miaoshu .st_easy_video_box{position: relative;}
|
||||
#product-images-large .slick-slide{position:relative;} /*for warehouse theme*/
|
||||
|
||||
|
||||
.st_easy_video_play_layout_0 .st_play_video_text{
|
||||
display: none;
|
||||
}
|
||||
.st_easy_video_play_layout_1 .vjs-icon-placeholder{
|
||||
display: none;
|
||||
}
|
||||
.st_easy_video_play_layout_2{
|
||||
}
|
||||
.st_easy_video_play_layout_3{
|
||||
flex-direction: column;
|
||||
}
|
||||
.st_easy_video_screen_only
|
||||
{
|
||||
position: absolute;
|
||||
top: -10000em; //for safari browser compatibility
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
clip: rect(0,0,0,0);
|
||||
border: 0;
|
||||
}
|
||||
|
||||
#st_easy_video_device_mode:after {content: 'desktop';}
|
||||
/*@media (max-width: 767px){#st_easy_video_device_mode:after {content: 'mobile';}}*/
|
||||
Reference in New Issue
Block a user