2 lines
9.6 KiB
CSS
2 lines
9.6 KiB
CSS
@import"https://fonts.googleapis.com/css2?family=Roboto&display=swap";*{font-family:Roboto,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:#f1f4f8}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{color:#000;text-decoration:none}.green{color:green;font-size:1.6rem;font-weight:700}.red{color:red;font-size:1.6rem;font-weight:700}.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:#fff;padding:3.5rem;border:1px solid #d9e2ef;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:.2rem;cursor:pointer;width:100%;padding:.6rem 1.2rem;color:#fff;font-size:1.6rem}.login__form__button--violet{background-color:#7c69ef;border:.1rem solid #7c69ef;transition:.3s all ease}.login__form__button--violet:hover{transition:.3s all ease;background-color:#705ed6;border:.1rem solid #705ed6}.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:1px solid #d9e2ef;border-radius:.2rem}.login__form__block--check label{font-size:1.6rem;display:flex;align-items:center;gap:.6rem}.nav__dropdown{background:#f1f4f8;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 #c8c8c8}.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:#f1f4f8;border:.1rem solid #c8c8c8;border-radius:1rem;padding:1rem;display:flex;align-items:center;gap:.5rem;transition:.3s all ease}.nav__right__user:hover{transition:.3s all ease;background:#b9b9b9}.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 rgba(0,0,0,.4);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 rgba(0,0,0,.8)}.main__mid{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}.aside__list__element{min-width:13.12rem;transition:.3s all ease;background:transparent;display:flex;gap:.6rem;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:1rem;width:100%;padding:.8rem .4rem .8rem 1.2rem}.aside__list__element:hover{transition:.3s all ease;background:#cccccc}.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}.dashboard__head{display:flex;align-items:center;gap:1rem}.dashboard__head h1{font-size:3.2rem}.dashboard__img{width:4rem;height:4rem}.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{width:5%;text-align:center;font-weight:700}.posts__pagination button{cursor:pointer;font-size:1.6rem;width:15%;padding:1rem 2rem;border-radius:.5rem;background:#7c69ef;color:#fff}.posts__select{display:flex;flex-direction:column;gap:.8rem}.posts__select label{font-size:1.4rem}.posts__select input{font-size:1.6rem;padding:1rem 1.2rem;border:1px solid #b8b9bb;border-radius:.2rem;cursor:default;background:#fff}.posts__select__wrapper{display:flex;gap:1rem}.posts select{padding:1rem 1.2rem;border:1px solid #b8b9bb}.posts select option{text-transform:capitalize}.posts.inner{display:flex;flex-direction:column;gap:4rem;padding-bottom:3rem}.posts__table__head{min-height:unset!important;background:#dbdbdb}.posts__table th{cursor:pointer;width:100%;height:100%;text-align:center;font-size:1.6rem;justify-self:center;background:transparent;color:#000;transition:.3s all ease}.posts__table th.active{background:rgb(98,98,98);color:#fff;transition:.3s all ease}.posts__table .post-link{background:#f2f0fd}.posts__table .post-link:nth-child(2n){background:#fafafa}.posts__table tr{min-height:7rem;padding:1rem;display:grid;grid-template-columns:1fr 2.5fr 2fr 2fr 1.5fr 3fr;gap:1rem}.posts__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}.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{max-height:70vh;overflow-y:auto;display:flex;flex-direction:column}.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;max-width:30rem;border-radius:.2rem;cursor:pointer;width:100%;padding:.6rem 1.2rem;color:#fff;font-size:1.6rem;background-color:#7c69ef;border:.1rem solid #7c69ef;transition:.3s all ease}.post__content__btn:hover{transition:.3s all ease;background-color:#705ed6;border:.1rem solid #705ed6}.post__content input{font-size:1.6rem;padding:1rem 1.2rem;border:1px solid #b8b9bb;border-radius:.2rem;cursor:default;background:#ebedef}.post__content textarea{background:#ebedef;cursor:default;padding:1rem 1.2rem;resize:none;outline:none;font-size:1.6rem;border:1px solid #b8b9bb;border-radius:.2rem}.post__content__block{display:flex;flex-direction:column;gap:.8rem}.post__content__block h4{font-size:1.6rem}.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{padding:.7rem 1rem;border:.1rem solid #cccccc;border-radius:.5rem}.details__content{display:flex;flex-direction:column;gap:4rem}.category.inner{display:flex;flex-direction:column;gap:4rem;padding-bottom:3rem}.category__head svg{width:4rem;height:4rem}.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{min-height:unset!important;background:#dbdbdb!important}.category__table tr{min-height:7rem;padding:1rem;display:grid;grid-template-columns:1fr 5fr;gap:1rem;background:#f2f0fd}.category__table tr:nth-child(2n){background:#fafafa}.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}
|