2 lines
14 KiB
CSS
2 lines
14 KiB
CSS
@import"https://fonts.googleapis.com/css2?family=Lato&display=swap";*{font-family:Lato,sans-serif;margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth}.container{width:100%;padding:0 5rem;max-width:100%;margin:0 auto;height:100%}html{font-size:62.5%;height:100%}body{background-color:#222831;position:relative}body,#root,.App{height:100%}ul{list-style-type:none}input,button{background:none;outline:none;border:none}button:disabled{background:#d4d4d4!important;border:none!important;cursor:not-allowed!important}a{text-decoration:none}a,h1,h2,h3,h4,h5,h6,span,label,input,textarea,p{color:#f2f2f2}.green{color:#2fad8c;font-size:1.6rem;font-weight:700}.red{color:red;font-size:1.6rem;font-weight:700}input,textarea,select{transition:.1s all ease;border:.1rem #f2f2f2 solid;outline:#2fad8c 0rem solid}input:focus,textarea:focus,select:focus{transition:.1s all ease;border:.1rem #393e46 solid;outline:#2fad8c .3rem solid}::-webkit-scrollbar{width:1rem}::-webkit-scrollbar-track{background:#c9fce9}::-webkit-scrollbar-thumb{background:#2fad8c}::-webkit-scrollbar-thumb:hover{background:#268a6f}.login{height:100%}.login.inner{display:flex;align-items:center;justify-content:center}.login__wrapper{display:flex;flex-direction:column;gap:2.4rem}.login__header{text-align:center;font-size:2.8rem}.login__form{min-width:35rem;background:#393e46;padding:3.5rem;border:1px solid #222831;border-radius:.5rem;display:flex;flex-direction:column;gap:1.6rem}.login__form__error{overflow:hidden;height:0;color:red;font-size:1.4rem;font-weight:700;transition:.3s all ease}.login__form__error.active{transition:.3s all ease;height:2rem}.login__form__button{border-radius:.5rem;cursor:pointer;width:100%;padding:.6rem 1.2rem;color:#fff;font-size:1.6rem}.login__form__button--violet{background-color:#2fad8c;border:.1rem solid #2fad8c;transition:.3s all ease}.login__form__button--violet:hover{transition:.3s all ease;background-color:#268a6f;border:.1rem solid #268a6f}.login__form__block{display:flex;flex-direction:column;gap:.8rem}.login__form__block label{font-size:1.6rem}.login__form__block input{font-size:1.6rem;padding:.6rem 1.2rem;border-radius:.5rem}.login__form__block--check label{font-size:1.6rem;display:flex;align-items:center;gap:.6rem}.nav__dropdown{background:#393e46;z-index:5;border-radius:1rem;width:100%;opacity:0;overflow:hidden;position:absolute;transition:.3s all ease;top:calc(100% + 1rem);left:0;height:0;border:.1rem solid #222831}.nav__dropdown.active{height:14.7rem;opacity:1;transition:.3s all ease}.nav__dropdown__wrapper{display:flex;flex-direction:column}.nav__dropdown__wrapper li{display:flex;flex-direction:column;gap:.2rem}.nav__dropdown__wrapper li:nth-child(2n){padding-bottom:1rem}.nav__left{display:flex;align-items:center;justify-content:flex-start;gap:5%}.nav__right{justify-self:flex-end;max-width:10rem;display:flex;align-items:center}.nav__right__user{cursor:pointer;position:relative;background:#393e46;border:.1rem solid #222831;border-radius:1rem;padding:1rem;display:flex;align-items:center;gap:1.6rem;transition:.3s all ease}.nav__right__user:hover{transition:.3s all ease;border:.1rem solid #393e46;background:#222831}.nav__right__user button{border-top:.1rem solid #c8c8c8;padding:1rem 1rem .5rem;cursor:pointer;color:#25acda}.nav__right__user span{font-size:1.6rem}.nav__right__user p{font-size:1.2rem;padding:0 1rem}.nav__right__user__img{width:3rem;height:3rem}.nav__right__user__img img{width:3rem;height:3rem;object-fit:contain}.nav__right__user h2,.nav__right__user h3{padding:1rem 1rem .5rem;width:100%;font-size:1.4rem}.nav.inner{display:grid;grid-template-columns:1fr 1fr;gap:3rem;padding:2rem 0}.nav__img{width:7rem;height:5rem}.nav__img svg{width:7rem;height:5rem}.nav__btn{cursor:pointer;display:flex;align-items:center;justify-content:center;width:4.8rem;height:3.2rem;padding:.4rem 0;border:.1rem solid #393e46;border-radius:.5rem;transition:.3s all ease}.nav__btn img{width:4.8rem;height:3.2rem;object-fit:contain}.nav__btn:active{transition:.3s all ease;border:.3rem solid #393e46}.main__mid{padding:3rem 0;display:grid;grid-template-columns:auto 1fr}.aside{transition:.3s all ease;overflow:hidden;max-width:0;width:100%}.aside__img{width:3rem;height:3rem}.aside.active{max-width:25rem;transition:.3s all ease}.aside__list{width:100%;padding:1rem;display:flex;flex-direction:column;gap:1rem;background:#393e46}.aside__list__element{min-width:13.12rem;transition:.3s all ease;background:transparent;display:flex;gap:1.5rem;align-items:center;font-size:1.6rem;cursor:pointer}.aside__list__element a,.aside__list__element div{display:flex;align-items:center;justify-content:flex-start;gap:1.4rem;width:100%;padding:.8rem .4rem .8rem 1.2rem}.aside__list__element:hover{transition:.3s all ease;background:#222831}.aside__list__element__img{width:2rem;height:2rem}.aside__list__element__img img{width:2rem;height:2rem;object-fit:contain}.aside__list__element--title{cursor:default!important;background:transparent!important;font-size:1.4rem}.aside__list__element--title:not(:first-child){padding-top:1rem;margin-top:1rem}.aside__list__element--title svg{width:3rem;height:3rem}.dashboard__head{display:flex;align-items:center;gap:1rem}.dashboard__head h1{font-size:3.2rem}.dashboard__img{width:4rem;height:4rem;stroke:#2fad8c}.dashboard__content__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:3rem}.dashboard.inner{display:flex;flex-direction:column;gap:4rem}.statcard{cursor:default;transition:.3s all ease;transform:translateY(0);border-radius:.5rem;color:#fff;display:flex;flex-direction:column;justify-content:center;padding:2rem}.statcard:hover{transition:.3s all ease;transform:translateY(-1rem)}.statcard.yellow{background:#ffc107}.statcard.black{background:#161c2d}.statcard.green{background:#42ba96}.statcard.violet{background:#7c69ef}.statcard span{font-size:2.4rem}.statcard p{font-size:1.6rem}.posts__pagination{width:100%;display:flex;gap:3rem;align-items:center;justify-content:flex-end}.posts__pagination input{border-radius:.5rem;border:none!important;width:5%;text-align:center;font-weight:700}.posts__pagination button{transition:.3s all ease;cursor:pointer;color:#f2f2f2;font-size:1.6rem;width:15%;padding:1rem 2rem;border-radius:.5rem;background:#2fad8c}.posts__pagination button:hover{transition:.3s all ease;background:#268a6f}.posts__select{display:flex;flex-direction:column;gap:.8rem}.posts__select label{display:flex;gap:.8rem;font-size:1.4rem}.posts__select input{background:#393e46;color:#f2f2f2;font-size:1.6rem;padding:1rem 1.2rem;border-radius:.2rem;cursor:default;border-radius:.5rem}.posts__select__wrapper{display:flex;gap:1rem}.posts select{padding:1rem 1.2rem;color:#f2f2f2;background:#393e46;border-radius:.5rem}.posts.inner{display:flex;flex-direction:column;gap:4rem}.posts__table.disabled{pointer-events:none}.posts__table__head{min-height:unset!important;background:#393e46}.posts__table th{padding:.3rem;display:flex;align-items:center;gap:.6rem;cursor:pointer;width:100%;height:100%;text-align:center;font-size:1.6rem;justify-self:center;background:transparent;transition:.3s all ease}.posts__table th span{width:100%;color:#f2f2f2;transition:.3s all ease}.posts__table th.active{background:#c9fce9;transition:.3s all ease}.posts__table th.active span{color:#222831;transition:.3s all ease}.posts__table .post-link{background:#222831}.posts__table .post-link:nth-child(2n){background:#c9fce9}.posts__table .post-link:nth-child(2n) td{color:#393e46}.posts__table .post-link:nth-child(2n) td svg{fill:#222831}.posts__table tr{min-height:7rem;padding:1rem;display:grid;grid-template-columns:1fr 2.5fr 2fr 2fr 2fr 1.5fr 3fr;gap:1rem}.posts__table td{color:#f2f2f2;text-align:center;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;justify-self:center;font-size:1.2rem;align-self:center}.posts__table td a{width:100%;display:flex;align-items:center;justify-content:center}.posts__table td svg{width:2rem;height:2rem}.posts__table tbody{min-height:20rem;position:relative;display:flex;flex-direction:column}.posts__reset{color:#fff;max-width:30rem;font-size:1.6rem;border-radius:.5rem;background:#2fad8c;padding:.5rem 2rem;text-align:center;height:67%;min-width:20rem;cursor:pointer;transition:.3s all ease}.posts__reset:hover{transition:.3s all ease;background-color:#268a6f;border:.1rem solid #268a6f}.posts__reset__btn{display:flex;flex-direction:row;align-items:flex-end}.post{padding-bottom:4rem}.post.inner{display:flex;flex-direction:column;gap:4rem}.post h1{font-size:2.4rem}.post__head svg{width:5rem;height:5rem}.post__content{display:flex;flex-direction:column;gap:3rem}.post__content__btn{display:flex;align-items:center;gap:1rem;border-radius:.2rem;cursor:pointer;width:100%;padding:1rem 1.2rem;color:#f2f2f2;font-size:1.6rem;background-color:#2fad8c;transition:.3s all ease}.post__content__btn:hover{transition:.3s all ease;background-color:#268a6f}.post__content input{font-size:1.6rem;padding:.6rem 1.2rem;border-radius:.5rem;cursor:default;background:#393e46}.post__content textarea{background:#393e46;cursor:default;padding:.6rem 1.2rem;resize:none;font-size:1.6rem;border-radius:.5rem}.post__content__block{display:flex;flex-direction:column;gap:.8rem}.post__content__block h4{font-size:1.6rem}.post__content__table thead tr{min-height:unset!important;background:#393e46}.post__content__table th{cursor:pointer;width:100%;height:100%;text-align:center;font-size:1.6rem;justify-self:center;background:transparent;transition:.3s all ease}.post__content__table tr{background:#222831}.post__content__table tr:nth-child(2n){background:#c9fce9}.post__content__table tr:nth-child(2n) td{color:#393e46}.post__content__table tr:nth-child(2n) td svg{fill:#222831}.post__content__table tr{min-height:7rem;padding:1rem;display:grid;grid-template-columns:1fr repeat(4,2fr);gap:1rem}.post__content__table td{color:#f2f2f2;text-align:center;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;justify-self:center;font-size:1.2rem;align-self:center}.post__content__table td a{width:100%;display:flex;align-items:center;justify-content:center}.post__content__table td svg{width:2rem;height:2rem}.post__content__table tbody{min-height:20rem;position:relative;display:flex;flex-direction:column}.table__empty{font-size:1.6rem;text-align:center}.details.inner{display:flex;flex-direction:column;gap:4rem}.details__data{display:grid;grid-template-columns:1fr 1fr;gap:3rem}.details__data__block{width:100%;display:flex;flex-direction:column;gap:.6rem}.details__data label{font-size:2rem}.details__data input{font-size:1.6rem;padding:1rem 1.2rem;border-radius:.5rem}.details__content,.category.inner{display:flex;flex-direction:column;gap:4rem}.category__head svg{width:4rem;height:4rem}.category th{cursor:pointer;width:100%;height:100%;text-align:center;font-size:1.6rem;justify-self:center;background:transparent;color:#f2f2f2;transition:.3s all ease}.category__form{display:flex;flex-direction:column;align-items:flex-start;gap:4rem}.category__form__block{width:100%;max-width:40rem;display:flex;flex-direction:column;gap:.6rem}.category__form__block label{font-size:2rem}.category__form__block input{padding:.7rem 1rem;border:.1rem solid #cccccc;border-radius:.5rem}.category__form button{display:flex;align-items:center;justify-content:center;gap:1rem;max-width:30rem;border-radius:.2rem;cursor:pointer;width:100%;padding:1rem 1.8rem;color:#fff;font-size:1.6rem;background-color:#7c69ef;border:.1rem solid #7c69ef;transition:.3s all ease}.category__form button:hover{transition:.3s all ease;background-color:#705ed6;border:.1rem solid #705ed6}.category__table__wrapper{display:flex;flex-direction:column;gap:1rem}.category__table__wrapper h3{font-size:2rem;font-weight:400}.category__table__head{cursor:default;min-height:unset!important;background:#393e46!important}.category__table tr{min-height:7rem;padding:1rem;display:grid;grid-template-columns:1fr 2fr 3fr 4fr;gap:1rem;color:#f2f2f2;background:#222831}.category__table tr:nth-child(2n){background:#c9fce9}.category__table tr:nth-child(2n) td{color:#393e46}.category__table tr:nth-child(2n) td svg{fill:#222831}.category__table tr:nth-child(2n) td span{color:#222831;font-weight:700}.category__table td{text-align:center;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;justify-self:center;font-size:1.2rem;align-self:center}.category__table tbody{max-height:70vh;overflow-y:auto;display:flex;flex-direction:column}.source-action{display:flex;gap:1rem;align-items:center;justify-content:center}.source-action__block button,.source-action__block a{cursor:pointer;display:flex;align-items:center;gap:.6rem}.source-action__block svg{width:1.5rem;height:1.5rem}.source-action__block span{font-size:1.6rem}.source__link{display:flex;align-items:center;gap:1rem;max-width:30rem;font-size:1.6rem;border-radius:.5rem;background:#2fad8c;padding:1rem 2rem;transition:.3s all ease;text-align:center}.source__link:hover{background:#268a6f;transition:.3s all ease}.source__head svg{width:4rem;height:4rem}.source__create.inner,.source__create__block,.source-edit.inner,.source-edit__content form{display:flex;flex-direction:column;gap:4rem}.source-edit__info,.source-edit__content{display:flex;flex-direction:column;gap:3rem;padding:1rem}.source-edit__info h2,.source-edit__content h2{font-weight:400;font-size:3rem}.source-edit__input{color:#f2f2f2;display:flex;flex-direction:column;gap:.8rem;font-size:1.6rem}.source-edit__input input{font-size:1.6rem;background:#393e46;padding:.6rem 1.2rem;border-radius:.5rem}.source-edit__submit{font-size:1.6rem;cursor:pointer;color:#f2f2f2;border-radius:.5rem;background:#2fad8c;transition:.3s all ease;padding:1.6rem 1.2rem}.source-edit__submit:hover{transition:.3s all ease;background:#268a6f}.loader{z-index:20;display:flex;justify-content:center;align-items:center;position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(255,255,255,.4)}.loader.inner{opacity:1}.loader.inner img{width:100%;height:100%;max-width:10rem;max-height:10rem}.popup{opacity:0;left:4rem;bottom:2rem;border-radius:.6rem;z-index:30;position:absolute;width:35rem;height:6rem;display:flex;align-items:center;gap:3rem;padding:1.6rem;background:#393e46;transition:.3s all ease}.popup__wrapper{pointer-events:none;top:0;left:0;position:absolute;overflow:hidden;height:100vh;width:100%}.popup__wrapper__inner{width:100%;height:100%;position:relative}.popup span{font-size:1.6rem}.popup svg{width:3rem;height:3rem}.popup.active{transition:.3s all ease;animation:slideIn 2s ease-in-out 0s 1 forwards}@keyframes slideIn{0%{transform:translateY(3rem)}25%{opacity:1;transform:translateY(0)}50%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(3rem)}}
|