diff --git a/httpdocs/theme/react/assets/css/product-browse.css b/httpdocs/theme/react/assets/css/product-browse.css index 5f9a32d75..9256f3112 100644 --- a/httpdocs/theme/react/assets/css/product-browse.css +++ b/httpdocs/theme/react/assets/css/product-browse.css @@ -1 +1 @@ -#product-browse{position:relative}#product-browse #product-tag-filter-container{position:absolute;right:0px;top:10px}#product-browse #product-tag-filter-container .product-tag-group-dropdown{width:135px;margin-right:5px;float:left}#product-browse #product-tag-filter-container .product-tag-group-dropdown select{width:100%}#product-browse-container #product-browse-item-list{padding:25px 0;float:left;margin-right:-7px;margin-left:-7px;min-width:100%}#product-browse-container #product-browse-item-list.on-mobile{margin:0}#product-browse-container #product-browse-item-list .product-browse-item-row{width:100%;float:left}#product-browse-container #product-browse-item-list .product-browse-item-row.favorites-row{padding:10px 0;font-size:12px;border-top:1px solid #ccc}#product-browse-container #product-browse-item-list .product-browse-item-row.favorites-row:first-of-type{border-top:0}#product-browse-container #product-browse-item-list .product-browse-item-row.skills-row{margin:0 -22px}@media only screen and (max-width:768px){#product-browse-container #product-browse-item-list .product-browse-item-row.skills-row{margin:0}}#product-browse-container #product-browse-item-list .product-browse-item{float:left;margin-bottom:30px;position:relative;padding:0 7px}#product-browse-container #product-browse-item-list .product-browse-item>a{display:block;width:100%;height:auto;text-decoration:none}#product-browse-container #product-browse-item-list .product-browse-item>a:hover{text-decoration:none !important}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars{display:block;width:83px !important;float:left;background-image:url('../img/rating_stars.png');background-position:0px 0px;height:25px !important}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-5{background-position:0 -22px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-10{background-position:0 -44px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-15{background-position:0 -66px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-20{background-position:0 -88px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-25{background-position:0 -110px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-30{background-position:0 -132px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-35{background-position:0 -154px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-40{background-position:0 -176px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-45{background-position:0 -198px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-50{background-position:0 -220px}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-image{width:100%;overflow:hidden;box-shadow:1px 1px 2px rgba(0,0,0,0.5);position:relative}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-image .product-browse-item-preview-music-player{position:absolute;top:0;left:0}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-image img{width:100%}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info{font-size:14px;font-weight:bold;overflow:hidden}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info h2{font-size:20px;font-weight:bold;margin-bottom:3px;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;font-size:18px;min-height:22px;margin-top:8px;margin-bottom:4px}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info span{width:50%;float:left;display:block;font-weight:normal;color:black;font-size:1.2rem}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info span b{color:black;font-weight:normal}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info span+span{text-align:right}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-music-item-info{font-size:14px;padding:5px;float:left;margin-bottom:5px;width:100%}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-music-item-info h2{font-size:16px;font-weight:bold;margin-bottom:3px;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;margin:5px 0;width:100%}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-music-item-info span{width:100%;float:left;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;margin:2px 0}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter{margin-top:3px;font-size:12px;font-weight:400;margin-bottom:5px}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter .hearts-container .glyphicon{width:auto;font-size:15px;color:#c1c1c1;font-weight:normal;margin-right:5px;margin-top:0px}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter .hearts-container .glyphicon.glyphicon-heart{display:none}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter .hearts-container:hover .glyphicon{display:none}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter .hearts-container:hover .glyphicon-heart{display:block ;color:red}#product-browse-container #product-browse-item-list .product-browse-item .info-container{width:100%;float:left}#product-browse-container #product-browse-item-list .product-browse-item .wrapper{width:100%;position:relative}#product-browse-container #product-browse-item-list .product-browse-item.phone-pictures .product-browse-image{border-radius:5px 5px 5px 5px}#product-browse-container #product-browse-item-list .product-browse-item.phone-pictures h2,#product-browse-container #product-browse-item-list .product-browse-item.phone-pictures span{font-size:13px;line-height:14px;font-weight:400}#product-browse-container #product-browse-item-list .product-browse-item.comics .product-browse-item-info h2{font-size:13px;line-height:14px;font-weight:400}#product-browse-container #product-browse-item-list .product-browse-item.comics .product-browse-item-info .score-container{margin-top:-10px}#product-browse-container #product-browse-item-list .product-browse-item.music *,#product-browse-container #product-browse-item-list .product-browse-item.music-test *{user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper{position:absolute;top:0;left:0;width:100%;height:40px;z-index:10}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control{float:left;background:rgba(0,0,0,0.5);height:40px;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span{display:block;padding:5px;float:left}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span svg,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span svg{font-size:28px;color:white;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span svg:hover,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span svg:hover{color:#31c27c}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span:first-child,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span:first-child,#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span:last-child,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span:last-child{display:none}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .track-number-display,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .track-number-display{opacity:0;float:right;background:rgba(0,0,0,0.5);height:40px;padding:5px;color:white;font-size:12px;line-height:30px;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .music-player-audio-control span:first-child,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .music-player-audio-control span:first-child,#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .music-player-audio-control span:last-child,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .music-player-audio-control span:last-child{display:block;padding:5px 0}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .track-number-display,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .track-number-display{opacity:1}#product-browse-container #product-browse-item-list .product-browse-item.music-test{height:150px}#product-browse-container #product-browse-item-list .product-browse-item.music-test .wrapper a.product-browse-item-wrapper{display:none}#product-browse-container #product-browse-item-list .product-browse-item.favorites{margin-bottom:0}#product-browse-container #product-browse-item-list .product-browse-item.favorites:first-of-type{border-top:0}#product-browse-container #product-browse-item-list .product-browse-item.favorites span.index{width:8.33333333%;display:block;float:left;text-align:center}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper{width:91.6666667%;display:block;float:left}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-image{width:15%;overflow:hidden;float:left}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-image img{max-width:100%;height:auto}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info{width:85%;float:left;padding-left:15px}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .info-container{width:75%;float:left}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .info-container span{width:auto;margin-right:10px}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .score-container{float:left;width:25%}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .score-container .rating{width:50%;margin-bottom:10px}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .score-container .rating .rating-text{margin-bottom:5px}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper{overflow:hidden;box-shadow:1px 1px 2px rgba(0,0,0,0.5);position:relative}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper .product-browse-image{box-shadow:none}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper .product-browse-item-info{padding:5px;height:100px}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper .product-browse-item-info>span{width:100%}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper .likes-counter{margin-top:3px;font-size:12px;font-weight:400;margin-bottom:5px;position:absolute;left:5px;bottom:5px;width:100%}#product-browse-container #product-browse-item-list .product-browse-item.skills{box-shadow:none !important;padding:0 30px}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper{width:100%;position:relative;padding:15px;box-shadow:0 0 1px rgba(0,0,0,0);border:1px solid #e8e8e8;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper:hover,#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper:active{border-color:transparent;box-shadow:1px 1px 2px rgba(0,0,0,0.5)}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper .product-browse-image{box-shadow:none !important}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper .product-browse-item-info h2{color:#787878}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper .product-browse-item-info span{width:100%;float:left;font-weight:normal;color:black;font-size:1.2rem !important;text-align:left !important;margin-top:8px;height:20px;line-height:16px;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player{width:100%;position:absolute;top:44px;left:0;z-index:10}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player button{padding:0;background-color:transparent;border:0;outline:none !important}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player{top:-44px;position:absolute;width:100%;left:0}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .track-counter{padding:5px;height:40px;background-color:rgba(0,0,0,0.5)}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls{float:left;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls span{cursor:pointer}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls svg{font-size:28px;color:white;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out;vertical-align:middle}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls svg:hover{color:#31c27c}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .track-counter{float:right;color:white;line-height:30px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls{width:100%;height:100px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls .play-icon,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls .pause-icon{font-size:60px;top:20px;position:absolute;left:50%;margin-left:-30px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls .prev-icon{font-size:50px;position:absolute;top:25px;left:0}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls .next-icon{font-size:50px;position:absolute;top:25px;right:0}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .track-counter{position:absolute;left:50%;bottom:0;height:27px;background:0;margin-left:-25px;padding:0;width:50px;text-align:center}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .music-player-counter{position:absolute;top:-44px;background-color:rgba(0,0,0,0.7);right:0;display:block;z-index:100000;height:44px;color:white;line-height:35px;padding:5px;display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel{position:absolute;height:44px;width:38px;overflow:hidden;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .play-mode-title{display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content{padding:5px;height:100%;position:relative;display:block}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .img-content,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .audio-title,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .progress-bar-content{display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content{padding:0px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group{padding:0;margin:0}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.prev-audio,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.next-audio,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.audio-lists-btn,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.play-sounds{display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.play-btn.play{margin-right:5px;margin-top:3px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.loading{margin-top:2px;margin-left:42px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile{height:auto;position:absolute;top:-44px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-header,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-singer,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-switch,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-cover,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-progress,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-operation{display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-toggle{padding:0;display:flex;justify-content:center}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-toggle .play-btn{padding:0 20px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .group.prev-audio,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .group.next-audio{display:none;padding-top:6px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.show-controls .music-player-counter{display:block}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.show-controls .react-jinke-music-player-main .music-player-panel{width:110px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.show-controls .group.prev-audio,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.show-controls .group.next-audio{display:block !important}#product-browse-container #product-browse-pagination{text-align:center;clear:both}#product-browse-container #product-browse-pagination ul{display:table;margin:10px auto;padding:0;list-style-type:none}#product-browse-container #product-browse-pagination ul li{float:left}#product-browse-container #product-browse-pagination ul li a,#product-browse-container #product-browse-pagination ul li span.no-link{display:block;padding:5px 4px;cursor:pointer} \ No newline at end of file +#product-browse{position:relative}#product-browse #product-tag-filter-container{position:absolute;right:0px;top:10px}#product-browse #product-tag-filter-container .product-tag-group-dropdown{width:135px;margin-right:5px;float:left}#product-browse #product-tag-filter-container .product-tag-group-dropdown select{width:100%}#product-browse-container #product-browse-item-list{padding:25px 0;float:left;margin-right:-7px;margin-left:-7px;min-width:100%}#product-browse-container #product-browse-item-list.on-mobile{margin:0}#product-browse-container #product-browse-item-list .product-browse-item-row{width:100%;float:left}#product-browse-container #product-browse-item-list .product-browse-item-row.favorites-row{padding:10px 0;font-size:12px;border-top:1px solid #ccc}#product-browse-container #product-browse-item-list .product-browse-item-row.favorites-row:first-of-type{border-top:0}#product-browse-container #product-browse-item-list .product-browse-item-row.skills-row{margin:0 -22px}@media only screen and (max-width:768px){#product-browse-container #product-browse-item-list .product-browse-item-row.skills-row{margin:0}}#product-browse-container #product-browse-item-list .product-browse-item{float:left;margin-bottom:30px;position:relative;padding:0 7px}#product-browse-container #product-browse-item-list .product-browse-item>a{display:block;width:100%;height:auto;text-decoration:none}#product-browse-container #product-browse-item-list .product-browse-item>a:hover{text-decoration:none !important}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars{display:block;width:83px !important;float:left;background-image:url('../img/rating_stars.png');background-position:0px 0px;height:25px !important}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-5{background-position:0 -22px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-10{background-position:0 -44px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-15{background-position:0 -66px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-20{background-position:0 -88px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-25{background-position:0 -110px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-30{background-position:0 -132px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-35{background-position:0 -154px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-40{background-position:0 -176px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-45{background-position:0 -198px}#product-browse-container #product-browse-item-list .product-browse-item .product-score-stars.stars-50{background-position:0 -220px}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-image{width:100%;overflow:hidden;box-shadow:1px 1px 2px rgba(0,0,0,0.5);position:relative}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-image .product-browse-item-preview-music-player{position:absolute;top:0;left:0}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-image img{width:100%}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info{font-size:14px;font-weight:bold;overflow:hidden}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info h2{font-size:20px;font-weight:bold;margin-bottom:3px;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;font-size:18px;min-height:22px;margin-top:8px;margin-bottom:4px}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info span{width:50%;float:left;display:block;font-weight:normal;color:black;font-size:1.2rem}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info span b{color:black;font-weight:normal}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-item-info span+span{text-align:right}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-music-item-info{font-size:14px;padding:5px;float:left;margin-bottom:5px;width:100%}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-music-item-info h2{font-size:16px;font-weight:bold;margin-bottom:3px;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;margin:5px 0;width:100%}#product-browse-container #product-browse-item-list .product-browse-item .product-browse-music-item-info span{width:100%;float:left;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;margin:2px 0}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter{margin-top:3px;font-size:12px;font-weight:400;margin-bottom:5px}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter .hearts-container .glyphicon{width:auto;font-size:15px;color:#c1c1c1;font-weight:normal;margin-right:5px;margin-top:0px}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter .hearts-container .glyphicon.glyphicon-heart{display:none}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter .hearts-container:hover .glyphicon{display:none}#product-browse-container #product-browse-item-list .product-browse-item .likes-counter .hearts-container:hover .glyphicon-heart{display:block ;color:red}#product-browse-container #product-browse-item-list .product-browse-item .info-container{width:100%;float:left}#product-browse-container #product-browse-item-list .product-browse-item .wrapper{width:100%;position:relative}#product-browse-container #product-browse-item-list .product-browse-item.phone-pictures .product-browse-image{border-radius:5px 5px 5px 5px}#product-browse-container #product-browse-item-list .product-browse-item.phone-pictures h2,#product-browse-container #product-browse-item-list .product-browse-item.phone-pictures span{font-size:13px;line-height:14px;font-weight:400}#product-browse-container #product-browse-item-list .product-browse-item.comics .product-browse-item-info h2{font-size:13px;line-height:14px;font-weight:400}#product-browse-container #product-browse-item-list .product-browse-item.comics .product-browse-item-info .score-container{margin-top:-10px}#product-browse-container #product-browse-item-list .product-browse-item.music *,#product-browse-container #product-browse-item-list .product-browse-item.music-test *{user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper{position:absolute;top:0;left:0;width:100%;height:40px;z-index:10}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control{float:left;background:rgba(0,0,0,0.5);height:40px;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span{display:block;padding:5px;float:left}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span svg,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span svg{font-size:28px;color:white;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span svg:hover,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span svg:hover{color:#31c27c}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span:first-child,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span:first-child,#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span:last-child,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .music-player-audio-control span:last-child{display:none}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar .track-number-display,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar .track-number-display{opacity:0;float:right;background:rgba(0,0,0,0.5);height:40px;padding:5px;color:white;font-size:12px;line-height:30px;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .music-player-audio-control span:first-child,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .music-player-audio-control span:first-child,#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .music-player-audio-control span:last-child,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .music-player-audio-control span:last-child{display:block;padding:5px 0}#product-browse-container #product-browse-item-list .product-browse-item.music .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .track-number-display,#product-browse-container #product-browse-item-list .product-browse-item.music-test .product-browse-music-player-wrapper .music-player-controls-bar.is-playing .track-number-display{opacity:1}#product-browse-container #product-browse-item-list .product-browse-item.music-test{height:150px}#product-browse-container #product-browse-item-list .product-browse-item.music-test .wrapper a.product-browse-item-wrapper{display:none}#product-browse-container #product-browse-item-list .product-browse-item.favorites{margin-bottom:0}#product-browse-container #product-browse-item-list .product-browse-item.favorites:first-of-type{border-top:0}#product-browse-container #product-browse-item-list .product-browse-item.favorites span.index{width:8.33333333%;display:block;float:left;text-align:center}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper{width:91.6666667%;display:block;float:left}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-image{width:15%;overflow:hidden;float:left}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-image img{max-width:100%;height:auto}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info{width:85%;float:left;padding-left:15px}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .info-container{width:75%;float:left}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .info-container span{width:auto;margin-right:10px}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .score-container{float:left;width:25%}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .score-container .rating{width:50%;margin-bottom:10px}#product-browse-container #product-browse-item-list .product-browse-item.favorites .product-browse-item-wrapper .product-browse-item-info .score-container .rating .rating-text{margin-bottom:5px}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper{overflow:hidden;box-shadow:1px 1px 2px rgba(0,0,0,0.5);position:relative}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper .product-browse-image{box-shadow:none}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper .product-browse-item-info{padding:5px;height:100px}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper .product-browse-item-info>span{width:100%}#product-browse-container #product-browse-item-list .product-browse-item.books .wrapper .likes-counter{margin-top:3px;font-size:12px;font-weight:400;margin-bottom:5px;position:absolute;left:5px;bottom:5px;width:100%}#product-browse-container #product-browse-item-list .product-browse-item.skills{box-shadow:none !important;padding:0 30px}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper{width:100%;position:relative;padding:15px;border:1px solid #e8e8e8;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper:hover,#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper:active{border-color:#cfcfcf}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper .product-browse-image{box-shadow:none !important}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper .product-browse-item-info h2{color:#787878}#product-browse-container #product-browse-item-list .product-browse-item.skills .wrapper .product-browse-item-info span{width:100%;float:left;font-weight:normal;color:black;font-size:1.2rem !important;text-align:left !important;margin-top:8px;height:20px;line-height:16px;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player{width:100%;position:absolute;top:44px;left:0;z-index:10}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player button{padding:0;background-color:transparent;border:0;outline:none !important}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player{top:-44px;position:absolute;width:100%;left:0}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .track-counter{padding:5px;height:40px;background-color:rgba(0,0,0,0.5)}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls{float:left;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls span{cursor:pointer}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls svg{font-size:28px;color:white;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out;vertical-align:middle}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .audio-player-controls svg:hover{color:#31c27c}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .player .track-counter{float:right;color:white;line-height:30px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls{width:100%;height:100px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls .play-icon,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls .pause-icon{font-size:60px;top:20px;position:absolute;left:50%;margin-left:-30px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls .prev-icon{font-size:50px;position:absolute;top:25px;left:0}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .audio-player-controls .next-icon{font-size:50px;position:absolute;top:25px;right:0}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.mobile .player .player-interface .track-counter{position:absolute;left:50%;bottom:0;height:27px;background:0;margin-left:-25px;padding:0;width:50px;text-align:center}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .music-player-counter{position:absolute;top:-44px;background-color:rgba(0,0,0,0.7);right:0;display:block;z-index:100000;height:44px;color:white;line-height:35px;padding:5px;display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel{position:absolute;height:44px;width:38px;overflow:hidden;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .play-mode-title{display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content{padding:5px;height:100%;position:relative;display:block}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .img-content,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .audio-title,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .progress-bar-content{display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content{padding:0px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group{padding:0;margin:0}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.prev-audio,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.next-audio,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.audio-lists-btn,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.play-sounds{display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.play-btn.play{margin-right:5px;margin-top:3px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-main .music-player-panel .panel-content .player-content .group.loading{margin-top:2px;margin-left:42px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile{height:auto;position:absolute;top:-44px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-header,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-singer,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-switch,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-cover,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-progress,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-operation{display:none}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-toggle{padding:0;display:flex;justify-content:center}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .react-jinke-music-player-mobile-toggle .play-btn{padding:0 20px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .group.prev-audio,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player .react-jinke-music-player-mobile .group.next-audio{display:none;padding-top:6px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.show-controls .music-player-counter{display:block}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.show-controls .react-jinke-music-player-main .music-player-panel{width:110px}#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.show-controls .group.prev-audio,#product-browse-container #product-browse-item-list .product-browse-item-preview-music-player.show-controls .group.next-audio{display:block !important}#product-browse-container #product-browse-pagination{text-align:center;clear:both}#product-browse-container #product-browse-pagination ul{display:table;margin:10px auto;padding:0;list-style-type:none}#product-browse-container #product-browse-pagination ul li{float:left}#product-browse-container #product-browse-pagination ul li a,#product-browse-container #product-browse-pagination ul li span.no-link{display:block;padding:5px 4px;cursor:pointer} \ No newline at end of file diff --git a/httpdocs/theme/react/assets/less/product-browse.less b/httpdocs/theme/react/assets/less/product-browse.less index e50509930..9c7da5c0d 100644 --- a/httpdocs/theme/react/assets/less/product-browse.less +++ b/httpdocs/theme/react/assets/less/product-browse.less @@ -1,748 +1,746 @@ // out: ../css/product-browse.css, sourcemap: true, compress: true @import "elements.less"; #product-browse { position: relative; #product-tag-filter-container { position: absolute; right: 0px; top: 10px; .product-tag-group-dropdown { width: 135px; margin-right: 5px; float: left; select { width:100%; } } } } #product-browse-container { #product-browse-item-list { padding: 25px 0; float: left; margin-right: -7px; margin-left: -7px; min-width: 100%; &.on-mobile { margin: 0; } .product-browse-item-row { width: 100%; float: left; &.favorites-row { padding: 10px 0; font-size: 12px; border-top: 1px solid #ccc; &:first-of-type { border-top: 0; } } &.skills-row { margin: 0 -22px; @media only screen and (max-width: 768px) { margin: 0; } } } .product-browse-item { float:left; margin-bottom:30px; position: relative; padding: 0 7px; > a { display: block; width:100%; height:auto; text-decoration: none; &:hover { text-decoration: none !important; } } .product-score-stars { display: block; width:83px !important; float: left; background-image: url('../img/rating_stars.png'); background-position: 0px 0px; height: 25px !important; &.stars-5 { background-position: 0px -22px; } &.stars-10 { background-position: 0px -44px; } &.stars-15 { background-position: 0px -66px; } &.stars-20 { background-position: 0px -88px; } &.stars-25 { background-position: 0px -110px; } &.stars-30 { background-position: 0px -132px; } &.stars-35 { background-position: 0px -154px; } &.stars-40 { background-position: 0px -176px; } &.stars-45 { background-position: 0px -198px; } &.stars-50 { background-position: 0px -220px; } } .product-browse-image { width: 100%; overflow: hidden; box-shadow: 1px 1px 2px rgba(0,0,0,0.5); position: relative; .product-browse-item-preview-music-player { position: absolute; top:0; left:0; } img { width: 100%; } } .product-browse-item-info { font-size:14px; font-weight: bold; overflow: hidden; h2 { font-size: 20px; font-weight: bold; margin-bottom: 3px; white-space: nowrap; overflow: hidden; display: block; text-overflow: ellipsis; font-size: 18px; min-height: 22px; margin-top: 8px; margin-bottom: 4px; } span { width: 50%; float: left; display: block; font-weight: normal; color: black; font-size: 1.2rem; b { color:black; font-weight: normal; } } span + span { text-align: right; } } .product-browse-music-item-info { font-size: 14px; padding: 5px; float: left; margin-bottom: 5px; width:100%; h2 { font-size: 16px; font-weight: bold; margin-bottom: 3px; white-space: nowrap; overflow: hidden; display: block; text-overflow: ellipsis; margin: 5px 0; width:100%; } span { width: 100%; float: left; white-space: nowrap; overflow: hidden; display: block; text-overflow: ellipsis; margin: 2px 0; } } .likes-counter { margin-top: 3px; font-size: 12px; font-weight: 400; margin-bottom: 5px; .hearts-container { .glyphicon { width: auto; font-size: 15px; color: #c1c1c1; font-weight: normal; margin-right: 5px; margin-top: 0px; &.glyphicon-heart { display: none; } } &:hover { .glyphicon { display: none; } .glyphicon-heart { display: block ; color:red; } } } } .info-container { width:100%; float:left; } .wrapper { width:100%; position: relative; } &.phone-pictures { .product-browse-image { border-radius: 5px 5px 5px 5px; } h2, span { font-size: 13px; line-height: 14px; font-weight: 400; } } &.comics { .product-browse-item-info { h2 { font-size: 13px; line-height: 14px; font-weight: 400; } .score-container { margin-top: -10px; } } } &.music, &.music-test { * { user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; } .product-browse-music-player-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 40px; z-index: 10; .music-player-controls-bar { .music-player-audio-control { float: left; background: rgba(0,0,0,0.5); height: 40px; .transition(); span { display: block; padding: 5px; float: left; svg { font-size: 28px; color: white; .transition(); &:hover { color:#31c27c; } } &:first-child, &:last-child { display: none; } } } .track-number-display { opacity: 0; float: right; background: rgba(0,0,0,0.5); height: 40px; padding: 5px; color: white; font-size: 12px; line-height: 30px; .transition() } &.is-playing { .music-player-audio-control { span { &:first-child, &:last-child { display: block; padding: 5px 0; } } } .track-number-display { opacity: 1; } } } } } &.music-test { height: 150px; .wrapper { a.product-browse-item-wrapper { display: none; } } } &.favorites { margin-bottom: 0; &:first-of-type { border-top: 0; } span.index { width: 8.33333333%; display: block; float: left; text-align: center; } .product-browse-item-wrapper { width: 91.6666667%; display: block; float: left; .product-browse-image { width:15%; overflow: hidden; float: left; img { max-width: 100%; height: auto; } } .product-browse-item-info { width: 85%; float: left; padding-left:15px; .info-container { width: 75%; float: left; span { width: auto; margin-right:10px; } } .score-container { float: left; width:25%; .rating { width:50%; margin-bottom: 10px; .rating-text { margin-bottom: 5px; } } } } } } &.books { .wrapper { overflow: hidden; box-shadow: 1px 1px 2px rgba(0,0,0,0.5); position: relative; .product-browse-image { box-shadow: none; } .product-browse-item-info { padding: 5px; height: 100px; > span { width: 100%; } } .likes-counter { margin-top: 3px; font-size: 12px; font-weight: 400; margin-bottom: 5px; position: absolute; left: 5px; bottom: 5px; width: 100%; } } } &.skills { box-shadow: none !important; padding: 0 30px; .wrapper { width: 100%; position: relative; padding: 15px; - box-shadow: 0px 0px 1px rgba(0,0,0,0.0); border: 1px solid #e8e8e8; .transition(); &:hover, &:active { - border-color: transparent; - box-shadow: 1px 1px 2px rgba(0,0,0,0.5); + border-color: darken(#e8e8e8,10%); } .product-browse-image { box-shadow: none !important; } .product-browse-item-info { h2 { color: #787878; } span { width: 100%; float: left; display: block; font-weight: normal; color: black; font-size: 1.2rem !important; text-align: left !important; margin-top: 8px; height: 20px; line-height: 16px; white-space: nowrap; overflow: hidden; display: block; text-overflow: ellipsis; } } } } } .product-browse-item-preview-music-player { width:100%; position: absolute; top: 44px; left: 0; z-index: 10; button { padding: 0; background-color: transparent; border: 0; outline: none !important; } .player { top: -44px; position: absolute; width:100%; left: 0; .audio-player-controls, .track-counter { padding: 5px; height: 40px; background-color: rgba(0,0,0,0.5); } .audio-player-controls { float: left; .transition(); span { cursor: pointer; } svg { font-size: 28px; color:white; .transition(); vertical-align: middle; &:hover { color: #31c27c; } } } .track-counter { float: right; color: white; line-height: 30px; } } &.mobile { .player { .player-interface { .audio-player-controls { width:100%; height:100px; .play-icon, .pause-icon { font-size: 60px; top: 20px; position: absolute; left: 50%; margin-left: -30px; } .prev-icon { font-size: 50px; position: absolute; top: 25px; left: 0; } .next-icon { font-size: 50px; position: absolute; top: 25px; right: 0; } } .track-counter { position: absolute; left: 50%; bottom: 0; height: 27px; background: 0; margin-left: -25px; padding: 0; width: 50px; text-align: center; } } } } .music-player-counter { position: absolute; top: -44px; background-color: rgba(0, 0, 0, 0.7); right: 0; display: block; z-index: 100000; height: 44px; color: white; line-height: 35px; padding: 5px; display: none; } .react-jinke-music-player-main .music-player-panel { position: absolute; height: 44px; width: 38px; overflow: hidden; .transition(); .play-mode-title { display: none; } .panel-content { padding:5px; height: 100%; position: relative; display: block; .img-content, .audio-title, .progress-bar-content { display: none; } .player-content { padding:0px; .group { padding:0; margin:0; &.prev-audio, &.next-audio, &.audio-lists-btn, &.play-sounds { display: none; } &.play-btn.play { margin-right:5px; margin-top: 3px; } &.loading { margin-top: 2px; margin-left: 42px; } } } } } .react-jinke-music-player-mobile { height: auto; position: absolute; top: -44px; .react-jinke-music-player-mobile-header, .react-jinke-music-player-mobile-singer, .react-jinke-music-player-mobile-switch, .react-jinke-music-player-mobile-cover, .react-jinke-music-player-mobile-progress, .react-jinke-music-player-mobile-operation { display: none; } .react-jinke-music-player-mobile-toggle { padding: 0; display: flex; justify-content: center; .play-btn { padding:0 20px; } } .group.prev-audio, .group.next-audio { display: none; padding-top: 6px; } } &.show-controls { .music-player-counter { display: block; } .react-jinke-music-player-main .music-player-panel { width:110px; } .group { &.prev-audio, &.next-audio { display: block !important; } } } } } #product-browse-pagination { text-align: center; clear: both; ul { display: table; margin: 10px auto; padding: 0; list-style-type: none; li { float: left; a, span.no-link { display: block; padding: 5px 4px; cursor: pointer; } } } } } \ No newline at end of file