diff --git a/couchpotato/static/style/combined.min.css b/couchpotato/static/style/combined.min.css index 1091834..e69cc56 100644 --- a/couchpotato/static/style/combined.min.css +++ b/couchpotato/static/style/combined.min.css @@ -1,50 +1,50 @@ .search_form{display:inline-block;z-index:11;width:44px;position:relative} -.search_form .icon-search{position:absolute;z-index:2;top:50%;left:0;height:100%;text-align:center;color:#FFF;font-size:20px;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)} -.search_form .wrapper{position:absolute;left:44px;bottom:0;background:#ac0000;-webkit-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;display:none;-webkit-box-shadow:0 0 15px 2px rgba(0,0,0,.15);box-shadow:0 0 15px 2px rgba(0,0,0,.15)} -.search_form .wrapper:before{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);content:'';display:block;position:absolute;height:10px;width:10px;background:#ac0000;left:-6px;bottom:16px;z-index:1} -.search_form .input{background:#FFF;-webkit-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;position:relative;left:4px;height:44px;overflow:hidden;width:100%} +.search_form .icon-search{position:absolute;z-index:2;top:50%;left:0;height:100%;text-align:center;color:#FFF;font-size:20px;-webkit-transform:translateY(-50%);transform:translateY(-50%)} +.search_form .wrapper{position:absolute;left:44px;bottom:0;background:#ac0000;border-radius:3px 0 0 3px;display:none;box-shadow:0 0 15px 2px rgba(0,0,0,.15)} +.search_form .wrapper:before{-webkit-transform:rotate(45deg);transform:rotate(45deg);content:'';display:block;position:absolute;height:10px;width:10px;background:#ac0000;left:-6px;bottom:16px;z-index:1} +.search_form .input{background:#FFF;border-radius:3px 0 0 3px;position:relative;left:4px;height:44px;overflow:hidden;width:100%} .search_form .input input{position:absolute;top:0;left:0;height:100%;width:100%;z-index:1} .search_form .input input::-ms-clear{width:0;height:0} .search_form.focused,.search_form.shown{border-color:#04bce6} .search_form.focused .wrapper,.search_form.shown .wrapper{display:block;width:380px} .search_form.focused .input input,.search_form.shown .input input{opacity:1} -.search_form .results_container{min-height:50px;text-align:left;position:relative;left:4px;display:none;background:#FFF;-webkit-border-radius:3px 0 0;border-radius:3px 0 0;overflow:hidden} +.search_form .results_container{min-height:50px;text-align:left;position:relative;left:4px;display:none;background:#FFF;border-radius:3px 0 0;overflow:hidden} .search_form .results_container .results{max-height:280px;overflow-x:hidden} .search_form .results_container .results .media_result{overflow:hidden;height:50px;position:relative} .search_form .results_container .results .media_result .options{position:absolute;height:100%;top:0;left:30px;right:0;padding:10px;background:rgba(0,0,0,.3)} .search_form .results_container .results .media_result .options>.in_library_wanted{margin-top:-7px} -.search_form .results_container .results .media_result .options>div{border:0;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex} +.search_form .results_container .results .media_result .options>div{border:0;display:-webkit-flex;display:-ms-flexbox;display:flex} .search_form .results_container .results .media_result .options .thumbnail{vertical-align:middle} -.search_form .results_container .results .media_result .options select{vertical-align:middle;display:inline-block;margin-right:10px;min-width:70px;-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto} +.search_form .results_container .results .media_result .options select{vertical-align:middle;display:inline-block;margin-right:10px;min-width:70px;-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto} @media (max-width:480px){.search_form.focused .wrapper,.search_form.shown .wrapper{width:250px} .search_form .results_container .results .media_result{font-size:12px} .search_form .results_container .results .media_result .options{left:0} .search_form .results_container .results .media_result .options select{min-width:0} } -.search_form .results_container .results .media_result .options .button{-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto;vertical-align:middle;display:inline-block} +.search_form .results_container .results .media_result .options .button{-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto;vertical-align:middle;display:inline-block} .search_form .results_container .results .media_result .options .message{height:100%;font-size:20px;color:#fff;line-height:20px} .search_form .results_container .results .media_result .thumbnail{width:30px;min-height:100%;display:block;margin:0;vertical-align:top} -.search_form .results_container .results .media_result .data{position:absolute;height:100%;top:0;left:30px;right:0;cursor:pointer;border-top:1px solid rgba(255,255,255,.08);-webkit-transition:all .4s cubic-bezier(.9,0,.1,1);transition:all .4s cubic-bezier(.9,0,.1,1);-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);background:#FFF} +.search_form .results_container .results .media_result .data{position:absolute;height:100%;top:0;left:30px;right:0;cursor:pointer;border-top:1px solid rgba(255,255,255,.08);transition:all .4s cubic-bezier(.9,0,.1,1);-webkit-transform:translateX(0);transform:translateX(0);background:#FFF} @media (max-width:480px){.search_form .results_container .results .media_result .thumbnail{display:none} .search_form .results_container .results .media_result .data{left:0} } -.search_form .results_container .results .media_result .data.open{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%)} +.search_form .results_container .results .media_result .data.open{-webkit-transform:translateX(100%);transform:translateX(100%)} .search_form .results_container .results .media_result .data .in_library,.search_form .results_container .results .media_result .data .in_wanted{position:absolute;bottom:2px;left:14px;font-size:11px} .search_form .results_container .results .media_result .data .info{position:absolute;top:20%;left:15px;right:7px;vertical-align:middle} -.search_form .results_container .results .media_result .data .info h2{margin:0;font-weight:300;font-size:1.25em;padding:0;position:absolute;width:100%;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex} -.search_form .results_container .results .media_result .data .info h2 .title{display:inline-block;margin:0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto} +.search_form .results_container .results .media_result .data .info h2{margin:0;font-weight:300;font-size:1.25em;padding:0;position:absolute;width:100%;display:-webkit-flex;display:-ms-flexbox;display:flex} +.search_form .results_container .results .media_result .data .info h2 .title{display:inline-block;margin:0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto} .search_form .results_container .results .media_result .data .info h2 .year{opacity:.4;padding:0 5px;width:auto;display:none} .search_form .results_container .results .media_result:hover .info h2 .year{display:inline-block} .search_form .results_container .results .media_result:last-child .data{border-bottom:0} .search_form.focused.filled .results_container,.search_form.shown.filled .results_container{display:block} -.search_form.focused.filled .input,.search_form.shown.filled .input{-webkit-border-radius:0 0 0 3px;border-radius:0 0 0 3px} +.search_form.focused.filled .input,.search_form.shown.filled .input{border-radius:0 0 0 3px} .page.movies_manage,.page.movies_wanted{top:80px;padding:0} @media (max-width:480px){.page.movies_manage,.page.movies_wanted{top:44px} } .page.movies_manage .load_more,.page.movies_wanted .load_more{text-align:center;padding:20px;font-size:2em;display:block} .movie{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden} .movie .check{position:absolute;top:0;left:20px;display:none} -.movie .quality span{background:rgba(0,0,0,.2);color:#FFF;-webkit-border-radius:1px;border-radius:1px;padding:2px 4px} +.movie .quality span{background:rgba(0,0,0,.2);color:#FFF;border-radius:1px;padding:2px 4px} .movie .quality span.failed{background:#99563e} .movie .quality span.ignored{background:rgba(0,0,0,.2)} .movie .quality span.available{background:#2f8199} @@ -64,12 +64,12 @@ .list_list .movie:last-child{border-bottom:none} .list_list .movie:hover{background:rgba(0,0,0,.1)} .list_list .movie .data{padding:10px 20px} -.list_list .movie .data .info{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap} -.list_list .movie .data .info .title{-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto} +.list_list .movie .data .info{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap} +.list_list .movie .data .info .title{-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto} .list_list .movie .data .info .title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} @media (max-width:480px){.list_list .movie .data{padding:10px} .list_list .movie .data .info{display:block} -.list_list .movie .data .info .title{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap} +.list_list .movie .data .info .title{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap} .list_list .movie .data .info .title span{width:100%} } .list_list .movie .data .info .title .year{display:inline-block;margin:0 10px;opacity:.5} @@ -81,56 +81,53 @@ .list_list .movie .actions a .icon,.list_list .movie .actions a:before{display:none} .list_list .movie .actions a:hover{color:#ac0000} .list_list .movie:hover .actions{display:block} +.thumb_list{font-size:12px} +.thumb_list>div:last-child{padding:0 10px} +@media (max-width:768px){.thumb_list{padding:0 5px} +} @media (max-width:480px){.list_list .movie .data .info .quality span{margin:2px 2px 0 0} .list_list .movie:hover .actions{display:none} +.thumb_list{padding:0 3.33px} } -.thumb_list .movie .data .info .title,.thumb_list>div{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox} -.thumb_list{font-size:12px} -.thumb_list>div:last-child{padding:0 10px} -.thumb_list>div{display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-box-align:stretch;-webkit-align-items:stretch;-moz-box-align:stretch;-ms-flex-align:stretch;align-items:stretch} -.thumb_list .movie{margin-bottom:20px;position:relative;cursor:pointer;-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto;width:150px;max-width:14.285%;border:0 solid transparent;border-width:0 10px} +.thumb_list>div{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch} +.thumb_list .movie{margin-bottom:20px;position:relative;cursor:pointer;-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto;width:150px;max-width:14.285%;border:0 solid transparent;border-width:0 10px} @media (max-width:1382px){.thumb_list .movie{max-width:16.666666667%;border-width:0 8px} } @media (max-width:1024px){.thumb_list .movie{max-width:20%;border-width:0 6.67px} } -@media (max-width:768px){.thumb_list{padding:0 5px} -.thumb_list .movie{max-width:33.333%;border-width:0 5px} +@media (max-width:768px){.thumb_list .movie{max-width:33.333%;border-width:0 5px} } -@media (max-width:480px){.thumb_list{padding:0 3.33px} -.thumb_list .movie{max-width:50%;border-width:0 4px} -} -.thumb_list .movie .poster{position:relative;-webkit-border-radius:3px;border-radius:3px;background:center no-repeat #eaeaea;-webkit-background-size:cover;background-size:cover;overflow:hidden;width:100%;padding-bottom:150%} +.thumb_list .movie .poster{position:relative;border-radius:3px;background:center no-repeat #eaeaea;background-size:cover;overflow:hidden;width:100%;padding-bottom:150%} .thumb_list .movie .data{clear:both} -.thumb_list .movie .data .info .title{display:flex;padding:3px 0} -.thumb_list .movie .data .info .title span{-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} +.thumb_list .movie .data .info .title{display:-webkit-flex;display:-ms-flexbox;display:flex;padding:3px 0} +.thumb_list .movie .data .info .title span{-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .thumb_list .movie .data .info .title .year{display:inline-block;margin-left:5px;opacity:.5} .thumb_list .movie .data .info .quality{white-space:nowrap;overflow:hidden} .thumb_list .movie .data .info .quality span{font-size:.8em;margin-right:2px} -.thumb_list .movie .actions{background-image:-webkit-linear-gradient(65deg,rgba(172,0,0,0) 0,rgba(172,0,0,.9) 100%);background-image:linear-gradient(25deg,rgba(172,0,0,0) 0,rgba(172,0,0,.9) 100%);-webkit-transition:all 250ms;transition:all 250ms;opacity:0;position:absolute;top:0;right:0;bottom:0;left:0;text-align:right} +.thumb_list .movie .actions{background-image:linear-gradient(25deg,rgba(172,0,0,0) 0,rgba(172,0,0,.9) 100%);transition:all 250ms;opacity:0;position:absolute;top:0;right:0;bottom:0;left:0;text-align:right} .thumb_list .movie .actions .action{position:relative;display:block;margin-bottom:1px;width:auto;margin-right:10px} .thumb_list .movie .actions .action:first-child{margin-top:10px} -.thumb_list .movie .actions .action a{-webkit-transition:all 150ms cubic-bezier(.9,0,.1,1);transition:all 150ms cubic-bezier(.9,0,.1,1);display:inline-block;width:auto;padding:6.67px;color:#FFF;-webkit-border-radius:2px;border-radius:2px} +.thumb_list .movie .actions .action a{transition:all 150ms cubic-bezier(.9,0,.1,1);display:inline-block;width:auto;padding:6.67px;color:#FFF;border-radius:2px} .thumb_list .movie .actions .action a:hover{background:#FFF;color:#ac0000} .thumb_list .movie:hover .actions{opacity:1} -.thumb_list .movie .mask{bottom:44px;-webkit-border-radius:3px;border-radius:3px;-webkit-transition:opacity 30ms;transition:opacity 30ms} +.thumb_list .movie .mask{bottom:44px;border-radius:3px;transition:opacity 30ms} .eta{display:none} .page.movie_details{pointer-events:none} -@media (max-width:480px){.thumb_list .movie:hover .actions{display:none} +@media (max-width:480px){.thumb_list .movie{max-width:50%;border-width:0 4px} +.thumb_list .movie:hover .actions{display:none} .page.movie_details{left:0} } -.page.movie_details .overlay{left:132px;background:rgba(0,0,0,.6);border-radius:3px 0 0 3px;opacity:0;-webkit-transition:opacity 800ms;transition:opacity 800ms} -.page.movie_details .content,.page.movie_details .overlay{bottom:0;right:0;position:fixed;top:0;-webkit-border-radius:3px 0 0 3px} -.page.movie_details .overlay .close{display:inline-block;text-align:center;font-size:60px;line-height:80px;color:#FFF;width:44px;height:100%;opacity:0;transform:translateX(100%);-webkit-transition:opacity 300ms,-webkit-transform 300ms cubic-bezier(.9,0,.1,1);transition:opacity 300ms,transform 300ms cubic-bezier(.9,0,.1,1)} -.page.movie_details .content,.page.movie_details .overlay .close{-webkit-transform:translateX(100%);-ms-transform:translateX(100%)} +.page.movie_details .overlay{position:fixed;top:0;bottom:0;right:0;left:132px;background:rgba(0,0,0,.6);border-radius:3px 0 0 3px;opacity:0;transition:opacity 800ms} +.page.movie_details .overlay .close{display:inline-block;text-align:center;font-size:60px;line-height:80px;color:#FFF;width:44px;height:100%;opacity:0;-webkit-transform:translateX(100%);transform:translateX(100%);transition:opacity 300ms,-webkit-transform 300ms cubic-bezier(.9,0,.1,1);transition:opacity 300ms,transform 300ms cubic-bezier(.9,0,.1,1)} @media (max-width:480px){.page.movie_details .overlay{left:0} .page.movie_details .overlay .close{width:44px} } -.page.movie_details .content{left:176px;background:#FFF;border-radius:3px 0 0 3px;overflow-y:auto;transform:translateX(100%);-webkit-transition:-webkit-transform 250ms cubic-bezier(.9,0,.1,1);transition:transform 250ms cubic-bezier(.9,0,.1,1)} -.page.movie_details .content>.head{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap;padding:0 20px;line-height:80px} +.page.movie_details .content{position:fixed;top:0;bottom:0;right:0;left:176px;background:#FFF;border-radius:3px 0 0 3px;overflow-y:auto;-webkit-transform:translateX(100%);transform:translateX(100%);transition:-webkit-transform 250ms cubic-bezier(.9,0,.1,1);transition:transform 250ms cubic-bezier(.9,0,.1,1)} +.page.movie_details .content>.head{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap;padding:0 20px;line-height:80px} @media (max-width:480px){.page.movie_details .content{left:44px} .page.movie_details .content>.head{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:0 10px;line-height:1em} } -.page.movie_details .content>.head h1{-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto;margin:0;font-size:24px;color:rgba(0,0,0,.5);font-weight:300;max-width:100%} +.page.movie_details .content>.head h1{-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto;margin:0;font-size:24px;color:rgba(0,0,0,.5);font-weight:300;max-width:100%} @media (max-width:480px){.page.movie_details .content>.head h1{min-width:100%;line-height:44px} .page.movie_details .content>.head h1 .more_menu{width:100%} } @@ -139,12 +136,12 @@ .page.movie_details .content>.head .more_menu .icon-dropdown{position:relative;padding:0 20px 0 0} .page.movie_details .content>.head .more_menu .icon-dropdown:before{position:absolute;right:0;opacity:.2} .page.movie_details .content>.head .more_menu .icon-dropdown:hover:before,.page.movie_details.show .overlay{opacity:1} -.page.movie_details .content>.head .more_menu .wrapper{top:70px;padding-top:4px;-webkit-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;font-size:14px} +.page.movie_details .content>.head .more_menu .wrapper{top:70px;padding-top:4px;border-radius:3px 3px 0 0;font-size:14px} @media (max-width:480px){.page.movie_details .content>.head .more_menu>a{line-height:1em} .page.movie_details .content>.head .more_menu .wrapper{top:25px} } .page.movie_details .content>.head .more_menu .wrapper:before{top:0;left:auto;right:22px} -.page.movie_details .content>.head .more_menu .wrapper ul{-webkit-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;max-height:215px;overflow-y:auto} +.page.movie_details .content>.head .more_menu .wrapper ul{border-radius:3px 3px 0 0;max-height:215px;overflow-y:auto} .page.movie_details .content>.head .more_menu .wrapper a{padding-right:30px} .page.movie_details .content>.head .more_menu .wrapper a:before{position:absolute;right:10px} .page.movie_details .content>.head .more_menu .wrapper a.icon-ok,.page.movie_details .content>.head .more_menu .wrapper a:hover{color:#ac0000} @@ -155,12 +152,12 @@ .page.movie_details .content>.head .buttons a:hover{color:#000} .page.movie_details .content .section{padding:20px;border-top:1px solid rgba(0,0,0,.1)} .page.movie_details.show{pointer-events:auto} -.page.movie_details.show .overlay .close{opacity:1;-webkit-transition-delay:300ms;transition-delay:300ms;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)} -.page.movie_details.show .content{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)} +.page.movie_details.show .overlay .close{opacity:1;transition-delay:300ms;-webkit-transform:translateX(0);transform:translateX(0)} +.page.movie_details.show .content{-webkit-transform:translateX(0);transform:translateX(0)} .page.movie_details .section_add{background:#eaeaea} -.page.movie_details .section_add .options>div{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex} -.page.movie_details .section_add .options>div select{vertical-align:middle;display:inline-block;margin-right:10px;min-width:70px;-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto} -.page.movie_details .section_add .options>div .button{background:#FFF;-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto;vertical-align:middle;display:inline-block;text-align:center} +.page.movie_details .section_add .options>div{display:-webkit-flex;display:-ms-flexbox;display:flex} +.page.movie_details .section_add .options>div select{vertical-align:middle;display:inline-block;margin-right:10px;min-width:70px;-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto} +.page.movie_details .section_add .options>div .button{background:#FFF;-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto;vertical-align:middle;display:inline-block;text-align:center} .page.movie_details .section_add .data,.page.movie_details .section_add .thumbnail{display:none} .page.movie_details .releases .buttons{margin-bottom:10px} @media (max-width:480px){.page.movie_details .content>.head .more_menu.title .wrapper{top:30px;max-width:240px} @@ -172,7 +169,7 @@ .page.movie_details .releases .item:not(.head):hover{background:#eaeaea} .page.movie_details .releases .item span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center;padding:6.67px 0} .page.movie_details .releases .item span:before{display:none;font-style:italic;opacity:.6;margin-right:3px;width:100%;font-size:.9em} -.page.movie_details .releases .item .name{-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto;text-align:left} +.page.movie_details .releases .item .name{-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto;text-align:left} .page.movie_details .releases .item.ignored span:not(.actions){opacity:.3} .page.movie_details .releases .item.ignored .name{text-decoration:line-through} .page.movie_details .releases .item .actions{padding:0} @@ -204,18 +201,18 @@ .page.movie_details .releases .actions{min-width:80px;max-width:80px} .page.movie_details .trailer_container{background:#000;position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:100%;cursor:pointer} .alph_nav .menus .button,.alph_nav .menus .counter{line-height:80px;padding:0 10px} -.page.movie_details .trailer_container .background{opacity:.6;-webkit-transition:all 300ms;transition:all 300ms;-webkit-filter:blur(10px);filter:blur(10px);-webkit-transform:scale(1.05)translateZ(0);transform:scale(1.05)translateZ(0);background:center no-repeat;-webkit-background-size:cover;background-size:cover;position:absolute;top:0;right:0;bottom:0;left:0;z-index:1} -.page.movie_details .trailer_container .icon-play{opacity:.9;position:absolute;z-index:2;text-align:center;width:100%;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);-webkit-transition:all 300ms;transition:all 300ms;color:#FFF;font-size:110px} +.page.movie_details .trailer_container .background{opacity:.6;transition:all 300ms;-webkit-filter:blur(10px);filter:blur(10px);-webkit-transform:scale(1.05)translateZ(0);transform:scale(1.05)translateZ(0);background:center no-repeat;background-size:cover;position:absolute;top:0;right:0;bottom:0;left:0;z-index:1} +.page.movie_details .trailer_container .icon-play{opacity:.9;position:absolute;z-index:2;text-align:center;width:100%;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);transition:all 300ms;color:#FFF;font-size:110px} @media (max-width:1024px){.page.movie_details .trailer_container .icon-play{font-size:55px} } @media (max-width:480px){.page.movie_details .trailer_container .icon-play{font-size:31.43px} } -.page.movie_details .trailer_container .icon-play span{-webkit-transition:all 300ms;transition:all 300ms;opacity:.9;position:absolute;font-size:1em;top:50%;left:50%;margin-left:55px;-webkit-transform:translateY(-54%);-ms-transform:translateY(-54%);transform:translateY(-54%)} +.page.movie_details .trailer_container .icon-play span{transition:all 300ms;opacity:.9;position:absolute;font-size:1em;top:50%;left:50%;margin-left:55px;-webkit-transform:translateY(-54%);transform:translateY(-54%)} @media (max-width:1024px){.page.movie_details .trailer_container .icon-play span{margin-left:27.5px} } @media (max-width:480px){.page.movie_details .trailer_container .icon-play span{margin-left:15.71px} } -.page.movie_details .trailer_container .icon-play span:first-child{margin-left:-55px;-webkit-transform:translate(-100%,-54%);-ms-transform:translate(-100%,-54%);transform:translate(-100%,-54%)} +.page.movie_details .trailer_container .icon-play span:first-child{margin-left:-55px;-webkit-transform:translate(-100%,-54%);transform:translate(-100%,-54%)} @media (max-width:1024px){.page.movie_details .trailer_container .icon-play span:first-child{margin-left:-27.5px} } .page.movie_details .trailer_container:hover{color:#ac0000} @@ -242,9 +239,9 @@ .alph_nav .menus .filter .numbers li{float:left;width:10%;height:30px;line-height:30px;text-align:center;color:rgba(0,0,0,.2);cursor:default;border:0} .alph_nav .menus .filter .numbers li.available{color:#000;cursor:pointer} .alph_nav .menus .more_menu.show .button{color:#000} -.alph_nav .menus .more_menu .wrapper{top:70px;padding-top:4px;-webkit-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;min-width:140px} +.alph_nav .menus .more_menu .wrapper{top:70px;padding-top:4px;border-radius:3px 3px 0 0;min-width:140px} .alph_nav .menus .more_menu .wrapper:before{top:0;left:auto;right:22px} -.alph_nav .menus .more_menu .wrapper ul{-webkit-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0} +.alph_nav .menus .more_menu .wrapper ul{border-radius:3px 3px 0 0} .charts{clear:both;margin-bottom:30px} .charts>h2{height:40px} .charts .chart{width:50%;vertical-align:top;max-height:510px;scrollbar-base-color:#4e5969} @@ -268,8 +265,8 @@ .charts .chart .media_result .data .info .rating{font-size:20px;float:right;margin-top:-20px} .charts .chart .media_result .data .info .rating:before{content:"\e031";font-family:Elusive-Icons;font-size:14px;margin:0 5px 0 0;vertical-align:bottom} .charts .chart .media_result .data .info .genres{font-size:11px;font-style:italic;text-align:right} -.charts .chart .media_result .data .info .plot{display:block;font-size:11px;overflow:hidden;text-align:justify;height:100%;z-index:2;top:64px;position:absolute;background:#4e5969;cursor:pointer;-webkit-transition:all .4s ease-in-out;transition:all .4s ease-in-out;padding:0 3px 10px 0} -.charts .chart .media_result .data:before{content:'';display:block;height:10px;right:0;left:0;bottom:10px;position:absolute;background:-webkit-linear-gradient(90deg,#4e5969 0,rgba(78,89,105,0) 100%);background:linear-gradient(0deg,#4e5969 0,rgba(78,89,105,0) 100%);z-index:3;pointer-events:none} +.charts .chart .media_result .data .info .plot{display:block;font-size:11px;overflow:hidden;text-align:justify;height:100%;z-index:2;top:64px;position:absolute;background:#4e5969;cursor:pointer;transition:all .4s ease-in-out;padding:0 3px 10px 0} +.charts .chart .media_result .data:before{content:'';display:block;height:10px;right:0;left:0;bottom:10px;position:absolute;background:linear-gradient(0deg,#4e5969 0,rgba(78,89,105,0) 100%);z-index:3;pointer-events:none} .charts .chart .media_result .data .info .plot.full{top:0;overflow:auto} .charts .chart .media_result .data{cursor:default} .charts .chart .media_result .options{left:150px} @@ -310,8 +307,8 @@ .suggestions .media_result .data .info .rating{font-size:20px;float:right;margin-top:-20px} .suggestions .media_result .data .info .rating:before{content:"\e031";font-family:Elusive-Icons;font-size:14px;margin:0 5px 0 0;vertical-align:bottom} .suggestions .media_result .data .info .genres{font-size:11px;font-style:italic;text-align:right} -.suggestions .media_result .data .info .plot{display:block;font-size:11px;overflow:hidden;text-align:justify;height:100%;z-index:2;top:64px;position:absolute;background:#4e5969;cursor:pointer;-webkit-transition:all .4s ease-in-out;transition:all .4s ease-in-out;padding:0 3px 10px 0} -.suggestions .media_result .data:before{content:'';display:block;height:10px;right:0;left:0;bottom:10px;position:absolute;background:-webkit-linear-gradient(90deg,#4e5969 0,rgba(78,89,105,0) 100%);background:linear-gradient(0deg,#4e5969 0,rgba(78,89,105,0) 100%);z-index:3;pointer-events:none} +.suggestions .media_result .data .info .plot{display:block;font-size:11px;overflow:hidden;text-align:justify;height:100%;z-index:2;top:64px;position:absolute;background:#4e5969;cursor:pointer;transition:all .4s ease-in-out;padding:0 3px 10px 0} +.suggestions .media_result .data:before{content:'';display:block;height:10px;right:0;left:0;bottom:10px;position:absolute;background:linear-gradient(0deg,#4e5969 0,rgba(78,89,105,0) 100%);z-index:3;pointer-events:none} .suggestions .media_result .data .info .plot.full{top:0;overflow:auto} .suggestions .media_result .data{cursor:default} .suggestions .media_result .options{left:100px} @@ -332,7 +329,7 @@ .category .formHint{opacity:.1} .category:hover .formHint{opacity:1} #category_ordering ul{float:left;margin:0;width:275px;padding:0} -#category_ordering li{cursor:-webkit-grab;cursor:-moz-grab;cursor:grab;padding:5px;list-style:none} +#category_ordering li{cursor:-webkit-grab;cursor:grab;padding:5px;list-style:none} #category_ordering li .check{margin:2px 10px 0 0;vertical-align:top} #category_ordering li>span{display:inline-block;height:20px;vertical-align:top;line-height:20px} #category_ordering li .handle{width:20px;float:right} @@ -354,22 +351,22 @@ .page.log .container .error{color:#FFA4A4} .page.log .container .debug span{opacity:.6} .page.log[data-filter=DEBUG] .error,.page.log[data-filter=DEBUG] .info,.page.log[data-filter=ERROR] .debug,.page.log[data-filter=ERROR] .info,.page.log[data-filter=INFO] .debug,.page.log[data-filter=INFO] .error{display:none} -.report_popup.report_popup{position:fixed;left:0;right:0;bottom:0;top:0;z-index:99999;font-size:14px;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;opacity:1;color:#FFF;pointer-events:auto} +.report_popup.report_popup{position:fixed;left:0;right:0;bottom:0;top:0;z-index:99999;font-size:14px;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;opacity:1;color:#FFF;pointer-events:auto} .mask,.page.disable_hover>*{pointer-events:none} .report_popup.report_popup .button{display:inline-block;margin:10px 0;padding:10px;color:#FFF} -.report_popup.report_popup .bug{width:80%;height:80%;max-height:800px;max-width:800px;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-flow:column nowrap;-ms-flex-flow:column nowrap;flex-flow:column nowrap} +.report_popup.report_popup .bug{width:80%;height:80%;max-height:800px;max-width:800px;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:column nowrap;-ms-flex-flow:column nowrap;flex-flow:column nowrap} .report_popup.report_popup .bug textarea{display:block;width:100%;background:#FFF;padding:20px;overflow:auto;color:#666;height:70%;font-size:12px} .do_report.do_report{z-index:10000;position:absolute;padding:10px;background:#ac0000;color:#FFF} .add_new_profile{padding:20px;display:block;text-align:center;font-size:20px} .profile{margin-bottom:20px} .profile .quality_label input{font-weight:700} -.profile .ctrlHolder .types{-webkit-box-flex:1;-webkit-flex:1 1 auto;-moz-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:360px} -.profile .ctrlHolder .types .type{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-row:row nowrap;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;padding:2px 0} +.profile .ctrlHolder .types{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;min-width:360px} +.profile .ctrlHolder .types .type{display:-webkit-flex;display:-ms-flexbox;display:flex;flex-row:row nowrap;-webkit-align-items:center;-ms-flex-align:center;align-items:center;padding:2px 0} .profile .ctrlHolder .types .type label{min-width:0;margin-left:10px} .profile .ctrlHolder .types .type label span{font-size:.9em} .profile .ctrlHolder .types .type input[type=checkbox]{margin-right:3px} .profile .ctrlHolder .types .type .delete,.profile .ctrlHolder .types .type .handle{margin-left:5px;width:20px;font-size:20px;opacity:.1;text-align:center;cursor:pointer} -.profile .ctrlHolder .types .type .delete.handle,.profile .ctrlHolder .types .type .handle.handle{cursor:-webkit-grab;cursor:-moz-grab;cursor:grab} +.profile .ctrlHolder .types .type .delete.handle,.profile .ctrlHolder .types .type .handle.handle{cursor:-webkit-grab;cursor:grab} .profile .ctrlHolder .types .type .delete:hover,.profile .ctrlHolder .types .type .handle:hover{opacity:1} .profile .ctrlHolder .types .type.is_empty .delete,.profile .ctrlHolder .types .type.is_empty .handle{display:none} .profile .ctrlHolder.wait_for.wait_for{display:block} @@ -377,12 +374,12 @@ .profile .ctrlHolder.wait_for.wait_for .advanced{display:none;color:#ac0000} .show_advanced .profile .ctrlHolder.wait_for.wait_for .advanced{display:inline} #profile_ordering ul{list-style:none;margin:0;width:275px;padding:0} -#profile_ordering li{padding:5px;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center} +#profile_ordering li{padding:5px;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center} #profile_ordering li:hover{background:#eaeaea} #profile_ordering li input[type=checkbox]{margin:2px 10px 0 0;vertical-align:top} #profile_ordering li>span{display:inline-block;height:20px;vertical-align:top;line-height:20px} -#profile_ordering li>span.profile_label{-webkit-box-flex:1;-webkit-flex:1 1 auto;-moz-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto} -#profile_ordering li .handle{font-size:20px;width:20px;float:right;cursor:-webkit-grab;cursor:-moz-grab;cursor:grab;opacity:.5;text-align:center} +#profile_ordering li>span.profile_label{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto} +#profile_ordering li .handle{font-size:20px;width:20px;float:right;cursor:-webkit-grab;cursor:grab;opacity:.5;text-align:center} #profile_ordering li .handle:hover{opacity:1} .group_sizes .item .label{min-width:150px} .group_sizes .item .max,.group_sizes .item .min{display:inline-block;width:70px!important;min-width:0!important;margin-right:10px;text-align:center} @@ -397,7 +394,8 @@ .page.wizard .uniForm{margin:0 0 30px;width:83%} .page.wizard h1{padding:10px 0;display:block;font-size:30px;margin:80px 5px 0} .page.wizard .description{padding:10px 5px;font-size:1.45em;line-height:1.4em;display:block} -.page.wizard .tab_wrapper{background:#5c697b;height:65px;font-size:1.75em;position:fixed;top:0;margin:0;width:100%;left:0;z-index:2;-webkit-box-shadow:0 0 10px rgba(0,0,0,.1);box-shadow:0 0 10px rgba(0,0,0,.1)} +.page.wizard .tab_wrapper{background:#5c697b;height:65px;font-size:1.75em;position:fixed;top:0;margin:0;width:100%;left:0;z-index:2;box-shadow:0 0 10px rgba(0,0,0,.1)} +.messages .message,.more_menu .wrapper{box-shadow:0 0 15px 2px rgba(0,0,0,.15)} .page.wizard .tab_wrapper .tabs{padding:0;margin:0 auto;display:block;height:100%;width:100%;max-width:960px} .page.wizard .tabs li{display:inline-block;height:100%} .page.wizard .tabs li a{padding:20px 10px;height:100%;display:block;color:#FFF;font-weight:400;border-bottom:4px solid transparent} @@ -484,21 +482,21 @@ @font-face{font-family:OpenSans;src:url(../fonts/OpenSans-Bold-webfont.eot);src:url(../fonts/OpenSans-Bold-webfont.eot?#iefix)format("embedded-opentype"),url(../fonts/OpenSans-Bold-webfont.woff)format("woff"),url(../fonts/OpenSans-Bold-webfont.ttf)format("truetype"),url(../fonts/OpenSans-Bold-webfont.svg#OpenSansBold)format("svg");font-weight:700;font-style:normal} @font-face{font-family:OpenSans;src:url(../fonts/OpenSans-BoldItalic-webfont.eot);src:url(../fonts/OpenSans-BoldItalic-webfont.eot?#iefix)format("embedded-opentype"),url(../fonts/OpenSans-BoldItalic-webfont.woff)format("woff"),url(../fonts/OpenSans-BoldItalic-webfont.ttf)format("truetype"),url(../fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic)format("svg");font-weight:700;font-style:italic} @font-face{font-family:Lobster;src:url(../fonts/Lobster-webfont.eot);src:url(../fonts/Lobster-webfont.eot?#iefix)format("embedded-opentype"),url(../fonts/Lobster-webfont.woff2)format("woff2"),url(../fonts/Lobster-webfont.woff)format("woff"),url(../fonts/Lobster-webfont.ttf)format("truetype"),url(../fonts/Lobster-webfont.svg#lobster_14regular)format("svg");font-weight:400;font-style:normal} -*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-rendering:optimizeSpeed} +*{box-sizing:border-box;text-rendering:optimizeSpeed} body,html{font-size:14px;line-height:1.5;font-family:OpenSans,"Helvetica Neue",Helvetica,Arial,Geneva,sans-serif;font-weight:300;height:100%;background:#111;overflow:hidden} -body{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap} +body{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap} a{text-decoration:none;cursor:pointer} input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#FFF;border:1px solid #b7b7b7} -.button{color:#ac0000;font-weight:300;padding:5px;cursor:pointer;border:1px solid #ac0000;-webkit-border-radius:3px;border-radius:3px;margin:0 5px;-webkit-transition:all 150ms;transition:all 150ms} +.button{color:#ac0000;font-weight:300;padding:5px;cursor:pointer;border:1px solid #ac0000;border-radius:3px;margin:0 5px;transition:all 150ms} .button:hover{background:#ac0000;color:#FFF} .header{width:132px;min-width:132px;position:relative;z-index:100} .header a{color:#FFF;letter-spacing:1px} -.header .navigation .logo{background:#ac0000;display:block;text-align:center;position:relative;overflow:hidden;font-family:Lobster,serif;color:#FFF;font-size:38px;line-height:80px;height:80px;-webkit-transition:background 200ms cubic-bezier(.9,0,.1,1);transition:background 200ms cubic-bezier(.9,0,.1,1)} -.header .navigation .logo span{position:absolute;display:block;height:100%;left:50%;-webkit-transition:all 200ms cubic-bezier(.9,0,.1,1);transition:all 200ms cubic-bezier(.9,0,.1,1);-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%)} -.header .navigation .logo span:nth-child(even){-webkit-transform:translateX(45%);-ms-transform:translateX(45%);transform:translateX(45%);opacity:0} +.header .navigation .logo{background:#ac0000;display:block;text-align:center;position:relative;overflow:hidden;font-family:Lobster,serif;color:#FFF;font-size:38px;line-height:80px;height:80px;transition:background 200ms cubic-bezier(.9,0,.1,1)} +.header .navigation .logo span{position:absolute;display:block;height:100%;left:50%;transition:all 200ms cubic-bezier(.9,0,.1,1);-webkit-transform:translateX(-50%);transform:translateX(-50%)} +.header .navigation .logo span:nth-child(even){-webkit-transform:translateX(45%);transform:translateX(45%);opacity:0} .header .navigation .logo:hover{background:#980000} -.header .navigation .logo:hover span{-webkit-transform:translateX(-153%);-ms-transform:translateX(-153%);transform:translateX(-153%);opacity:0} -.header .navigation .logo:hover span:nth-child(even){-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);opacity:1} +.header .navigation .logo:hover span{-webkit-transform:translateX(-153%);transform:translateX(-153%);opacity:0} +.header .navigation .logo:hover span:nth-child(even){-webkit-transform:translateX(-50%);transform:translateX(-50%);opacity:1} @media (max-width:480px){.header{width:44px;min-width:44px;z-index:21} .header .navigation .logo{font-size:28px;line-height:44px;height:44px} .header .navigation .logo:after{content:'CP'} @@ -515,9 +513,9 @@ input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#F .header .menu,.header .notification_menu,.header .search_form{position:absolute;z-index:21;bottom:6.67px;width:44px;height:44px} .header .menu .wrapper,.header .notification_menu .wrapper,.header .search_form .wrapper{min-width:170px} .header .menu>a,.header .notification_menu>a,.header .search_form>a{display:inline-block;height:100%;width:100%;text-align:center;line-height:44px;font-size:20px} -.header .notification_menu{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%)} +.header .notification_menu{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)} .header .notification_menu .button:before{font-size:20px;top:-2px} -.header .notification_menu .badge{position:absolute;color:#FFF;top:5px;right:0;background:#ac0000;-webkit-border-radius:50%;border-radius:50%;width:18px;height:18px;line-height:16px;text-align:center;font-size:10px;font-weight:lighter} +.header .notification_menu .badge{position:absolute;color:#FFF;top:5px;right:0;background:#ac0000;border-radius:50%;width:18px;height:18px;line-height:16px;text-align:center;font-size:10px;font-weight:lighter} .header .notification_menu .wrapper{width:320px} @media (max-width:480px){.header .notification_menu{bottom:50px} .header .notification_menu .wrapper{width:250px} @@ -531,28 +529,26 @@ input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#F .header .menu{left:6.67px} .header .menu .button:before{font-size:20px;top:-2px} .header .search_form{right:6.67px} -@media (max-width:480px){.header .menu{bottom:94px;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%)} -.header .search_form{right:auto;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%)} +@media (max-width:480px){.header .menu{bottom:94px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)} +.header .search_form{right:auto;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)} } .header .more_menu .wrapper{bottom:0;left:44px;right:auto;padding-left:4px} -.mask,.page{top:0;left:0} -.content{-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto;background:#FFF;-webkit-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px} +.content{-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto;background:#FFF;border-radius:3px 0 0 3px} .content h1,.content h2,.content h3{padding:0;margin:0} .content .pages{width:100%;position:relative} .content .footer{position:fixed;bottom:0;height:20px;width:100%} -.page{position:absolute;right:0;bottom:0;display:none;padding:20px 0;overflow:hidden;overflow-y:auto} +.page{position:absolute;top:0;left:0;right:0;bottom:0;display:none;padding:20px 0;overflow:hidden;overflow-y:auto} .page.home{padding:0 0 20px} .page.active{display:block} .page h1,.page h2,.page h3,.page h4{font-weight:300} -.messages,.table .head{font-weight:700} .page h2{font-size:24px;padding:20px} -.page .navigation{z-index:2;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;position:fixed;top:0;height:80px;left:152px;right:20px;background:#FFF;-webkit-border-radius:3px 0 0;border-radius:3px 0 0} +.page .navigation{z-index:2;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;position:fixed;top:0;height:80px;left:152px;right:20px;background:#FFF;border-radius:3px 0 0} .more_menu,.more_menu .button:before{position:relative} .more_menu .button,.page .navigation ul li{display:inline-block} @media (max-width:480px){.page h2{font-size:18px;padding:10px} .page .navigation{height:44px;left:64px} } -.page .navigation ul{-webkit-box-flex:1;-webkit-flex:1 auto;-moz-box-flex:1;-ms-flex:1 auto;flex:1 auto;list-style:none} +.page .navigation ul{-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto;list-style:none} .page .navigation ul li a{font-size:24px;line-height:80px;padding:20px;color:rgba(0,0,0,.5)} @media (max-width:480px){.page .navigation ul li a{font-size:18px;line-height:44px;padding:10px} } @@ -565,47 +561,47 @@ input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#F .level_4{z-index:40} .more_menu{line-height:1em} .more_menu .button{font-size:24px;cursor:pointer} -.more_menu .wrapper{display:none;position:absolute;right:0;background:#ac0000;z-index:5000;-webkit-box-shadow:0 0 15px 2px rgba(0,0,0,.15);box-shadow:0 0 15px 2px rgba(0,0,0,.15);-webkit-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px} -.more_menu .wrapper:before{-webkit-transform:rotate(45deg)translateY(-60%);-ms-transform:rotate(45deg)translateY(-60%);transform:rotate(45deg)translateY(-60%);content:'';display:block;position:absolute;background:#ac0000;height:10px;width:10px;left:-9px;bottom:11px;z-index:1;opacity:0;-webkit-border-radius:3px;border-radius:3px} +.more_menu .wrapper{display:none;position:absolute;right:0;background:#ac0000;z-index:5000;border-radius:3px 0 0 3px} +.more_menu .wrapper:before{-webkit-transform:rotate(45deg)translateY(-60%);transform:rotate(45deg)translateY(-60%);content:'';display:block;position:absolute;background:#ac0000;height:10px;width:10px;left:-9px;bottom:11px;z-index:1;opacity:0;border-radius:3px} .more_menu.show .wrapper:before,.question.show{opacity:1} .mask,.messages{right:0;bottom:0} -.more_menu .wrapper ul{-webkit-transform:translateZ(0);transform:translateZ(0);background:#FFF;position:relative;z-index:2;overflow:hidden;-webkit-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px} +.more_menu .wrapper ul{-webkit-transform:translateZ(0);transform:translateZ(0);background:#FFF;position:relative;z-index:2;overflow:hidden;border-radius:3px 0 0 3px} .more_menu .wrapper ul li{display:block;line-height:1em;border-top:1px solid #eaeaea} .more_menu .wrapper ul li:first-child{border-top:0} .more_menu .wrapper ul li a{display:block;color:#000;padding:5px 10px;font-size:1em;line-height:22px} .more_menu .wrapper ul li:first-child a{padding-top:10px} .more_menu .wrapper ul li:last-child a{padding-bottom:10px} .more_menu.show .wrapper{display:block} -.messages{position:fixed;width:320px;z-index:2000;overflow:hidden;font-size:14px;padding:5px} -.messages .message{overflow:hidden;-webkit-transition:all .6s cubic-bezier(.9,0,.1,1);transition:all .6s cubic-bezier(.9,0,.1,1);width:100%;position:relative;max-height:0;font-size:1.1em;font-weight:400;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:100% 50%;-ms-transform-origin:100% 50%;transform-origin:100% 50%;background:#ac0000;margin-bottom:4px;-webkit-border-radius:3px;border-radius:3px;-webkit-box-shadow:0 0 15px 2px rgba(0,0,0,.15);box-shadow:0 0 15px 2px rgba(0,0,0,.15)} -.messages .message .inner{padding:15px 30px 15px 20px;background:#FFF;margin-bottom:4px;-webkit-border-radius:3px;border-radius:3px} +.messages{position:fixed;width:320px;z-index:2000;overflow:hidden;font-size:14px;font-weight:700;padding:5px} +.messages .message{overflow:hidden;transition:all .6s cubic-bezier(.9,0,.1,1);width:100%;position:relative;max-height:0;font-size:1.1em;font-weight:400;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:100% 50%;transform-origin:100% 50%;background:#ac0000;margin-bottom:4px;border-radius:3px} +.messages .message .inner{padding:15px 30px 15px 20px;background:#FFF;margin-bottom:4px;border-radius:3px} .messages .message.sticky{background-color:#ac0000} -.messages .message.show{max-height:100px;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)} -.messages .message.hide{max-height:0;padding:0 20px;margin:0;transform:scale(0)} -.mask .spinner,.messages .message.hide{-webkit-transform:scale(0);-ms-transform:scale(0)} +.messages .message.show{max-height:100px;-webkit-transform:scale(1);transform:scale(1)} +.messages .message.hide{max-height:0;padding:0 20px;margin:0;-webkit-transform:scale(0);transform:scale(0)} .messages .close{position:absolute;padding:10px 8px;top:0;right:0;color:#FFF} -.question{position:fixed;z-index:20000;color:#FFF;padding:20px;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center} +.question{position:fixed;z-index:20000;color:#FFF;padding:20px;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center} .question .inner{width:100%;max-width:500px} .question h3{display:block;margin-bottom:20px;font-size:1.4em;font-weight:lighter} .question a{border-color:#FFF;color:#FFF} .question a:hover{background:#FFF;color:#ac0000} -.mask{background:rgba(0,0,0,.8);z-index:1000;text-align:center;position:absolute;opacity:0;-webkit-transition:opacity 1000ms;transition:opacity 1000ms} +.mask{background:rgba(0,0,0,.8);z-index:1000;text-align:center;position:absolute;top:0;left:0;opacity:0;transition:opacity 1000ms} .mask .message,.mask .spinner{position:absolute;top:50%;left:50%} .mask .message{color:#FFF;text-align:center;width:320px;margin:-49px 0 0 -160px;font-size:16px;opacity:.5} -.mask .spinner{width:22px;height:22px;display:block;background:#fff;margin-top:-11px;margin-left:-11px;outline:transparent solid 1px;-webkit-animation:rotating 2.5s cubic-bezier(.9,0,.1,1)infinite normal;animation:rotating 2.5s cubic-bezier(.9,0,.1,1)infinite normal;transform:scale(0)} -.page.settings.active,.table .item{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox} +.mask .spinner{width:22px;height:22px;display:block;background:#fff;margin-top:-11px;margin-left:-11px;outline:transparent solid 1px;-webkit-animation:rotating 2.5s cubic-bezier(.9,0,.1,1)infinite normal;animation:rotating 2.5s cubic-bezier(.9,0,.1,1)infinite normal;-webkit-transform:scale(0);transform:scale(0)} +.page.settings.active,.table .item{display:-webkit-flex;display:-ms-flexbox} .mask.show{pointer-events:auto;opacity:1} -.mask.show .spinner{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)} +.mask.show .spinner{-webkit-transform:scale(1);transform:scale(1)} .mask.hide{opacity:0} -.mask.hide .spinner{-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0)} -@-webkit-keyframes rotating{0%{-webkit-transform:rotate(0)scale(1.6);transform:rotate(0)scale(1.6);-webkit-border-radius:1px;border-radius:1px} -48%{-webkit-transform:rotate(360deg)scale(1);transform:rotate(360deg)scale(1);-webkit-border-radius:50%;border-radius:50%} -100%{-webkit-transform:rotate(720deg)scale(1.6);transform:rotate(720deg)scale(1.6);-webkit-border-radius:1px;border-radius:1px} +.mask.hide .spinner{-webkit-transform:scale(0);transform:scale(0)} +@-webkit-keyframes rotating{0%{-webkit-transform:rotate(0)scale(1.6);transform:rotate(0)scale(1.6);border-radius:1px} +48%{-webkit-transform:rotate(360deg)scale(1);transform:rotate(360deg)scale(1);border-radius:50%} +100%{-webkit-transform:rotate(720deg)scale(1.6);transform:rotate(720deg)scale(1.6);border-radius:1px} } -@keyframes rotating{0%{-webkit-transform:rotate(0)scale(1.6);transform:rotate(0)scale(1.6);-webkit-border-radius:1px;border-radius:1px} -48%{-webkit-transform:rotate(360deg)scale(1);transform:rotate(360deg)scale(1);-webkit-border-radius:50%;border-radius:50%} -100%{-webkit-transform:rotate(720deg)scale(1.6);transform:rotate(720deg)scale(1.6);-webkit-border-radius:1px;border-radius:1px} +@keyframes rotating{0%{-webkit-transform:rotate(0)scale(1.6);transform:rotate(0)scale(1.6);border-radius:1px} +48%{-webkit-transform:rotate(360deg)scale(1);transform:rotate(360deg)scale(1);border-radius:50%} +100%{-webkit-transform:rotate(720deg)scale(1.6);transform:rotate(720deg)scale(1.6);border-radius:1px} } +.table .head{font-weight:700} .table .item{display:flex;border-bottom:1px solid rgba(0,0,0,.2)} .table .item:last-child{border-bottom:none} .table .item span{padding:1px 2px} @@ -613,54 +609,61 @@ input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#F .table .item span:last-child{padding-right:0} .page.settings{top:80px} .page.settings.active{display:flex} -@media (max-width:480px){.page.settings.active{display:block} +@media (max-width:480px){.page.settings{top:44px} +.page.settings.active{display:block} } -.page.settings .navigation,.page.settings .navigation .advanced_toggle{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox} -.page.settings .navigation{display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between} -.page.settings .navigation .advanced_toggle{display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;margin-right:20px} +.page.settings .navigation{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between} +.page.settings .navigation .advanced_toggle{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center} .page.settings .navigation .advanced_toggle span{margin-right:10px} .page.settings .tab_content{display:none} .page.settings .tab_content.active{display:block} -.page.settings fieldset .ctrlHolder,.page.settings fieldset h2{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox} -.page.settings .tabs{margin:0 20px;list-style:none;font-size:24px} +.page.settings .tabs{margin:0 20px 20px;list-style:none;font-size:24px} .page.settings .tabs ul{list-style:none;font-size:initial} .page.settings .tabs li a{color:rgba(0,0,0,.5)} .page.settings .tabs li.active a{color:#000} -.page.settings form.containers{margin:0 20px 0 0;-webkit-box-flex:1;-webkit-flex:1 1 auto;-moz-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto} +.page.settings form.containers{margin:0 20px 0 0;-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto} .page.settings fieldset{border:0;margin-bottom:20px;position:relative} -.page.settings fieldset h2{display:flex;-webkit-box-align:baseline;-webkit-align-items:baseline;-moz-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;padding:20px 20px 10px} +.page.settings fieldset h2{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:baseline;-ms-flex-align:baseline;align-items:baseline;padding:0 0 10px 20px} .page.settings fieldset h2 .icon{margin-right:10px} .page.settings fieldset h2 .icon img{vertical-align:middle;position:relative;top:-1px} .page.settings fieldset h2 .hint{margin-left:10px;font-size:1rem} -.page.settings fieldset h2 .hint a{font-weight:400;color:#ac0000;text-decoration:underline} -.page.settings fieldset:first-child h2{padding-top:0} -.page.settings fieldset .ctrlHolder{padding:6.67px 20px;border-bottom:1px solid #eaeaea;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center} -@media (max-width:480px){.page.settings fieldset .ctrlHolder{-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap} +@media (max-width:480px){.page.settings fieldset h2{display:block} +.page.settings fieldset h2 .hint{margin:0;display:block} } +.page.settings fieldset h2 .hint a{font-weight:400;color:#ac0000;text-decoration:underline} +.page.settings fieldset .ctrlHolder{padding:6.67px 20px;border-bottom:1px solid #eaeaea;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-webkit-align-items:center;-ms-flex-align:center;align-items:center} .page.settings fieldset .ctrlHolder:last-child{border-bottom:0} .page.settings fieldset .ctrlHolder label{display:inline-block;min-width:150px} .page.settings fieldset .ctrlHolder input,.page.settings fieldset .ctrlHolder select,.page.settings fieldset .ctrlHolder textarea{min-width:200px} -.page.settings fieldset .ctrlHolder input[type=checkbox],.page.settings fieldset .ctrlHolder select[type=checkbox],.page.settings fieldset .ctrlHolder textarea[type=checkbox]{width:auto;min-width:0} -.page.settings fieldset .ctrlHolder .select_wrapper{position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center} +.page.settings fieldset .ctrlHolder input[type=checkbox]{width:auto;min-width:0} +@media (max-width:480px){.page.settings fieldset .ctrlHolder{-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;padding-right:0} +.page.settings fieldset .ctrlHolder input,.page.settings fieldset .ctrlHolder label,.page.settings fieldset .ctrlHolder select,.page.settings fieldset .ctrlHolder textarea{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto} +.page.settings fieldset .ctrlHolder input[type=checkbox]{margin-right:20px;-webkit-flex:none;-ms-flex:none;flex:none} +} +.page.settings fieldset .ctrlHolder .select_wrapper{position:relative;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center} .page.settings fieldset .ctrlHolder .select_wrapper select{cursor:pointer;-moz-appearance:none} .page.settings fieldset .ctrlHolder .select_wrapper:before{pointer-events:none;position:absolute;right:10px;height:100%;line-height:0;margin-top:-3px} .page.settings fieldset .ctrlHolder .formHint{opacity:.8;margin-left:20px} .page.settings fieldset .ctrlHolder .formHint a{font-weight:400;color:#ac0000;text-decoration:underline} -@media (max-width:480px){.page.settings fieldset .ctrlHolder .formHint{min-width:100%;margin-left:0} +@media (max-width:480px){.page.settings fieldset .ctrlHolder .select_wrapper{width:100%} +.page.settings fieldset .ctrlHolder .formHint{min-width:100%;margin-left:0} } .page.settings fieldset .ctrlHolder.test_button a{margin:0} .page.settings fieldset .ctrlHolder.test_button .success{margin-left:10px} .page.settings fieldset.disabled .ctrlHolder{display:none} -.page.settings fieldset.disabled>.ctrlHolder:first-child,.page.settings fieldset.enabler{display:block} -.page.settings fieldset.enabler>:first-child{position:absolute;right:0;top:0;border:0;padding:0} +.page.settings fieldset.disabled>.ctrlHolder:first-child{display:-webkit-flex;display:-ms-flexbox;display:flex} +.page.settings fieldset.enabler{display:block} +.page.settings fieldset.enabler>:first-child{position:absolute;right:0;border:0;padding:0;height:46px} .page.settings fieldset.enabler>:first-child~h2{margin-right:86px} +@media (max-width:480px){.page.settings fieldset.enabler>:first-child~h2{margin-right:0} +} .page.settings fieldset .ctrlHolder.advanced,.page.settings fieldset.advanced{display:none;color:#ac0000} -.page.settings.show_advanced fieldset.advanced,.page.settings.show_advanced fieldset:not(.disabled)>.ctrlHolder.advanced{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex} -.page.settings .switch{display:inline-block;background:#ac0000;border:1px solid #ac0000;-webkit-box-shadow:inset 0 0 0 1px #FFF;box-shadow:inset 0 0 0 1px #FFF;height:22px;width:66px;min-width:0!important;padding:2px;-webkit-transition:all 250ms;transition:all 250ms;cursor:pointer;-webkit-border-radius:3px;border-radius:3px} +.page.settings.show_advanced fieldset.advanced,.page.settings.show_advanced fieldset:not(.disabled)>.ctrlHolder.advanced{display:-webkit-flex;display:-ms-flexbox;display:flex} +.page.settings .switch{display:inline-block;background:#ac0000;border:1px solid #ac0000;box-shadow:inset 0 0 0 1px #FFF;height:22px;width:66px;min-width:0!important;padding:2px;transition:all 250ms;cursor:pointer;border-radius:3px} .page.settings .switch input{display:none} -.page.settings .switch .toggle{background:#FFF;height:100%;width:40%;-webkit-transition:-webkit-transform 250ms;transition:transform 250ms;-webkit-transform:translateX(150%);-ms-transform:translateX(150%);transform:translateX(150%);-webkit-border-radius:2px;border-radius:2px} +.page.settings .switch .toggle{background:#FFF;height:100%;width:40%;transition:-webkit-transform 250ms;transition:transform 250ms;-webkit-transform:translateX(150%);transform:translateX(150%);border-radius:2px} .page.settings fieldset.enabler.disabled .switch,.page.settings:not(.show_advanced) .advanced_toggle .switch{background:#eaeaea;border-color:#eaeaea} -.page.settings fieldset.enabler.disabled .switch .toggle,.page.settings:not(.show_advanced) .advanced_toggle .switch .toggle{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)} +.page.settings fieldset.enabler.disabled .switch .toggle,.page.settings:not(.show_advanced) .advanced_toggle .switch .toggle{-webkit-transform:translateX(0);transform:translateX(0)} .page.settings fieldset.enabler.disabled .switch:hover,.page.settings:not(.show_advanced) .advanced_toggle .switch:hover{background:#b7b7b7;border-color:#b7b7b7} .page.settings .option_list{background:#FFF} .page.settings .option_list fieldset{position:relative} @@ -703,9 +706,12 @@ input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#F .page.settings .group_userscript .bookmarklet{display:block;float:left;padding:20px 15px 0 20px} .page.settings .group_userscript .bookmarklet span{margin-left:10px;display:inline-block} .page.settings .group_userscript img{display:block;clear:both;float:left;margin:20px;width:100%;max-width:680px} -.page.settings .directory_list{z-index:2;position:absolute;width:450px;margin:28px 0 20px;background:#ac0000;-webkit-box-shadow:0 0 15px 2px rgba(0,0,0,.15);box-shadow:0 0 15px 2px rgba(0,0,0,.15);-webkit-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0} +@media (max-width:480px){.page.settings .directory{width:100%} +} +.page.settings .directory input{width:100%} +.page.settings .directory_list{z-index:2;position:absolute;width:450px;margin:28px 0 20px;background:#ac0000;box-shadow:0 0 15px 2px rgba(0,0,0,.15);border-radius:3px 3px 0 0} .page.settings .directory_list .pointer{border-right:6px solid transparent;border-left:6px solid transparent;border-bottom:6px solid #ac0000;display:block;position:absolute;width:0;margin:-6px 0 0 100px} -.page.settings .directory_list .wrapper{background:#FFF;-webkit-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;margin-top:5px} +.page.settings .directory_list .wrapper{background:#FFF;border-radius:3px 3px 0 0;margin-top:5px} .page.settings .directory_list ul{width:92%;height:300px;overflow:auto;margin:0 20px} .page.settings .directory_list li{padding:4px 20px 4px 0;cursor:pointer;margin:0!important;border-top:1px solid rgba(255,255,255,.1);overflow:hidden;white-space:nowrap;text-overflow:ellipsis} .page.settings .directory_list li.blur{opacity:.3} @@ -718,14 +724,14 @@ input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#F .page.settings .directory_list .actions .back{font-weight:700;width:160px;display:inline-block;padding:0;line-height:120%;vertical-align:top;position:absolute;text-align:left;left:20px} .page.settings .directory_list .actions:last-child{padding:20px} .page.settings .directory_list .actions:last-child>span{padding:0 5px;text-shadow:none} -.page.settings .directory_list .actions:last-child>.clear{left:20px;position:absolute;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);margin:0} +.page.settings .directory_list .actions:last-child>.clear{left:20px;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);margin:0} .page.settings .directory_list .actions:last-child>.cancel{color:rgba(0,0,0,.4)} .page.settings .directory_list .actions:last-child>.save{margin-right:0} .uniForm legend{font-weight:700;font-size:100%;margin:0;padding:1.5em 0} .uniForm .ctrlHolder{padding:1em;border-bottom:1px solid #efefef} .uniForm .ctrlHolder.focused{background:#fffcdf} -.uniForm .buttonHolder{background:#efefef;text-align:right;margin:1.5em 0 0;padding:1.5em;-webkit-border-radius:4px;border-radius:4px} -.uniForm .buttonHolder .primaryAction{padding:10px 22px;line-height:1;background:#254a86;border:1px solid #163362;font-size:12px;font-weight:700;color:#fff;-webkit-border-radius:4px;border-radius:4px;-webkit-box-shadow:1px 1px 0 #fff;box-shadow:1px 1px 0 #fff;text-shadow:-1px -1px 0 rgba(0,0,0,.25)} +.uniForm .buttonHolder{background:#efefef;text-align:right;margin:1.5em 0 0;padding:1.5em;border-radius:4px} +.uniForm .buttonHolder .primaryAction{padding:10px 22px;line-height:1;background:#254a86;border:1px solid #163362;font-size:12px;font-weight:700;color:#fff;border-radius:4px;box-shadow:1px 1px 0 #fff;text-shadow:-1px -1px 0 rgba(0,0,0,.25)} .uniForm .buttonHolder .primaryAction:active{position:relative;top:1px} .uniForm .secondaryAction{text-align:left} .uniForm button.secondaryAction{background:0 0;border:none;color:#777;margin:1.25em 0 0;padding:0} diff --git a/couchpotato/static/style/settings.scss b/couchpotato/static/style/settings.scss index 3b5624f..8e9cb64 100644 --- a/couchpotato/static/style/settings.scss +++ b/couchpotato/static/style/settings.scss @@ -2,7 +2,11 @@ .page.settings { top: $header_height; - + + @include media-phablet { + top: $header_width_mobile; + } + &.active { display: flex; @@ -18,7 +22,6 @@ .advanced_toggle { display: flex; align-items: center; - margin-right: $padding; span { margin-right: $padding / 2; @@ -35,7 +38,7 @@ } .tabs { - margin: 0 $padding; + margin: 0 $padding $padding; list-style: none; font-size: 24px; @@ -71,7 +74,11 @@ h2 { display: flex; align-items: baseline; - padding: $padding $padding $padding/2; + padding: 0 0 $padding/2 $padding; + + @include media-phablet { + display: block; + } .icon { margin-right: $padding/2; @@ -87,6 +94,11 @@ margin-left: $padding/2; font-size: 1rem; + @include media-phablet { + margin: 0; + display: block; + } + a { font-weight: 400; color: $primary_color; @@ -95,12 +107,6 @@ } } - &:first-child { - h2 { - padding-top: 0; - } - } - .ctrlHolder { padding: $padding/3 $padding; border-bottom: 1px solid $theme_off; @@ -110,6 +116,7 @@ @include media-phablet { flex-flow: row wrap; + padding-right: 0; } &:last-child { @@ -119,14 +126,27 @@ label { display: inline-block; min-width: 150px; + + @include media-phablet { + flex: 1 1 auto; + } } input, textarea, select { min-width: 200px; - &[type=checkbox] { - width: auto; - min-width: 0; + @include media-phablet { + flex: 1 1 auto; + } + } + + input[type=checkbox] { + width: auto; + min-width: 0; + + @include media-phablet { + margin-right: $padding; + flex: none; } } @@ -135,6 +155,10 @@ display: flex; align-items: center; + @include media-phablet { + width: 100%; + } + select { cursor: pointer; -moz-appearance: none; @@ -184,7 +208,7 @@ } > .ctrlHolder:first-child { - display: block; + display: flex; } } @@ -194,12 +218,16 @@ > :first-child { position: absolute; right: 0; - top: 0; border: 0; padding: 0; + height: 46px; ~ h2 { margin-right: 66px + $padding; + + @include media-phablet { + margin-right: 0; + } } } } @@ -275,6 +303,7 @@ .group_label { min-width: 100px; } + } &.disabled h2 { @@ -489,6 +518,17 @@ } } + .directory { + + @include media-phablet { + width: 100%; + } + + input { + width: 100%; + } + } + .directory_list { z-index: 2; @@ -569,7 +609,7 @@ float: right; width: auto; padding: 0; - + input { margin-left: $padding/2; } @@ -614,4 +654,4 @@ } } -} \ No newline at end of file +}