homebridge-camera-ui
Version:
User Interface for RTSP capable cameras.
1 lines • 20.3 kB
CSS
.refresh-button[data-v-35a9a33e]{border:1px solid rgb(255 255 255/23%);border-radius:5px;margin-left:20px;color:#fff;padding:5px 10px}.Vue-Toastification__container.top-center{margin-top:calc(env(safe-area-inset-top, -10px) + 10px);border-radius:16px}.Vue-Toastification__toast--info.notification-toast{background-color:var(--trans-bg-color);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);color:var(--primary-font-color);border-radius:16px;padding:16px}.notification,.notification:hover{position:relative;overflow:hidden;color:var(--primary-font-color);text-decoration:none}.notification .more,.notification header{opacity:.75}.notification header{display:flex;justify-content:space-between;padding-bottom:8px;font-size:12px}.notification header h2{text-transform:uppercase;font-size:12px}.notification header .timestamp{text-transform:lowercase}.notification .content span{display:block;line-height:1.4}.notification .content .message{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.notification .content .event,.notification .content .sender{font-weight:600}.notification .content .more{margin-top:4px;font-size:12px}.notification .after,.notification .before{left:calc(50% - 50vw)}.fade-enter-active,.fade-leave-active{transition-duration:.3s;transition-property:opacity;transition-timing-function:ease}.fade-enter,.fade-leave-active{opacity:0}.footer-offset{margin-bottom:calc(env(safe-area-inset-bottom, -100px) + 100px)}.offline-icon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:30px;color:#c4c4c4}.Vue-Toastification__toast{margin-bottom:calc(env(safe-area-inset-top, -5px) + 5px)}.page-link{color:var(--primary-color)}.page-item.active .page-link{z-index:0;color:#fff;background-color:var(--primary-color);border-color:var(--secondary-color)}.page-link:hover{color:var(--primary-color)}.page-link:focus{box-shadow:none}.infinite-status-prompt{color:var(--secondary-font-color)}@media only screen and (max-width:600px){.Vue-Toastification__container .Vue-Toastification__toast{width:80%;margin:0 auto;margin-bottom:env(safe-area-inset-bottom)}}:root{--primary-color:#d12049;--secondary-color:#7d132c;--third-color:#3f0a16;--fourth-color:#eda6b6;--fifth-color:#ff6868;--six-color:#22030a;--primary-trans-color-1:rgba(209,32,73,0.75);--primary-trans-color-2:rgba(209,32,73,0.5);--primary-trans-color-3:rgba(209,32,73,0.25);--primary-trans-color-4:rgba(209,32,73,0.1);--primary-font-color:#000;--secondary-font-color:#c8c8c8;--third-font-color:#f4f4f4;--fourth-font-color:#fff;--primary-bg-color:#f4f4f4;--secondary-bg-color:#fff;--third-bg-color:#dbdbdb;--fourth-bg-color:#a2a2a2;--trans-bg-color:hsla(0,0%,100%,0.8);--trans-font-color:rgba(0,0,0,0.5);--trans-border-color:rgba(0,0,0,0.15)}[data-theme=dark]{--primary-font-color:#fff;--secondary-font-color:#6c6c6c;--third-font-color:#878787;--fourth-font-color:#bdbdbd;--primary-bg-color:#000;--secondary-bg-color:#2a2a2a;--third-bg-color:#404040;--fourth-bg-color:#676767;--trans-bg-color:rgba(29,29,29,0.8);--trans-font-color:hsla(0,0%,100%,0.5);--trans-border-color:hsla(0,0%,50.2%,0.05)}[data-theme-color=blgray]{--primary-color:#607d8b;--secondary-color:#40555f;--third-color:#33444d;--fourth-color:#9dc2d4;--fifth-color:#89cef0;--six-color:#1d262b;--primary-trans-color-1:rgba(96,125,139,0.75);--primary-trans-color-2:rgba(96,125,139,0.5);--primary-trans-color-3:rgba(96,125,139,0.25);--primary-trans-color-4:rgba(96,125,139,0.1)}[data-theme-color=blue]{--primary-color:#0a84ff;--secondary-color:#064f99;--third-color:#03284d;--fourth-color:#9dceff;--fifth-color:#0bdafb;--six-color:#001429;--primary-trans-color-1:rgba(10,132,255,0.75);--primary-trans-color-2:rgba(10,132,255,0.5);--primary-trans-color-3:rgba(10,132,255,0.25);--primary-trans-color-4:rgba(10,132,255,0.1)}[data-theme-color=brown]{--primary-color:#795548;--secondary-color:#52382e;--third-color:#3f2920;--fourth-color:#dfab99;--fifth-color:#f89c7b;--six-color:#2c1d18;--primary-trans-color-1:rgba(121,85,72,0.75);--primary-trans-color-2:rgba(121,85,72,0.5);--primary-trans-color-3:rgba(121,85,72,0.25);--primary-trans-color-4:rgba(121,85,72,0.1)}[data-theme-color=gray]{--primary-color:#626365;--secondary-color:#3b3b3d;--third-color:#1d1e1e;--fourth-color:#c0c1c1;--fifth-color:#969696;--six-color:#0a0a0a;--primary-trans-color-1:rgba(98,99,101,0.75);--primary-trans-color-2:rgba(98,99,101,0.5);--primary-trans-color-3:rgba(98,99,101,0.25);--primary-trans-color-4:rgba(98,99,101,0.1)}[data-theme-color=green]{--primary-color:#66ce66;--secondary-color:#3d7c3d;--third-color:#1f3e1f;--fourth-color:#c2ebc2;--fifth-color:#b7ff67;--six-color:#0e1b0e;--primary-trans-color-1:rgba(102,206,102,0.75);--primary-trans-color-2:rgba(102,206,102,0.5);--primary-trans-color-3:rgba(102,206,102,0.25);--primary-trans-color-4:rgba(102,206,102,0.1)}[data-theme-color=orange]{--primary-color:#ff9500;--secondary-color:#bd6e00;--third-color:#7e4900;--fourth-color:#ffe2b9;--fifth-color:#ffd000;--six-color:#3a2200;--primary-trans-color-1:rgba(255,149,0,0.75);--primary-trans-color-2:rgba(255,149,0,0.5);--primary-trans-color-3:rgba(255,149,0,0.25);--primary-trans-color-4:rgba(255,149,0,0.1)}[data-theme-color=purple]{--primary-color:#7c48c2;--secondary-color:#6037b9;--third-color:#3d1e7e;--fourth-color:#c9a9f3;--fifth-color:#a865ff;--six-color:#2f1666;--primary-trans-color-1:rgba(124,72,194,0.75);--primary-trans-color-2:rgba(124,72,194,0.5);--primary-trans-color-3:rgba(124,72,194,0.25);--primary-trans-color-4:rgba(124,72,194,0.1)}#preloader{position:fixed;top:0;left:0;right:0;bottom:0;z-index:333;overflow:hidden;background:var(--primary-bg-color)}#preloader:before{content:"";display:block;position:fixed;top:calc(50% - 24px);left:calc(50% - 24px);transform:translate(-50%,-50%);border:6px solid var(--primary-color);border-top-color:var(--primary-bg-color);border-bottom-color:var(--primary-bg-color);border-radius:50%;box-sizing:unset;width:48px;height:48px;-webkit-animation:animate-preloader 1s linear infinite;animation:animate-preloader 1s linear infinite}@-webkit-keyframes animate-preloader{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes animate-preloader{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.preloader-hide{opacity:0;-webkit-animation:fadeout .3s linear;animation:fadeout .3s linear}@-webkit-keyframes fadeout{0%{opacity:1}to{opacity:0}}@keyframes fadeout{0%{opacity:1}to{opacity:0}}body,html{width:100%;background:var(--primary-bg-color);font-family:trebuchet ms,sans-serif;color:var(--primary-font-color);-ms-scroll-chaining:none;overscroll-behavior:none;-webkit-overflow-scrolling:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}.cool-lightbox-toolbar{top:env(safe-area-inset-top);right:50%;transform:translateX(50%)}.multiselect--active{z-index:10}.no-radius{border-radius:0}.no-radius-top{border-top-right-radius:0;border-top-left-radius:0}.no-radius-bottom{border-bottom-right-radius:0;border-bottom-left-radius:0}.popover{background:var(--third-bg-color);box-shadow:0 4px 6px rgb(50 50 93/11%),0 1px 3px rgb(0 0 0/20%)}.popover .arrow:after{border-top-color:var(--third-bg-color);border-bottom-color:var(--third-bg-color)}.popover-body{color:var(--primary-font-color)}.body-bg-dark{position:relative;overflow:hidden visible;height:100vh;background:#191919}.bg-transparent{background:transparent;transition:all .3s}.bg-color-primary{background-color:var(--primary-color)}.text-color-danger{color:#ff3b30;transition:all .3s}.text-color-danger:hover{color:#ad0c03}.text-color-primary{color:var(--primary-color);transition:all .3s}.text-color-primary:hover{color:var(--secondary-color)}.cursor-pointer{cursor:pointer}.position-absolute-fullsize{position:absolute;top:0;left:0;right:0;bottom:0}.position-absolute-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%)}.position-absolute-x-center{position:absolute;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%)}.position-absolute-y-center{position:absolute;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%)}.object-fit-cover{-o-object-fit:cover;object-fit:cover}.object-fit-none{-o-object-fit:none;object-fit:none}.hide-opacity{opacity:0;transition:all .3s}.show-opacity{opacity:1;transition:all .3s}.border-bottom-shadow-danger{border-bottom:3px solid #8c1e20}.border-bottom-shadow-primary{border-bottom:3px solid var(--third-color)}.border-bottom-shadow-success{border-bottom:3px solid #137d1d}.close,.close:hover{color:var(--primary-font-color);text-shadow:0 1px 0 var(--primary-bg-color)}a{text-decoration:none;background-color:transparent}a:focus{outline:none}a:hover{text-decoration:none;color:var(--secondary-color)}:focus{outline:none}.custom-select,.input-checkbox,input.text,input[type=button],input[type=password],input[type=submit],input[type=text],select,textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none}input:-webkit-autofill,input:-webkit-autofill:focus,input:-webkit-autofill:hover,select:-webkit-autofill,select:-webkit-autofill:focus,select:-webkit-autofill:hover,textarea:-webkit-autofill,textarea:-webkit-autofill:focus,textarea:-webkit-autofill:hover{color:var(--primary-font-color);outline:none;border:0;background:transparent;-webkit-text-fill-color:var(--primary-font-color);box-shadow:none;-webkit-box-shadow:none;-webkit-transition:background-color 5000s ease-in-out 0s;transition:background-color 5000s ease-in-out 0s}.custom-file-input,.custom-file-input:focus,input.custom-file-input,input:focus.custom-file-input{color:var(--primary-font-color);outline:none;border:1px solid var(--trans-border-color);border-color:var(--trans-border-color);background:transparent;-webkit-text-fill-color:var(--primary-font-color);box-shadow:var(--trans-font-color);-webkit-box-shadow:var(--trans-font-color);transition:background-color 5000s ease-in-out 0s}.custom-file-label{box-shadow:var(--trans-font-color)}.custom-file-input~.custom-file-label:after{color:#000}input,textarea{outline:none;border:none}input:focus,textarea:focus{border-color:var(--third-bg-color)}.custom-select:-moz-placeholder,.custom-select:-ms-input-placeholder,.custom-select::-moz-placeholder,.custom-select::-webkit-input-placeholder,.custom-select::placeholder,.custom-select:focus:-moz-placeholder,.custom-select:focus:-ms-input-placeholder,.custom-select:focus::-moz-placeholder,.custom-select:focus::-webkit-input-placeholder,.form-control:-moz-placeholder,.form-control:-ms-input-placeholder,.form-control::-moz-placeholder,.form-control::-webkit-input-placeholder,.form-control::placeholder,.form-control:focus:-moz-placeholder,.form-control:focus:-ms-input-placeholder,.form-control:focus::-moz-placeholder,.form-control:focus::-webkit-input-placeholder,input:-moz-placeholder,input:-ms-input-placeholder,input::-moz-placeholder,input::-webkit-input-placeholder,input::placeholder,input:focus:-moz-placeholder,input:focus:-ms-input-placeholder,input:focus::-moz-placeholder,input:focus::-webkit-input-placeholder,textarea:-moz-placeholder,textarea:-ms-input-placeholder,textarea::-moz-placeholder,textarea::-webkit-input-placeholder,textarea::placeholder,textarea:focus:-moz-placeholder,textarea:focus:-ms-input-placeholder,textarea:focus::-moz-placeholder,textarea:focus::-webkit-input-placeholder{color:#737373}.text-muted{color:#737373}.modal-content{background:var(--secondary-bg-color);color:var(--primary-font-color);box-shadow:0 0 2rem 0 rgba(0,0,0,.4)}.modal-header{border-bottom:1px solid var(--third-bg-color)}.modal-footer{border-top:1px solid var(--third-bg-color)}.custom-select,.multiselect{color:var(--primary-font-color)}.multiselect__tag{border-radius:6px;background:var(--primary-color)}.multiselect__tag-icon:after{color:var(--secondary-color)}.multiselect__tag-icon:focus,.multiselect__tag-icon:hover{background:var(--third-color)}.multiselect__tags{border:1px solid var(--third-bg-color)}.multiselect__option--group{background:var(--third-bg-color);color:var(--primary-font-color)}.multiselect__option--highlight{background:var(--primary-color)}.form-control{color:var(--primary-font-color)}.custom-select,.form-control,.multiselect__tags{border:1px solid var(--third-bg-color);background:var(--secondary-bg-color)}.multiselect__input,.multiselect__single{background:transparent}.multiselect__content-wrapper{background:var(--secondary-bg-color);border-color:var(--third-bg-color)}.multiselect__option--selected{color:var(--primary-color);background:var(--secondary-bg-color)}.vue-js-switch .v-switch-core{background:var(--third-bg-color)}.custom-select:focus,.form-control:focus,.uneditable-input:focus,select:focus,textarea:focus{border:1px solid var(--third-bg-color);box-shadow:0 0 0 0 rgba(209,32,73,.3);outline:0 none;color:var(--primary-font-color)}.custom-select>option{padding:2px;margin:2px;border-radius:3px}.custom-select:focus>option:checked,.custom-select:focus>option:focus,.custom-select:focus>option:hover{background:var(--primary-color);box-shadow:0 0 10px 100px var(--primary-color) inset;color:#fff}select>option:checked{color:#fff}button{outline:none;border:none;background:transparent}button:hover{cursor:pointer}iframe{border:none}.justify-content-center{align-items:center;-webkit-align-items:center}.overflow-hidden-fixed{position:relative;overflow:hidden;height:100vh}.pt-save-s{padding-top:calc(env(safe-area-inset-top, -5px) + 5px)}.pt-save-m{padding-top:calc(env(safe-area-inset-top, -17px) + 17px)}.pt-save-l{padding-top:calc(env(safe-area-inset-top, -34px) + 34px)}.pt-save{padding-top:env(safe-area-inset-top)}.pb-save{padding-bottom:env(safe-area-inset-bottom)}.pl-save{padding-left:env(safe-area-inset-left)}.pr-save{padding-bottom:env(safe-area-inset-right)}.mt-save-s{margin-top:calc(env(safe-area-inset-top, -5px) + 5px)}.mt-save-m{margin-top:calc(env(safe-area-inset-top, -17px) + 17px)}.mt-save-l{margin-top:calc(env(safe-area-inset-top, -34px) + 34px)}.mt-save{margin-top:env(safe-area-inset-top)}.mb-save-s{margin-bottom:calc(env(safe-area-inset-top, -5px) + 5px)}.mb-save-m{margin-bottom:calc(env(safe-area-inset-top, -17px) + 17px)}.mb-save-l{margin-bottom:calc(env(safe-area-inset-top, -34px) + 34px)}.mb-save{margin-bottom:env(safe-area-inset-bottom)}.ml-save{margin-left:env(safe-area-inset-left)}.mr-save{margin-right:env(safe-area-inset-right)}.h-0{height:0}.h-10{height:10%}.h-20{height:20%}.h-30{height:30%}.h-40{height:40%}.h-46{height:46%}.h-50{height:50%}.h-60{height:60%}.h-70{height:70%}.h-80{height:80%}.h-90{height:90%}.h-100vh{min-height:100vh}.h-100vh-calc{min-height:calc(100vh - 146px)}.h-100vh-calc-filter{min-height:calc(100vh - 176px)}.h-100vh-calc-settings{min-height:calc(100vh - 196px)}.w-0{width:0}.w-10{width:10%}.w-20{width:20%}.w-30{width:30%}.w-40{width:40%}.w-46{width:46%}.w-50{width:50%}.w-60{width:60%}.w-70{width:70%}.w-80{width:80%}.w-90{width:90%}.lh-1{line-height:1}.lh-1-1{line-height:1.1}.lh-1-2{line-height:1.2}.lh-1-3{line-height:1.3}.lh-1-4{line-height:1.4}.lh-1-5{line-height:1.5}.lh-1-6{line-height:1.6}.lh-1-7{line-height:1.7}.lh-1-8{line-height:1.8}.lh-1-9{line-height:1.9}.lh-2{line-height:2}.z-index-1{z-index:1}.z-index-2{z-index:2}.z-index-3{z-index:3}.z-index-4{z-index:4}.z-index-5{z-index:5}.z-index-6{z-index:6}.z-index-7{z-index:7}.z-index-8{z-index:8}.z-index-9{z-index:9}.z-index-10{z-index:10}.z-index--1{z-index:-1}.z-index-999{z-index:999}.btn{border:none;box-shadow:none}.btn,.btn-primary{font-size:14px}.btn-primary{background-color:var(--primary-color)}.btn-primary:hover{color:var(--primary-font-color)}.btn-primary:active,.btn-primary:active:focus,.btn-primary:focus,.btn-primary:hover{background-color:var(--secondary-color)}.btn-danger{background-color:#ff3b30;font-size:14px}.btn-danger:hover{color:var(--primary-font-color)}.btn-danger:active,.btn-danger:active:focus,.btn-danger:focus,.btn-danger:hover{background-color:#ad0c03}.btn-dark{background-color:#dbdbdb;color:#fff;border:none;font-size:14px}.fs-1{font-size:calc(1.375rem + 1.5vw)}.fs-2{font-size:calc(1.325rem + .9vw)}.fs-3{font-size:calc(1.3rem + .6vw)}.fs-4{font-size:calc(1.275rem + .3vw)}.fs-5{font-size:1.25rem}.fs-6{font-size:1rem}.fs-7{font-size:.8rem}.lds-ring{display:inline-block;position:absolute;width:50px;height:50px;left:50%;top:50%;transform:translate(-50%,-50%);z-index:20}.lds-ring div{box-sizing:border-box;display:block;position:absolute;width:34px;height:34px;margin:8px;border:8px solid var(--primary-color);border-radius:50%;-webkit-animation:lds-ring 1.2s cubic-bezier(.5,0,.5,1) infinite;animation:lds-ring 1.2s cubic-bezier(.5,0,.5,1) infinite;border-color:var(--primary-color) transparent transparent transparent}.lds-ring div:first-child{-webkit-animation-delay:-.45s;animation-delay:-.45s}.lds-ring div:nth-child(2){-webkit-animation-delay:-.3s;animation-delay:-.3s}.lds-ring div:nth-child(3){-webkit-animation-delay:-.15s;animation-delay:-.15s}@-webkit-keyframes lds-ring{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes lds-ring{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.add-button{position:fixed;bottom:50px;left:50%;transform:translateX(-50%);background:var(--primary-color);padding:10px;border-radius:10px;color:#fff;z-index:1}.pulse{box-shadow:0 0 0 var(--primary-trans-color-2);-webkit-animation:pulse 2s infinite;animation:pulse 2s infinite}@-webkit-keyframes pulse{0%{-webkit-box-shadow:0 0 0 0 var(--primary-trans-color-2)}70%{-webkit-box-shadow:0 0 0 10px transparent}to{-webkit-box-shadow:0 0 0 0 transparent}}@keyframes pulse{0%{box-shadow:0 0 0 0 var(--primary-trans-color-2)}70%{box-shadow:0 0 0 10px transparent}to{box-shadow:0 0 0 0 transparent}}.modal-bottom{position:fixed;bottom:0;left:0;right:0;width:100%;margin:0 auto;padding:0}.modal.fade .modal-dialog.modal-bottom{transition:transform .3s ease-out;transform:translateY(150px)}.modal.show .modal-dialog.modal-bottom{transform:none}.modal-bottom>.modal-content{border-bottom-left-radius:0;border-bottom-right-radius:0}.modal-bottom>.modal-content>.modal-body{max-height:35vh;min-height:170px;overflow-y:scroll;scrollbar-width:none;-ms-overflow-style:none;overflow-x:hidden}.modal-bottom>.modal-content>.modal-body::-webkit-scrollbar{display:none;width:0;height:0;-webkit-appearance:none}