| 1 |
- @import"https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Oswald:wght@400;600;700&display=swap";.menu-margin-bottom{margin-bottom:20px}.info-list__item_icon{width:30px;height:30px}.menu-icon{width:30px;height:30px;fill:#181719;-webkit-transition:fill .3s ease;transition:fill .3s ease}.list-icon{height:100%;min-width:16px}.list-icon.red{fill:red}.list-icon.green{fill:#76de37}.list-icon.blue{fill:#5d7df0}.menu{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:justify;-ms-flex-pack:justify;justify-content:space-between;max-width:430px;min-width:320px;border-radius:50px;background-color:#f4f4f4;padding:50px 36px 50px 50px}.menu__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.menu__header_title{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;font-family:"Oswald";font-size:36px;color:#181719;font-weight:600}.menu__header_icon{display:block;position:relative;z-index:2;width:30px;height:20px}.menu__header_icon span{position:absolute;z-index:1;display:block;width:100%;height:3px;left:0;background-color:#181719;-webkit-transition:all .3s ease;transition:all .3s ease}.menu__header_icon span:first-child{top:0}.menu__header_icon span:nth-child(2){top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.menu__header_icon span:last-child{bottom:0}.menu__header_icon.active span:first-child{top:50%;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}.menu__header_icon.active span:last-child{top:50%;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}.menu__header_icon.active span:nth-child(2){width:0}.menu__info_title{font-family:"Oswald";font-size:21px;color:#181719;font-weight:600;margin-bottom:10px}.info-list{padding:0 0 0 8px}.info-list__item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.info-list__item:not(:last-child){margin-bottom:10px}.info-list__link{-webkit-box-flex:1;-ms-flex:1 1 100%;flex:1 1 100%;display:-webkit-box;display:-ms-flexbox;display:flex}.info-list__background{padding:10px 15px;background-color:#fff9f9;border-radius:50px;-webkit-box-shadow:1px 1px 1px rgba(0,0,0,.2);box-shadow:1px 1px 1px rgba(0,0,0,.2);-webkit-transition:background-color .3s ease;transition:background-color .3s ease}.info-list__background.active{background-color:#5d7df0}.info-list__background.active .menu-icon{fill:#fff9f9}.info-list__background.active .info-list__item_text{color:#fff9f9}.info-list__item_text{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-family:"Noto sans";font-size:14px;color:#39363d;font-weight:400;margin-left:8px;-webkit-transition:color .3s ease;transition:color .3s ease}.info-list__item_count{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#181719;font-size:12px;font-weight:bold;border-radius:50px;background-color:#c4c4c4;padding:5px 15px}.login-btn{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;border-radius:50px;padding:10px 20px;background-color:#fff9f9;-webkit-box-shadow:1px 1px 1px rgba(0,0,0,.2);box-shadow:1px 1px 1px rgba(0,0,0,.2)}.login-btn_icon{fill:#5d7df0;width:20px;height:20px}.login-btn_text{font-family:"Noto sans";font-size:21px;font-weight:400;margin-left:15px;white-space:nowrap}.tasks{display:grid;grid-template-columns:1fr 1fr;grid-row-gap:50px;grid-column-gap:20px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.event{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;border:1px solid #39363d;border-radius:30px;padding:20px 25px 40px 25px}.event:nth-child(3n-2){grid-column-start:1;grid-column-end:3}.event__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:20px}.event__header_title{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;font-size:36px;font-family:"Oswald";font-weight:600}.event__header_button{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:15px;border:1px solid #39363d;border-radius:15px;font-family:"Noto Sans";font-weight:300;font-size:18px}.event__header_icon{width:30px;height:30px;margin-right:15px;fill:#5d7df0}.event__item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:7px 5px 12px 7px;border-bottom:2px solid #39363d}.event__item:not(:last-child){margin-bottom:10px}.event__item_category{width:40px;height:35px;min-width:40px}.event__item_icon{margin-right:12px}.event__item_title{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;font-size:18px;font-family:"Noto Sans";font-weight:400;color:#39363d}.event__item_check{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:30px;width:30px;min-width:30px;padding:2px 1px 2px 2px;border:3px solid #181719;border-radius:4px;fill:#76de37;-webkit-transition:border-color .5s ease;transition:border-color .5s ease}.event__item_check svg{-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transition:-webkit-transform .3s ease;transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease, -webkit-transform .3s ease}.event__item_check.done{border:3px solid #76de37}.event__item_check.done svg{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}@media(hover: hover){.event__item_check:hover{cursor:pointer}}.modal{position:fixed;z-index:1;left:0;top:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:100vh;width:100vw;background-color:rgba(24,23,25,.5);opacity:0;-webkit-transition:opacity .3s ease;transition:opacity .3s ease;pointer-events:none;padding:10px}.modal.active{pointer-events:all;opacity:1}.modal__content{padding:20px;border-radius:15px;background-color:#fff9f9;min-width:300px;-webkit-transform:scale(0.5);-ms-transform:scale(0.5);transform:scale(0.5);-webkit-transition:-webkit-transform .3s ease;transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease, -webkit-transform .3s ease}.modal__content.active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.task-form{position:relative}.task-form__close{position:absolute;z-index:1;right:0px;top:0px;width:35px;height:35px}.task-form__info{margin-bottom:30px}.task-form__field{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.task-form__field:not(:last-child){margin-bottom:20px}.task-form__field_icon{min-width:40px;width:40px;height:40px;margin-right:15px}.task-form__field_input{width:100%;font-family:"Noto Sans";font-size:34px;color:#39363d;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;padding:3px;border-bottom:1px solid #181719}.task-form__actions{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.form-action-btn{text-align:center;font-family:"Nota sans";font-size:24px;font-weight:400;padding:10px 30px;border-radius:19px}.task-form__actions_close{color:#fff9f9;background-color:#39363d}.task-form__actions_confirm{color:#181719;background-color:#76de37}.wrapper{font-family:"Oswald";min-height:100vh;width:100%;display:grid;grid-template-columns:minmax(320px, 370px) 1fr;grid-gap:30px;background-color:#fff9f9;padding:27px 30px 40px 30px}.main{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;max-height:calc(100vh - 67px);overflow-y:auto;overflow-x:hidden}
|
