.

src/assets/css/custom.css

@@ -739,5 +739,7 @@ background-size: 75% auto;
 .m_ft_box{flex:0 0 49%}
 .m_ft_box + .m_ft_box{margin-left:1%}
 
-.layer-content-box .history-btn{border-radius:4px;display:block;width:100%;height:45px;line-height:45px;text-align:center;font-size: 0.875rem;color:#ddd;font-weight:400;}
+.layer-content-box .history-btn{border-radius:4px;display:block;width:100%;height:45px;line-height:45px;text-align:center;font-size: 0.875rem;color:#ddd;font-weight:500;}
-.layer-content-box .history-btn:hover{border-radius:4px;background:#7367f0;border-color:#7367f0;transition: 0.3s ease;-webkit-transition: 0.3s ease;}
+.layer-content-box .history-btn:hover{border-radius:4px;background:#00cfe8;border-color:#00cfe8;transition: 0.3s ease;-webkit-transition: 0.3s ease;}
+.historyModal .drone-ti span{font-weight:500;margin-top:6px}
+.historyModal .drone-name{color:#00cfe8;margin:0 10px 0 0;}

src/views/control/report/ControlReportDetail.js

@@ -58,10 +58,14 @@ const ControlReportDetail = props => {
         <Modal
           isOpen={historyModal}
           toggle={() => setHistoryModal(!historyModal)}
-          className='modal-dialog-centered'
+          className='modal-dialog-centered historyModal'
         >
           <ModalHeader toggle={() => setHistoryModal(!historyModal)}>
-          (기체명) 비정상상황 알림내역
+          <div className='drone-ti'>
+            <span className="drone-name">DRONE01</span>
+            <span>알림내역</span>
+          </div>
+        
           </ModalHeader>
           <ModalBody>
             <table className='table pal-table'>
@@ -79,7 +83,7 @@ const ControlReportDetail = props => {
           </ModalBody>
           <ModalFooter>
             <Button
-              color='primary'
+              color='info'
               onClick={() => setHistoryModal(!historyModal)}
             >
               확인