diff --git a/public/assets/css/all.css b/public/assets/css/all.css index 1cc8b62..aee67f5 100644 --- a/public/assets/css/all.css +++ b/public/assets/css/all.css @@ -50,14 +50,17 @@ font-family: "AvertaStdCY-Black"; src: url(../fonts/AvertaStdCY-Black_1.otf); } + @font-face { font-family: "AvertaStdCY-ExtraBold"; src: url(../fonts/AvertaStdCY-Extrabold_1.otf); } + @font-face { font-family: "AvertaStdCY-ExtraBoldItalic"; src: url(../fonts/AvertaStdCY-ExtraboldItalic_1.otf); } + @font-face { font-family: "AvertaStdCY-Bold"; src: url(../fonts/AvertaStdCY-Bold_1.otf); @@ -72,6 +75,7 @@ font-family: "AvertaStdCY"; src: url(../fonts/AvertaStdCY-Regular_3.otf); } + @font-face { font-family: "AvertaStdCY-Italic"; src: url(../fonts/AvertaStdCY-RegularItalic_1.otf); @@ -97,7 +101,7 @@ html { font-size: 62.5%; } -@media screen and (max-height: 800px) { +@media screen and (max-height: 800px) { :root { --height-header: 42px; --width-sidebar: 68px; @@ -193,6 +197,7 @@ video { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } + html, body { /* height: 100%; */ @@ -324,7 +329,7 @@ a:hover { background: #fff; } -body > iframe[style*="2147483647"] { +body>iframe[style*="2147483647"] { display: none; } @@ -866,19 +871,19 @@ a:hover { transform: translateY(-50%) translateY(0px); } -.slider-custom .uk-dotnav > * > * { +.slider-custom .uk-dotnav>*>* { width: 14px; height: 14px; border: 1px solid #00bbb6; } -.slider-custom .uk-dotnav > .uk-active > * { +.slider-custom .uk-dotnav>.uk-active>* { background-color: #00bbb6; border-color: transparent; } -.slider-custom .uk-dotnav > * > :focus, -.slider-custom .uk-dotnav > * > :hover { +.slider-custom .uk-dotnav>*> :focus, +.slider-custom .uk-dotnav>*> :hover { background-color: #00bbb6; } @@ -1105,7 +1110,7 @@ a:hover { background-position: bottom; } -.bg-auth-img{ +.bg-auth-img { width: 100%; height: 100vh; background-image: url("./../imgs/bg/bg_auth.png"); @@ -1117,7 +1122,7 @@ a:hover { background-size: cover; } -.bg-main-img{ +.bg-main-img { width: 100%; height: 100%; background-image: url("./../imgs/bg/bg_main.png"); @@ -1241,19 +1246,19 @@ a:hover { left: calc(100% - 30px); } -.slider-custom-2 .uk-dotnav > * > * { +.slider-custom-2 .uk-dotnav>*>* { width: 14px; height: 14px; border: 1px solid #00bbb6; } -.slider-custom-2 .uk-dotnav > .uk-active > * { +.slider-custom-2 .uk-dotnav>.uk-active>* { background-color: #00bbb6; border-color: transparent; } -.slider-custom-2 .uk-dotnav > * > :focus, -.slider-custom-2 .uk-dotnav > * > :hover { +.slider-custom-2 .uk-dotnav>*> :focus, +.slider-custom-2 .uk-dotnav>*> :hover { background-color: #00bbb6; } @@ -1412,6 +1417,7 @@ a:hover { overflow: hidden; height: 80px; } + .personal.plan-item { border-left: 20px solid #8dc63f; } @@ -1697,7 +1703,7 @@ a:hover { padding-top: 40px; } -.sunE-class-content .uk-grid > * { +.sunE-class-content .uk-grid>* { padding-left: 20px; padding-bottom: 20px; } @@ -2104,9 +2110,11 @@ a:hover { height: 100%; object-fit: cover; } + .item-student-name-container { max-width: 65%; } + .item-student-name { padding: 0 0 0 20px; } @@ -2727,13 +2735,11 @@ a:hover { margin: -2px 10px 0 0; } -.laplai p > input[type="radio"]:checked + *::before { - background: radial-gradient( - #84c241 0%, - #84c241 40%, - transparent 50%, - transparent - ); +.laplai p>input[type="radio"]:checked+*::before { + background: radial-gradient(#84c241 0%, + #84c241 40%, + transparent 50%, + transparent); } .apdung label { @@ -3211,6 +3217,7 @@ a:hover { .box-select-file-full { flex: 1; } + .box-select-file-full p { flex: 1; text-align: left; @@ -3589,8 +3596,8 @@ a:hover { overflow: auto; padding: 0 25px 0 20px; - @media screen and (max-height: 800px){ - max-height: calc(100vh - 130px); + @media screen and (max-height: 800px) { + max-height: calc(100vh - 130px); } } @@ -3820,9 +3827,7 @@ a:hover { border-bottom: 1px solid #777777; } -.giaotrinh.pad-t-0 - .sunE-giaotrinh-resuft-filter - .sunE-giaotrinh-item:last-child { +.giaotrinh.pad-t-0 .sunE-giaotrinh-resuft-filter .sunE-giaotrinh-item:last-child { border-bottom: none; } @@ -4153,6 +4158,7 @@ a:hover { .sunE-right-container:has(.__text_empty) { overflow: initial; } + .chambai.writing { margin: 0 0 15px; } @@ -5132,15 +5138,13 @@ a:hover { color: #fff; font-size: 18px; font-family: "Myriadpro-Bold"; - background-image: linear-gradient( - 45deg, - #b0853a, - #f8efa5, - #9d7033, - #e7bf55, - #faf4ac, - #9d7033 - ); + background-image: linear-gradient(45deg, + #b0853a, + #f8efa5, + #9d7033, + #e7bf55, + #faf4ac, + #9d7033); text-align: center; border-radius: 15px; margin: 0 auto 5px; @@ -5154,14 +5158,12 @@ a:hover { color: #fff; font-size: 18px; font-family: "Myriadpro-Bold"; - background-image: linear-gradient( - 45deg, - #c0c0c0, - #ebeaea, - #b8b8b8, - #6f6f6f, - #ebeaea - ); + background-image: linear-gradient(45deg, + #c0c0c0, + #ebeaea, + #b8b8b8, + #6f6f6f, + #ebeaea); text-align: center; border-radius: 15px; margin: 0 auto 5px; @@ -5175,14 +5177,12 @@ a:hover { color: #fff; font-size: 18px; font-family: "Myriadpro-Bold"; - background-image: linear-gradient( - 40deg, - #a3bee3, - #7da6d7, - #dde5f4, - #b5c9e7, - #174d6b - ); + background-image: linear-gradient(40deg, + #a3bee3, + #7da6d7, + #dde5f4, + #b5c9e7, + #174d6b); text-align: center; border-radius: 15px; margin: 0 auto 5px; @@ -5277,7 +5277,7 @@ a:hover { margin-bottom: 20px; } -.vinhdanh-content .uk-grid > * { +.vinhdanh-content .uk-grid>* { padding-left: 20px !important; } @@ -5679,8 +5679,7 @@ a:hover { content: ""; width: 17px; height: 10px; - background: url(./../images/tinnhan/ico_dropdown.png) 98% / 17px no-repeat - transparent; + background: url(./../images/tinnhan/ico_dropdown.png) 98% / 17px no-repeat transparent; position: absolute; top: 18px; right: 30px; @@ -5976,6 +5975,7 @@ a:hover { justify-content: space-between; padding-left: 3rem; } + .phieudiem .diemdanh-item .phieudiem-info p { font-family: "Myriadpro-Bold"; font-size: 18px; @@ -6158,7 +6158,7 @@ a:hover { box-sizing: border-box; } -.btn-on-off.active .checkbox:checked + .knobs:before { +.btn-on-off.active .checkbox:checked+.knobs:before { left: 24px; background-image: linear-gradient(to right, #fadb3a, #f5d030, #ebb318); } @@ -6620,8 +6620,7 @@ a:hover { font-family: "Myriadpro-Bold"; } -.student-khht .sunE-calendar { -} +.student-khht .sunE-calendar {} .sunE-plan.khht-tkb, .sunE-plan.khht-cn { @@ -7215,14 +7214,12 @@ p.text-center.f-18 { } .top-k-item.b .top-k-score { - background-image: linear-gradient( - to right, - #b8b8b8, - #cfcfcf, - #ebeaea, - #c0c0c0, - #ebeaea - ); + background-image: linear-gradient(to right, + #b8b8b8, + #cfcfcf, + #ebeaea, + #c0c0c0, + #ebeaea); } .top-k-item p { @@ -7691,6 +7688,7 @@ p.text-center.f-18 { .fix_text_cut_chart::after { background: none !important; } + .box-s { padding: 0 5px 0 30px; } @@ -8021,8 +8019,7 @@ p.text-center.f-18 { appearance: none; /* Remove default arrow */ color: #fff; - background: url("./../images/icon/ico_dropdown_border_white.png") 98% / 30px - no-repeat #00ceab; + background: url("./../images/icon/ico_dropdown_border_white.png") 98% / 30px no-repeat #00ceab; /* Add custom arrow */ } @@ -8309,7 +8306,7 @@ p.text-center.f-18 { padding-top: 10px; } -.unit-list .uk-grid > * { +.unit-list .uk-grid>* { padding-left: 25px; } @@ -8360,7 +8357,7 @@ p.text-center.f-18 { margin-top: -1px; } -.chk-custom-gr input:checked + label:after { +.chk-custom-gr input:checked+label:after { content: ""; display: block; position: absolute; @@ -8377,7 +8374,7 @@ p.text-center.f-18 { padding: 9px; } -.wh20.chk-custom-gr input:checked + label:after { +.wh20.chk-custom-gr input:checked+label:after { top: -3px; left: 6px; width: 6px; @@ -8387,7 +8384,7 @@ p.text-center.f-18 { transform: rotate(36deg); } -.wh20.chk-custom-gr-selected input:checked + label:after { +.wh20.chk-custom-gr-selected input:checked+label:after { top: -6px; left: 8px; } @@ -8479,21 +8476,13 @@ p.text-center.f-18 { border-radius: 50% !important; } -.react-datepicker__time-container - .react-datepicker__time - .react-datepicker__time-box - ul.react-datepicker__time-list - li.react-datepicker__time-list-item--selected { +.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected { background-image: linear-gradient(to right, #00e1a0, #00b9b7); color: white; font-weight: bold; } -.react-datepicker__time-container - .react-datepicker__time - .react-datepicker__time-box - ul.react-datepicker__time-list - li.react-datepicker__time-list-item:hover { +.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover { background-image: linear-gradient(to right, #00e1a0, #00b9b7); } @@ -8523,16 +8512,20 @@ p.text-center.f-18 { color: #fff !important; } -.react-datepicker__month .react-datepicker__month-text:hover, .react-datepicker__month .react-datepicker__quarter-text:hover { +.react-datepicker__month .react-datepicker__month-text:hover, +.react-datepicker__month .react-datepicker__quarter-text:hover { border-radius: 8px !important; border: none !important; } -.react-datepicker__month .react-datepicker__month-text, .react-datepicker__month .react-datepicker__quarter-text { +.react-datepicker__month .react-datepicker__month-text, +.react-datepicker__month .react-datepicker__quarter-text { width: auto !important; } -.react-datepicker__current-month, .react-datepicker-time__header, .react-datepicker-year-header { +.react-datepicker__current-month, +.react-datepicker-time__header, +.react-datepicker-year-header { font-size: 1.6rem !important; } @@ -8548,7 +8541,10 @@ p.text-center.f-18 { display: flex !important; } -.react-datepicker__day--today, .react-datepicker__month-text--today, .react-datepicker__quarter-text--today, .react-datepicker__year-text--today { +.react-datepicker__day--today, +.react-datepicker__month-text--today, +.react-datepicker__quarter-text--today, +.react-datepicker__year-text--today { border-radius: 8px !important; } @@ -8751,8 +8747,7 @@ ul.pagination li:hover a { content: ""; width: 18px; height: 9px; - background: url(./../images/teacher/diemdanh/ico_dropdown_green.png) 96% / - 18px no-repeat transparent; + background: url(./../images/teacher/diemdanh/ico_dropdown_green.png) 96% / 18px no-repeat transparent; position: absolute; top: 12px; right: 10px; @@ -8762,8 +8757,7 @@ ul.pagination li:hover a { content: ""; width: 18px; height: 9px; - background: url(./../images/teacher/diemdanh/ico_dropdown_orange.png) 96% / - 18px no-repeat transparent; + background: url(./../images/teacher/diemdanh/ico_dropdown_orange.png) 96% / 18px no-repeat transparent; position: absolute; top: 12px; right: 10px; @@ -8774,8 +8768,7 @@ ul.pagination li:hover a { content: ""; width: 18px; height: 9px; - background: url(./../images/teacher/diemdanh/ico_dropdown_red.png) 96% / 18px - no-repeat transparent; + background: url(./../images/teacher/diemdanh/ico_dropdown_red.png) 96% / 18px no-repeat transparent; position: absolute; top: 12px; right: 10px; @@ -8959,16 +8952,14 @@ ul.pagination li:hover a { content: ""; width: 24px; height: 14px; - background: url(./../images/teacher/diemdanh/ico_dropdown_blue.png) 90% / 24px - no-repeat transparent; + background: url(./../images/teacher/diemdanh/ico_dropdown_blue.png) 90% / 24px no-repeat transparent; position: absolute; top: 19px; right: 8px; } .btn-ob .select-styled.active:after { - background: url(./../images/teacher/diemdanh/ico_dropup_blue.png) 90% / 24px - no-repeat transparent; + background: url(./../images/teacher/diemdanh/ico_dropup_blue.png) 90% / 24px no-repeat transparent; } .hoc-ky.btn-ob { @@ -8994,6 +8985,7 @@ ul.pagination li:hover a { .he-so.btn-ob .select-options { z-index: 5; } + .uk-modal { z-index: 99999; } @@ -9034,7 +9026,7 @@ ul.pagination li:hover a { margin-top: -4px; } -.medium-title .wh20.chk-custom-gr input:checked + label:after { +.medium-title .wh20.chk-custom-gr input:checked+label:after { top: -10px; } @@ -9163,14 +9155,14 @@ ul.pagination li:hover a { margin-right: 0; } -.checbox-right .wh20.chk-custom-gr input:checked + label:after { +.checbox-right .wh20.chk-custom-gr input:checked+label:after { left: auto; right: 5px; top: -6px; } /* Check box assigned */ -.wh20.check-assigned input:checked + label:after { +.wh20.check-assigned input:checked+label:after { /* top: -5px; */ top: -8px; left: 8px; @@ -9180,7 +9172,7 @@ ul.pagination li:hover a { } /* Check box student */ -.wh20.check-select-student input:checked + label:after { +.wh20.check-select-student input:checked+label:after { /* top: -5px; */ top: -6px; left: 8px; @@ -9190,7 +9182,7 @@ ul.pagination li:hover a { } /* Check box select all */ -.checbox-right .wh20.check-select-student input:checked + label:after { +.checbox-right .wh20.check-select-student input:checked+label:after { left: auto; right: 2px; top: -8px; @@ -9240,10 +9232,7 @@ ul.pagination li:hover a { border-top-left-radius: 35px; } -.giaotrinh.unit.student - .unit-list - .unit-giaotrinh-content.active - .unit-more-info { +.giaotrinh.unit.student .unit-list .unit-giaotrinh-content.active .unit-more-info { border-bottom: none; } @@ -9456,7 +9445,7 @@ ul.pagination li:hover a { cursor: pointer; } -.laplai p > input[type="radio"]:checked + *::before { +.laplai p>input[type="radio"]:checked+*::before { border-color: #84c241; } @@ -10443,10 +10432,7 @@ ul.pagination li:hover a { padding: 30px 20px 0; } -.ldjas - .giaotrinh.teacher-giaobai - .giaotrinh.filter - .sunE-giaotrinh-resuft-filter { +.ldjas .giaotrinh.teacher-giaobai .giaotrinh.filter .sunE-giaotrinh-resuft-filter { height: calc(100vh - 290px); } @@ -11279,7 +11265,7 @@ strong { #keepReviewPersonal[type="checkbox"] { accent-color: #00a69c !important; - } +} .container-page-header { height: calc(100vh - var(--height-header)); diff --git a/src/_components/Header/index.js b/src/_components/Header/index.js index a096c58..304077d 100644 --- a/src/_components/Header/index.js +++ b/src/_components/Header/index.js @@ -9,30 +9,37 @@ export default function Header({ icon, title, subtitles = [], manager = false, i const authentication = useSelector((state) => state.authentication); const { fullname, organization_name, role } = authentication?.user || {}; const hasFullName = fullname || organization_name; + const isSGD = authentication?.user?.organization_name?.toLowerCase().includes('sở'); + const organizationName = authentication?.user?.organization_name?.toLowerCase() || ''; + const keywords = ['sở', 'phòng']; + const isManager = keywords.some(keyword => organizationName.includes(keyword)); - const handleFullName = () =>{ - let fullName - if(manager){ - fullName = 'Giám đốc ' + hasFullName - }else{ - fullName = role === "organization_admin" - ? `${organization_name ? 'Hiệu trưởng ' : ''}${hasFullName}` - : fullname; + + + const handleFullName = () => { + if (manager || isManager) { + return `${isSGD ? 'Giám đốc' : 'Trưởng phòng'} ${hasFullName}`; } - return fullName + + if (role === "organization_admin") { + return `${organization_name ? 'Hiệu trưởng ' : ''}${hasFullName}`; + } + + return fullname; } + return (