Skip to content

X
xiaomai-cloud-class-web
Commit 1ef4e25e by zhangleyuan
Options

style:修改样式

parent 82172d09
Showing with 40 additions and 20 deletions
src/modules/home/Home.less
.home-page { .home-page {
padding: 0 16px 16px; padding: 0 16px 16px;
min-width: 1100px; min-width: 1100px;
position: relative;
z-index:3;
.g2-tooltip-marker { .g2-tooltip-marker {
border-radius: 50% !important; border-radius: 50% !important;
} }
......
src/modules/root/Header.jsx
/* /*
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2019-09-10 18:26:03 * @Date: 2019-09-10 18:26:03
* @LastEditors: zhangleyuan * @LastEditors: Please set LastEditors
* @LastEditTime: 2021-05-10 10:34:13 * @LastEditTime: 2021-05-21 15:32:08
* @Description: * @Description:
*/ */
import React, { useRef, useContext, useEffect, useState } from "react"; import React, { useRef, useContext, useEffect, useState } from "react";
...@@ -219,9 +219,9 @@ function Header(props) { ...@@ -219,9 +219,9 @@ function Header(props) {
<div id="top-container" className="top-container"> <div id="top-container" className="top-container">
<div className="top top-nav"> <div className="top top-nav">
<div> <div>
{menuType ? <img src='https://image.xiaomaiketang.com/xm/fe4NCjr7XF.png' className="logo" alt="" />:<img src="https://image.xiaomaiketang.com/xm/c4KiP2epBP.png" className="logo" alt="" />} <img src='https://image.xiaomaiketang.com/xm/WEsMPAYxAs.png' className="logo" alt="" />
</div> </div>
{menuType ? ( {/* {menuType ? (
<span <span
className="icon iconfont cursor ml20 handLike" className="icon iconfont cursor ml20 handLike"
onClick={handleMenu} onClick={handleMenu}
...@@ -235,7 +235,7 @@ function Header(props) { ...@@ -235,7 +235,7 @@ function Header(props) {
> >
&#xe615; &#xe615;
</span> </span>
)} )} */}
<div className="message-help"> <div className="message-help">
{list.length ? ( {list.length ? (
<ClickOutside <ClickOutside
...@@ -313,6 +313,9 @@ function Header(props) { ...@@ -313,6 +313,9 @@ function Header(props) {
</div> </div>
)} )}
<div className="right-box"> <div className="right-box">
<div class="right-bg-img">
<img src="https://image.xiaomaiketang.com/xm/WCwjyyXYda.png"></img>
</div>
<div className="link-to-store"> <div className="link-to-store">
<div className="link"> <div className="link">
<span className="icon iconfont tool-tip-right">&#xe85d;</span> <span className="icon iconfont tool-tip-right">&#xe85d;</span>
......
src/modules/root/Header.less
@import "../../core/variables.less"; @import "../../core/variables.less";
@top-height: 50px; @top-height: 60px;
@icon-color: #939393; @icon-color: #939393;
.top-container { .top-container {
position: absolute; position: absolute;
...@@ -7,8 +7,16 @@ ...@@ -7,8 +7,16 @@
left: 0; left: 0;
right: 0; right: 0;
height: @top-height; height: @top-height;
background-color: #fff; background-color: #2966FF;
z-index: 112; z-index:2;
&::after{
content:'';
width:100%;
height:60px;
background: linear-gradient(180deg, #2966FF 0%, rgba(41, 102, 255, 0.82) 29%, rgba(41, 102, 255, 0.58) 55%, rgba(41, 102, 255, 0.27) 77%, rgba(7, 78, 255, 0) 100%);
position:absolute;
z-index:2;
}
.logo { .logo {
display: inline-block; display: inline-block;
height: 30px; height: 30px;
...@@ -193,7 +201,7 @@ ...@@ -193,7 +201,7 @@
cursor: pointer; cursor: pointer;
} }
.college-name { .college-name {
color: #666; color:#FFFFFF;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
...@@ -202,9 +210,9 @@ ...@@ -202,9 +210,9 @@
.icon { .icon {
font-size: 14px; font-size: 14px;
margin-left: 8px; margin-left: 8px;
color: #8c8e93; color: #FFF;
&:hover { &:hover {
color: #555; color:#FFF;
} }
} }
} }
...@@ -292,18 +300,24 @@ ...@@ -292,18 +300,24 @@
display: flex; display: flex;
align-items: center; align-items: center;
} }
.right-bg-img{
img{
width:277px;
height:60px;
}
}
.link-to-store { .link-to-store {
display: flex; display: flex;
height: 49px; height: 49px;
line-height: 49px; line-height: 49px;
.text { .text {
font-size: 14px; font-size: 14px;
color: #666; color: #FFF;
line-height: 49px; line-height: 49px;
margin-left: 7px; margin-left: 7px;
} }
.iconfont { .iconfont {
color: #8c8e93; color: #FFF;
&:hover { &:hover {
color: #555; color: #555;
} }
...@@ -501,6 +515,7 @@ ...@@ -501,6 +515,7 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
color:#FFF;
} }
} }
} }
......
src/modules/root/Main.less
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
@import '../../core/global.less'; @import '../../core/global.less';
@import '../../core/filter.less'; @import '../../core/filter.less';
@top-height: 50px; @top-height: 60px;
.right-container { .right-container {
position: absolute; position: absolute;
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
bottom: 0; bottom: 0;
background-color: #f0f2f5; background-color: #f0f2f5;
overflow-x: scroll; overflow-x: scroll;
z-index: 1; // z-index: 1;
&.right-container-vertical{ &.right-container-vertical{
left:@xm-left-min-width; left:@xm-left-min-width;
.page{ .page{
......
src/modules/root/Menu.less
@import '../../core/variables.less'; @import '../../core/variables.less';
@top-height: 50px; @top-height: 60px;
@menu-bakg: #2B2E37; @menu-bakg: #FFF;
@active-color: #2966FF; @active-color: #2966FF;
.left-container { .left-container {
position: absolute; position: absolute;
...@@ -11,10 +11,11 @@ ...@@ -11,10 +11,11 @@
bottom: 0; bottom: 0;
width: @xm-left-width; width: @xm-left-width;
background: @menu-bakg; background: @menu-bakg;
color: #FFFFFF; color: #333;
.ant-menu { .ant-menu {
padding-left: 0 !important; padding-left: 0 !important;
background: transparent; // background: transparent;
background: #FFF !important;
} }
.left { .left {
-webkit-user-select: none; -webkit-user-select: none;
......
src/modules/root/Menu.tsx
...@@ -56,7 +56,6 @@ function Aside(props: any) { ...@@ -56,7 +56,6 @@ function Aside(props: any) {
selectedKeys={selectKey} selectedKeys={selectKey}
openKeys={openKeys} openKeys={openKeys}
onOpenChange={onOpenChange} onOpenChange={onOpenChange}
theme="dark"
inlineCollapsed={false} inlineCollapsed={false}
mode={menuType ? "inline" : "vertical"} mode={menuType ? "inline" : "vertical"}
> >
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment