[251006] feat 아래 탭 컨테이너에 화살표 아이콘 추가
아래 탭 컨테이너에 화살표 아이콘을 삽입해 UI 가시성을 높였습니다. 🕐 커밋 시간: 2025. 10. 06. 15:44:52 📊 변경 통계: • 총 파일: 3개 • 추가: +10줄 • 삭제: -4줄 📁 추가된 파일: + com.twin.app.shoptime/assets/images/player/icon_tabcontainer_arrow_down.png 📝 수정된 파일: ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/v2/BelowTabContainer.jsx ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/v2/BelowTabContainer.module.less
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 888 B |
@@ -6,6 +6,7 @@ import Spottable from '@enact/spotlight/Spottable';
|
|||||||
|
|
||||||
import CustomImage from '../../../../components/CustomImage/CustomImage';
|
import CustomImage from '../../../../components/CustomImage/CustomImage';
|
||||||
import css from './BelowTabContainer.module.less';
|
import css from './BelowTabContainer.module.less';
|
||||||
|
import icon_arrow_dwon from '../../../../../assets/images/player/icon_tabcontainer_arrow_down.png';
|
||||||
|
|
||||||
const SpottableDiv = Spottable('div');
|
const SpottableDiv = Spottable('div');
|
||||||
|
|
||||||
@@ -70,7 +71,9 @@ export default function BelowTabContainer({
|
|||||||
spotlightId="below-tab-live-channel-button"
|
spotlightId="below-tab-live-channel-button"
|
||||||
>
|
>
|
||||||
<span className={css.buttonText}>LIVE CHANNEL</span>
|
<span className={css.buttonText}>LIVE CHANNEL</span>
|
||||||
<div className={css.arrowIcon} />
|
<div className={css.arrowIcon}>
|
||||||
|
<img src={icon_arrow_dwon} alt="arrow down" />
|
||||||
|
</div>
|
||||||
</SpottableDiv>
|
</SpottableDiv>
|
||||||
|
|
||||||
<div className={css.channelList}>
|
<div className={css.channelList}>
|
||||||
|
|||||||
@@ -57,8 +57,11 @@
|
|||||||
|
|
||||||
.arrowIcon {
|
.arrowIcon {
|
||||||
.size(@w: 26.25px, @h: 15.63px);
|
.size(@w: 26.25px, @h: 15.63px);
|
||||||
background: @COLOR_WHITE;
|
img {
|
||||||
// 실제 화살표 아이콘이 필요한 경우 background-image로 대체
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|||||||
Reference in New Issue
Block a user