.TradingAlertBox { width: 100%; box-sizing: border-box; // padding: 0 20px; // margin-top: 20px; .TradingAlertNewBox { width: 100%; // margin-top: 21px; box-sizing: border-box; padding: 20px; display: flex; align-items: center; justify-content: space-between; background-image: url('../../../../assets/image/tradingBg.png'); background-repeat: no-repeat; background-size: 100% 100%; .TradingAlertNewBoxItem { width: calc(100% / 3); display: flex; align-items: center; justify-content: flex-start; .TradingAlertNewBoxItemTemplate { width: 100%; display: flex; flex-direction: column; align-items: center; .TradingAlertNewBoxItemValue { font-family: DINAlternate, DINAlternate; font-weight: bold; font-size: 25px; color: #FEC003; line-height: 25px; letter-spacing: 1px; text-align: right; font-style: normal; } .TradingAlertNewBoxItemLabel { font-family: SourceHanSansSC, SourceHanSansSC; font-weight: 400; font-size: 14px; color: #D9E7FF; line-height: 14px; letter-spacing: 1px; text-align: right; font-style: normal; margin-top: 9px; } } } } // .TradingAlertBox { // width: 100%; // display: flex; // align-items: center; // justify-content: space-between; // .TradingAlertItem { // width: calc((100% - 10px)/2); // box-sizing: border-box; // padding: 10px 15px; // display: flex; // align-items: center; // background: linear-gradient(0, rgba(0, 148, 255, 0.1) 0%, rgba(0, 148, 255, 0) 100%); // .TradingAlertItemLeft { // width: 46px; // height: 46px; // margin-right: 10px; // .TradingAlertItemLeftIcon { // width: 46px; // height: 46px; // } // } // .TradingAlertItemRight { // flex: 1; // .TradingAlertItemRightLabel { // font-family: Microsoft YaHei, Microsoft YaHei; // font-weight: 400; // font-size: 14px; // color: #FFFFFF; // text-align: left; // font-style: normal; // } // .TradingAlertItemRightValueBox { // display: flex; // align-items: flex-end; // justify-content: flex-end; // .TradingAlertItemRightValue { // font-family: Impact, Impact; // font-weight: 400; // font-size: 25px; // color: #FFFFFF; // letter-spacing: 2px; // text-align: right; // font-style: normal; // } // .OverviewOfServiceAreaBusyContentItemRightUnit { // font-family: Inter, Inter; // font-weight: 400; // font-size: 12px; // color: #808A96; // text-align: right; // font-style: normal; // text-transform: none; // margin-left: 10px; // } // } // } // } // } .TradingAlertListBox { width: 100%; height: 120px; margin-top: 12px; .TradingAlertItemHeaderBox { width: 100%; background: linear-gradient(90deg, rgba(69, 97, 130, 0.33) 0%, rgba(69, 97, 130, 0.33) 100%); box-sizing: border-box; padding: 7px 0 9px 32px; display: flex; align-items: center; .leftItemLabel, .leftItemLabel2, .leftItemValue { width: calc((100% - 32px) / 3); font-family: OPPOSans, OPPOSans; font-weight: normal; font-size: 15px; color: #94DCEF; line-height: 17px; text-align: left; font-style: normal; } } .TradingAlertItem { width: 100%; box-sizing: border-box; padding: 7px 0 9px 32px; display: flex; align-items: center; background-color: rgba(168, 172, 171, 0.08); margin: 2px 0; .leftItemLabel, .leftItemLabel2, .leftItemValue { width: calc((100% - 32px) / 3); font-family: OPPOSans, OPPOSans; font-weight: normal; font-size: 13px; color: #E4F3FF; line-height: 17px; text-align: left; font-style: normal; } // .leftItemLabel { // width: 60%; // font-family: Microsoft YaHei, Microsoft YaHei; // font-weight: 400; // font-size: 12px; // color: #FFFFFF; // text-align: left; // font-style: normal; // } // .rightItemLabel { // font-family: Microsoft YaHei, Microsoft YaHei; // font-weight: 400; // font-size: 12px; // color: #FF0000; // text-align: right; // font-style: normal; // text-transform: none; // } } } }