diff --git a/src/components/mui/search-input.js b/src/components/mui/search-input.js index 428d1235..fd0527d8 100644 --- a/src/components/mui/search-input.js +++ b/src/components/mui/search-input.js @@ -83,7 +83,10 @@ const SearchInput = ({ term, onSearch, placeholder = "Search...", debounced }) = "& .MuiOutlinedInput-root": { height: "36px", paddingX: 1 - }, + }, + "& .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline": { borderColor: "rgba(0, 0, 0, 0.23)" }, + "& .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline": { borderColor: "rgba(0, 0, 0, 0.23)" }, + "& .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline": { borderColor: "primary.main" } }} /> ); diff --git a/src/utils/theme.js b/src/utils/theme.js new file mode 100644 index 00000000..6a4816ec --- /dev/null +++ b/src/utils/theme.js @@ -0,0 +1,49 @@ +/** + * Copyright 2026 OpenStack Foundation + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * */ + +import { createTheme } from "@mui/material/styles"; +import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown"; + +const uiCoreThemeOverrides = { + components: { + MuiOutlinedInput: { + styleOverrides: { + notchedOutline: { + borderColor: "#000" + }, + root: { + "&:hover .MuiOutlinedInput-notchedOutline": { + borderColor: "#000" + }, + "&.Mui-focused .MuiOutlinedInput-notchedOutline": { + borderColor: "#000" + } + } + } + }, + MuiSelect: { + defaultProps: { + IconComponent: KeyboardArrowDownIcon + }, + styleOverrides: { + icon: { + fontSize: "24px", + width: "24px", + height: "24px" + } + } + } + } +}; + +export const CustomThemeBase = createTheme(uiCoreThemeOverrides); diff --git a/webpack.common.js b/webpack.common.js index 6ff660ce..35385816 100644 --- a/webpack.common.js +++ b/webpack.common.js @@ -168,6 +168,7 @@ module.exports = { 'utils/money': './src/utils/money.js', 'utils/use-event-callback': './src/utils/use-event-callback.js', 'utils/external-store': './src/utils/external-store.js', + 'utils/theme': './src/utils/theme.js', }, output: { path: path.resolve(__dirname, 'lib'),