1 line
18 KiB
CSS
1 line
18 KiB
CSS
@font-face{font-family:Lato;src:url(../fonts/Lato-Medium.woff2) format("woff2");font-weight:500;font-display:swap;font-style:normal}@font-face{font-family:Lato;src:url(../fonts/Lato-Regular.woff2) format("woff2");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Lato;src:url(../fonts/Lato-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap;font-style:normal}:root{--default-font:normal 400 16px/16px "Lato",sans-serif;--color-white:#ffffff;--color-black:#333333;--color-primary:#4CAF50;--color-primary-hover:#A9E7AB;--color-grey:#666666;--color-light-grey:#DEDEDE}*,::after,::before{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}button{background:rgba(0,0,0,0);border:none;outline:0;cursor:pointer}a{color:#000;font-family:inherit;text-decoration:none}ol,ul{list-style:none}.row{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:5px}.container{width:100%;height:100%;padding:30px 30px 150px 30px}.app{width:100vw;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;overflow:hidden;background-color:#fff}.app-title{font-size:32px;font-weight:400;color:#000;margin-bottom:50px}.app-filters{margin-bottom:50px}#app_telofony .input{width:100%;height:37px;border-radius:6px;border:1px solid #dedede;background-color:#fff;padding:10px 16px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#app_telofony .sp-input{width:230px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;gap:20px}#app_telofony .sp-input__label{color:var(--color-black);leading-trim:both;text-edge:cap;font-size:15px;font-weight:600}#app_telofony .sp-radio-input-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:space-evenly;-ms-flex-pack:space-evenly;justify-content:space-evenly;height:150px}#app_telofony .sp-duration-container{padding:10px 16px}#app_telofony .sp-duration-container .sp-duration-inputs-container{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}#app_telofony .sp-duration-container .sp-duration-radio-container{width:137px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around;margin:0 auto;margin-top:10px}#app_telofony .sp-duration-container .sp-duration-radio-container .sp-input-radio{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#app_telofony .sp-duration-container .sp-duration-radio-container .sp-input-radio input{width:24px;height:24px;border-radius:50%;outline:0;border:1px solid #757575;margin:0}#app_telofony .sp-duration-container .sp-duration-radio-container .sp-input-radio input:checked{border:6px solid #4caf50;-webkit-appearance:none}#app_telofony .sp-duration-container .sp-duration-radio-container .sp-input-radio label{margin:0;margin-left:5px;color:#000;font-weight:400}#app_telofony .sp-duration-container .sp-input{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:-webkit-max-content;width:-moz-max-content;width:max-content;gap:10px}#app_telofony .sp-duration-container .sp-input__label{color:#9e9e9e}#app_telofony .sp-duration-container .sp-input__field{width:60px;padding:5px;text-align:center}.dropdown{position:relative;width:100%;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;gap:20px}.dropdown--openList .dropdown__input{border-radius:6px 6px 0 0}.dropdown--listTop.dropdown--openList .dropdown__input{border-radius:0 0 6px 6px}.dropdown__label{font-size:15px;font-style:normal;font-weight:500;color:#333;leading-trim:both;text-edge:cap}.dropdown__input{z-index:3;cursor:pointer}.dropdown__input-icon{width:16px;height:16px;margin-left:auto}.dropdown__input input{border:none;background-color:rgba(0,0,0,0);outline:0}.dropdown__list{position:absolute;top:100%;left:0;right:0;width:-webkit-max-content;width:-moz-max-content;width:max-content;min-width:100%;height:auto;border-radius:0 0 6px 6px;border:1px solid var(--color-light-grey);background:var(--color-white);opacity:0;visibility:hidden;-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out;z-index:4;max-height:250px;overflow:auto}.dropdown__list--top{bottom:calc(100% - 1px);top:auto;-webkit-transform:translateY(30px);-ms-transform:translateY(30px);transform:translateY(30px);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out;border-radius:6px 6px 0 0}.dropdown__list--open{opacity:1;visibility:visible;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out;z-index:4}.dropdown__list--top.dropdown__list--open{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}.dropdown__list .list-item{width:100%;height:auto;padding:10px 16px;color:var(--color-black);font-size:14px;font-weight:400;cursor:pointer}.dropdown__list .list-item:not(:last-child){border-bottom:1px solid var(--color-light-grey)}.dropdown__list .list-item--active{color:var(--color-white);background-color:var(--color-primary);-webkit-transition:.3s background-color ease-in-out;transition:.3s background-color ease-in-out}#app_telofony .datepicker{width:auto!important;height:auto!important;left:unset;opacity:1;-webkit-box-shadow:unset!important;box-shadow:unset!important;border:none!important}#app_telofony .datepicker-input{width:77px;border:none!important;background-color:var(--color-white);color:var(--color-black);leading-trim:both;text-edge:cap;font-family:Lato,sans-serif;font-size:15px;font-weight:500;cursor:pointer;outline:0}#app_telofony .datepicker input:focus{-webkit-box-shadow:unset!important;box-shadow:unset!important}#app_telofony .datepicker-calendar{top:calc(100% + 14px);left:-38px;border-radius:6px;border-color:var(--color-light-grey)!important;width:300px!important}#app_telofony .datepicker-calendar .cell:hover{border-color:var(--color-primary)!important;border-radius:100%}#app_telofony .datepicker-calendar .cell.selected{background-color:var(--color-primary-hover)!important;border-radius:100%}.checkbox{width:auto;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:10px}.checkbox--left{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.checkbox--right{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.checkbox--top{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:20px}.checkbox--bottom{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;gap:20px}.checkbox__title{color:var(--color-black);leading-trim:both;text-edge:cap;font-size:15px;font-weight:500}.checkbox__input{display:none}.checkbox__input:checked~.checkbox__dot{background-color:var(--color-primary);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.checkbox__input:checked~.checkbox__dot .dot{left:17px;-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.checkbox__dot{position:relative;width:44px;height:30px;background-color:var(--color-light-grey);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:15px;padding:3px;-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.checkbox__dot .dot{position:absolute;left:3px;width:24px;height:24px;border-radius:100%;background-color:var(--color-white);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}#app_telofony .button{width:auto;height:auto;padding:12px 22px;border-radius:3px;-webkit-transition:.3s background-color ease-in-out;transition:.3s background-color ease-in-out;font-family:Lato,sans-serif;font-size:14px;font-style:normal;font-weight:400}#app_telofony .button--primary{background-color:var(--color-primary);color:var(--color-white)}#app_telofony .button--grey{border:1px solid var(--color-light-grey);background:var(--Linear,linear-gradient(180deg,#fefefe 0,#f6f6f6 100%));color:var(--color-grey)}.pagination{width:auto;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:10px}.pagination-page{width:37px;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:3px;border:1px solid var(--color-light-grey);background-color:var(--color-white);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.pagination-page__link{width:100%;height:100%;padding:10px;font-size:14px;font-style:normal;font-weight:400;color:#757575;text-align:center;-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.pagination-page--active{background-color:var(--color-primary);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.pagination-page--active .pagination-page__link{color:var(--color-white);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.pagination-next,.pagination-prev{width:37px;height:37px;border-radius:3px;border:1px solid var(--color-light-grey);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.pagination-next a,.pagination-prev a{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.pagination-next svg,.pagination-prev svg{-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}#app_telofony .table{position:relative;width:100%;height:437px;border-radius:3px;overflow-x:scroll;overflow-y:scroll}#app_telofony .table__wrapper{width:-webkit-max-content;width:-moz-max-content;width:max-content;pointer-events:none;position:absolute;top:0;left:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}#app_telofony .table__head{width:100%;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden}#app_telofony .table__head .table__row{background-color:#f2f3f3}#app_telofony .table__body{width:100%;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;overflow:hidden}#app_telofony .table__body .table__row:nth-child(2n){background-color:#f2f3f3}#app_telofony .table__body .table__col{min-width:0;width:100%;border-top:0;gap:10px}#app_telofony .table__body .table__col span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;gap:10px}#app_telofony .table__body .table__col a{color:#2f6c31;text-decoration:underline;pointer-events:auto}#app_telofony .table__body .table__col button{pointer-events:auto}#app_telofony .table__row{width:100%;height:auto;display:-ms-grid;display:grid;-ms-grid-columns:182px 270px 250px 300px 250px 160px 120px 140px;grid-template-columns:182px 270px 250px 300px 250px 160px 120px 140px}#app_telofony .table__row.dop__column{-ms-grid-columns:182px 270px 250px 300px 250px 160px 120px 140px 200px;grid-template-columns:182px 270px 250px 300px 250px 160px 120px 140px 200px}#app_telofony .table__col{min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content;width:100%;height:auto;padding:10px 20px;color:#2a2a2a;leading-trim:both;text-edge:cap;font-size:12px;font-style:normal;font-weight:600;line-height:normal;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-top:1px solid var(--color-light-grey);border-bottom:1px solid var(--color-light-grey);border-left:1px solid var(--color-light-grey)}#app_telofony .table__col:last-child{border-right:1px solid var(--color-light-grey)}#app_telofony .filters{width:100%;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;gap:30px}#app_telofony .filters__row{width:100%;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:20px}#app_telofony .filters__period{width:300px}#app_telofony .filters__date{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:6px;border:1px solid var(--color-light-grey);padding:10px;gap:10px}#app_telofony .filters__date-icon{width:18px;height:18px}#app_telofony .filters__record{margin-bottom:4px}#app_telofony .filters__duration,#app_telofony .filters__incoming,#app_telofony .filters__responsible,#app_telofony .filters__status{width:250px}.main-content{width:100%;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;gap:20px}.main-content__head{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:10px}.main-content__title{color:#000;leading-trim:both;text-edge:cap;font-size:20px;font-weight:400;line-height:normal}.main-content__tag{border-radius:50px;background-color:var(--color-primary);padding:8px 20px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#fff;text-align:center;font-size:14px;font-weight:400;line-height:normal}.main-content__table{width:100%;height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}#app_telofony .main-content__footer{width:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:20px}#app_telofony .main-content__footer-count{width:63px;margin-top:-10px}#app_telofony .main-content__footer-count .dropdown__input{padding:10px}#app_telofony .main-content__footer__pagination{width:auto}@media (hover:hover){.dropdown__list .list-item:not(.dropdown__list.list-item--active){-webkit-transition:.3s background-color ease-in-out;transition:.3s background-color ease-in-out}.dropdown__list .list-item:not(.dropdown__list.list-item--active):hover{background-color:var(--color-primary-hover);-webkit-transition:.3s background-color ease-in-out;transition:.3s background-color ease-in-out}#app_telofony .button:hover{-webkit-transition:.3s background-color ease-in-out;transition:.3s background-color ease-in-out}#app_telofony .button:hover--primary{background-color:var(--color-primary-hover)}.pagination-page:not(.pagination-page--active):hover{background-color:var(--color-primary-hover);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.pagination-next:hover,.pagination-prev:hover{background-color:var(--color-primary);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}.pagination-next:hover svg,.pagination-prev:hover svg{stroke:var(--color-white);-webkit-transition:.3s all ease-in-out;transition:.3s all ease-in-out}} |