Исправлены стили страницы Сообщений

src/pages/Telemetry/Messages.jsx

@@ -11,7 +11,7 @@ import { makeColumn, makeDateColumn, makeNumericColumn, makeNumericSorter, makeT
 import { wrapPrivateComponent } from '@utils'
 import { MessageService } from '@api'
 
-import '@styles/message.css'
+import '@styles/message.less'
 
 const pageSize = 26
 const { Search } = Input
@@ -103,14 +103,16 @@ const Messages = memo(() => {
   return (
     <>
       <div className={'filter-group'}>
-        <h3 className={'filter-group-heading'}>Фильтр сообщений</h3>
+        <h3 className={'head'}>Фильтр сообщений</h3>
+        <div className={'body'}>
           <Select
-          mode={'multiple'}
             allowClear
+            mode={'multiple'}
+            className={'type-filter'}
             placeholder={'Фильтр сообщений'}
-          className={'filter-selector'}
+            onChange={setCategories}
             value={categories}
-          onChange={setCategories}>
+          >
             {children}
           </Select>
           <RangePicker showTime onChange={(range) => setRange(range)} />
@@ -120,6 +122,7 @@ const Messages = memo(() => {
             onSearch={onChangeSearchString}
           />
         </div>
+      </div>
       <LoaderPortal show={showLoader}>
         <Table
           columns={columns}

src/pages/Telemetry/TelemetryView/ActiveMessagesOnline.jsx

@@ -9,7 +9,7 @@ import { MessageService } from '@api'
 
 import { makeMessageColumns } from '../Messages'
 
-import '@styles/message.css'
+import '@styles/message.less'
 
 export const ActiveMessagesOnline = memo(({ well: givenWell }) => {
   const [messages, setMessages] = useState([])

src/pages/Telemetry/TelemetryView/index.jsx

@@ -32,7 +32,7 @@ import SpinPicEnabled from '@images/SpinEnabled.png'
 import SpinPicDisabled from '@images/SpinDisabled.png'
 
 import '@styles/monitoring.less'
-import '@styles/message.css'
+import '@styles/message.less'
 
 const { Option } = Select
 

src/styles/App.less

@@ -140,9 +140,3 @@ html {
 tr.table_row_size {
   height: 10px;
 }
-
-.filter-selector {
-  width: 25%;
-  margin-right: 5px;
-  margin-left: 5px;
-}

src/styles/message.less

@@ -41,13 +41,27 @@
 
 .filter-group {
   margin: 0 0 5px 0;
-}
 
-.filter-group-heading {
+  & .head {
     margin: 5px auto;
     align-items: center;
   }
 
+  & .body {
+    width: 100%;
+    display: flex;
+    gap: 5px;
+
+    & .type-filter {
+      width: 25%;
+    }
+
+    & .filter-selector {
+      flex: 1;
+    }
+  }
+}
+
 td.ant-table-column-sort {
   color: black;
   background-color: #fafafa;