diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-tabs.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-tabs.tsx index ecc1cbdf7f..6eb92fe953 100644 --- a/services/web/frontend/js/features/review-panel-new/components/review-panel-tabs.tsx +++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-tabs.tsx @@ -1,28 +1,34 @@ import { Dispatch, FC, memo, SetStateAction } from 'react' import classnames from 'classnames' import { SubView } from '../components/review-panel' +import MaterialIcon from '@/shared/components/material-icon' +import { useTranslation } from 'react-i18next' const ReviewPanelTabs: FC<{ subView: SubView setSubView: Dispatch> }> = ({ subView, setSubView }) => { + const { t } = useTranslation() + return ( <> ) diff --git a/services/web/frontend/stylesheets/app/editor/review-panel-new.less b/services/web/frontend/stylesheets/app/editor/review-panel-new.less index dbd43f07a0..504e1439a1 100644 --- a/services/web/frontend/stylesheets/app/editor/review-panel-new.less +++ b/services/web/frontend/stylesheets/app/editor/review-panel-new.less @@ -438,12 +438,38 @@ .review-panel-footer { position: fixed; - top: calc(var(--review-panel-bottom) - 66px); + height: 60px; + top: calc(var(--review-panel-bottom) - 100px); width: var(--review-panel-width); z-index: 2; - background: @rp-bg-dim-blue; + background-color: white; border-top: 1px solid #d9d9d9; display: flex; + + .review-panel-tab { + flex: 0 0 50%; + padding: 6px 0; + display: flex; + flex-direction: column; + align-items: center; + gap: 4px; + border: 0; + border-top: solid 3px transparent; + background: none; + color: @content-secondary; + font-size: @font-size-02; + + &:hover, + &:focus { + text-decoration: none; + color: @content-primary; + } + + &-active { + color: @content-primary; + border-top: solid 3px @green-50; + } + } } .review-panel-add-comment-textarea {