Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
JDChain
Explorer
提交
e0d3ed02
E
Explorer
项目概览
JDChain
/
Explorer
通知
0
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
E
Explorer
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
e0d3ed02
编写于
5月 29, 2019
作者:
W
wangzhe18
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
完善菜单在移动端的显示效果
上级
59f8a3d7
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
74 addition
and
44 deletion
+74
-44
src/web/components/header/header.js
src/web/components/header/header.js
+2
-1
src/web/components/header/header.scss
src/web/components/header/header.scss
+64
-32
src/web/components/header/header.t.html
src/web/components/header/header.t.html
+8
-11
src/web/images/logo_color.png
src/web/images/logo_color.png
+0
-0
src/web/images/logo_mini.png
src/web/images/logo_mini.png
+0
-0
未找到文件。
src/web/components/header/header.js
浏览文件 @
e0d3ed02
...
@@ -7,6 +7,7 @@ import { Drawer} from 'antd';
...
@@ -7,6 +7,7 @@ import { Drawer} from 'antd';
import
{
copyToClipboard
,
tranBase58
,
numToalgorithm
}
from
'
../.././../utils/util
'
;
import
{
copyToClipboard
,
tranBase58
,
numToalgorithm
}
from
'
../.././../utils/util
'
;
import
Notification
from
'
../.././../utils/notification
'
;
import
Notification
from
'
../.././../utils/notification
'
;
import
Message
from
'
flarej/lib/components/antd/message
'
;
import
Message
from
'
flarej/lib/components/antd/message
'
;
import
logo
from
'
../../images/logo_color.png
'
;
import
'
flarej/lib/components/antd/menu
'
;
import
'
flarej/lib/components/antd/menu
'
;
import
'
flarej/lib/components/antd/select
'
;
import
'
flarej/lib/components/antd/select
'
;
import
'
flarej/lib/components/antd/icon
'
;
import
'
flarej/lib/components/antd/icon
'
;
...
@@ -55,7 +56,7 @@ export default class Header extends Component {
...
@@ -55,7 +56,7 @@ export default class Header extends Component {
// asdf
// asdf
// </div>
// </div>
<
div
>
<
div
>
menu
<
img
src
=
{
logo
}
/
>
<
/div
>
<
/div
>
)
)
...
...
src/web/components/header/header.scss
浏览文件 @
e0d3ed02
...
@@ -10,6 +10,22 @@
...
@@ -10,6 +10,22 @@
display
:
flex
;
display
:
flex
;
flex
:
auto
0
0
;
flex
:
auto
0
0
;
.minimenu
{
flex
:
1
;
display
:
none
;
text-align
:
center
;
.menuDr
{
line-height
:
70px
;
color
:
#fff
;
font-size
:
24px
;
}
@media
(
max-width
:
575px
)
{
display
:
block
;
}
}
.nav
{
.nav
{
font-size
:
0
.875rem
;
font-size
:
0
.875rem
;
margin-left
:
50px
;
margin-left
:
50px
;
...
@@ -18,26 +34,24 @@
...
@@ -18,26 +34,24 @@
color
:
#fff
;
color
:
#fff
;
border
:
0
;
border
:
0
;
flex
:
1
;
flex
:
1
;
@media
(
max-width
:
950
px
){
@media
(
max-width
:
745
px
){
margin-left
:
0
;
margin-left
:
0
;
}
@media
(
max-width
:
575px
){
display
:
none
;
display
:
none
;
}
}
// @media (max-width:500px) {
// display: none;
li
{
// // .menuDr {
color
:
#fff
!
important
;
// // display: block;
font-size
:
16px
;
// // }
line-height
:
61px
;
// }
margin
:
0px
;
li
{
&
:hover
{
color
:
#fff
!
important
;
background
:
#3C4C9C
!
important
;
font-size
:
16px
;
line-height
:
61px
;
margin
:
0px
;
&
:hover
{
background
:
#3C4C9C
!
important
;
}
}
}
}
}
}
.logo
{
.logo
{
margin
:
16px
0
16px
24px
;
margin
:
16px
0
16px
24px
;
float
:
left
;
float
:
left
;
...
@@ -45,35 +59,29 @@
...
@@ -45,35 +59,29 @@
width
:
159px
;
width
:
159px
;
background-image
:
url('../../images/logo.png')
;
background-image
:
url('../../images/logo.png')
;
background-repeat
:
no-repeat
;
background-repeat
:
no-repeat
;
@media
(
max-width
:
745px
)
{
width
:
36px
;
background-image
:
url('../../images/logo_mini.png')
;
background-repeat
:
no-repeat
;
}
}
}
.color
{
.color
{
color
:
'red'
color
:
'red'
;
}
.menuDr
{
line-height
:
62px
;
display
:
none
;
margin
:
2px
0
0
10px
;
color
:
#fff
;
@media
(
max-width
:
950px
)
{
display
:
block
;
}
}
}
.note
{
.note
{
color
:
#fff
;
color
:
#fff
;
float
:right
;
float
:
right
;
padding
:
15px
;
padding
:
15px
;
font-size
:
14px
;
font-size
:
14px
;
color
:
#ADC6FF
;
color
:
#ADC6FF
;
line-height
:
14px
;
line-height
:
14px
;
display
:
flex
;
display
:
flex
;
align-items
:
center
;
align-items
:
center
;
@media
(
max-width
:
950px
)
and
(
min-width
:
501px
)
{
@media
(
max-width
:
430px
)
{
display
:
none
;
padding-left
:
0
;
}
}
.value
{
.value
{
width
:
200px
;
width
:
200px
;
border
:
1px
solid
#ADC6FF
;
border
:
1px
solid
#ADC6FF
;
...
@@ -89,6 +97,11 @@
...
@@ -89,6 +97,11 @@
margin-left
:
5px
;
margin-left
:
5px
;
cursor
:
pointer
;
cursor
:
pointer
;
}
}
.t
{
@media
(
max-width
:
430px
)
{
display
:
none
;
}
}
}
}
&
.isMenuOpen
>
ul
{
&
.isMenuOpen
>
ul
{
padding-left
:
0
;
padding-left
:
0
;
...
@@ -171,17 +184,19 @@
...
@@ -171,17 +184,19 @@
display
:
flex
;
display
:
flex
;
justify-content
:
center
;
justify-content
:
center
;
align-items
:
center
;
align-items
:
center
;
font-family
:
MicrosoftYaHei
;
font-family
:
'MicrosoftYaHei'
;
font-size
:
12px
;
font-size
:
12px
;
color
:
#999999
;
color
:
#999999
;
.linker
{
.linker
{
text-decoration
:
none
;
text-decoration
:
none
;
color
:
#5A77D3
;
color
:
#5A77D3
;
}
}
.linker
:hover
{
.linker
:hover
{
color
:
#5A77D3
;
color
:
#5A77D3
;
}
}
}
}
}
}
.gl
{
.gl
{
...
@@ -214,4 +229,21 @@
...
@@ -214,4 +229,21 @@
color
:
#374159
;
color
:
#374159
;
line-height
:
25px
;
line-height
:
25px
;
margin
:
30px
auto
15px
auto
;
margin
:
30px
auto
15px
auto
;
}
.lefmenu
{
border-right
:
0
;
}
.leftdrawer
{
.ant-drawer-body
{
padding
:
0
;
}
}
.ledgers
{
@media
(
max-width
:
1260px
)
{
width
:
200px
;
}
}
}
\ No newline at end of file
src/web/components/header/header.t.html
浏览文件 @
e0d3ed02
<header
class=
"site-header"
>
<header
class=
"site-header"
>
<div
class=
"logo"
>
<div
class=
"logo"
>
</div>
</div>
<ant-Icon
class=
"menuDr"
type=
"menu"
onClick=
{handleMenuShow}/
>
<div
class=
"minimenu"
>
<ant-Icon
class=
"menuDr"
type=
"menu"
onClick=
{handleMenuShow}/
>
</div>
<ant-Menu
mode=
"horizontal"
class=
"nav"
selectedKeys=
{store.header.selectMenu}
onClick=
{CheckMenu}
>
<ant-Menu
mode=
"horizontal"
class=
"nav"
selectedKeys=
{store.header.selectMenu}
onClick=
{CheckMenu}
>
<!-- <ant-MenuItem key="search"> <ant-Icon type="home" />首页</ant-MenuItem>
<!-- <ant-MenuItem key="search"> <ant-Icon type="home" />首页</ant-MenuItem>
<ant-MenuItem key="account"> <ant-Icon type="switcher" />数据账户</ant-MenuItem>
<ant-MenuItem key="account"> <ant-Icon type="switcher" />数据账户</ant-MenuItem>
...
@@ -13,11 +15,11 @@
...
@@ -13,11 +15,11 @@
</
#
each>
</
#
each>
</ant-Menu>
</ant-Menu>
<div
class=
"note"
>
<div
class=
"note"
>
账本:
<span
class=
"t"
>
账本:
</span>
<!-- <ant-Select placeholder="请选择账本" class={styles.value} >
<!-- <ant-Select placeholder="请选择账本" class={styles.value} >
<ant-Option value="64hnH4a8n48LeEP5HU2bMWmNxUPcaZ1JRCehRwvuNS8Ty" >64hnH4a8n48LeEP5HU2bMWmNxUPcaZ1JRCehRwvuNS8Ty</ant-Option>
<ant-Option value="64hnH4a8n48LeEP5HU2bMWmNxUPcaZ1JRCehRwvuNS8Ty" >64hnH4a8n48LeEP5HU2bMWmNxUPcaZ1JRCehRwvuNS8Ty</ant-Option>
</ant-Select> -->
</ant-Select> -->
<ant-Select
value=
"{common.defaultledger}"
onChange=
{handleSelectChange}
>
<ant-Select
value=
"{common.defaultledger}"
onChange=
{handleSelectChange}
class=
"ledgers"
>
<
#each
{{
common.ledgers
}}
>
<
#each
{{
common.ledgers
}}
>
<ant-Option
key=
"{@index}"
value=
"{{value}}"
>
{{value}}
</ant-Option>
<ant-Option
key=
"{@index}"
value=
"{{value}}"
>
{{value}}
</ant-Option>
</
#
each>
</
#
each>
...
@@ -111,16 +113,11 @@
...
@@ -111,16 +113,11 @@
placement=
"left"
placement=
"left"
visible=
{showMenu}
visible=
{showMenu}
onClose=
{handleMenuHide}
onClose=
{handleMenuHide}
closable=
{
tru
e}
closable=
{
fals
e}
maskClosable=
{true}
maskClosable=
{true}
style=
"padding:0"
class=
"leftdrawer"
>
>
<ant-Menu
mode=
"vertical"
selectedKeys=
{store.header.selectMenu}
onClick=
{CheckMenu}
>
<ant-Menu
mode=
"vertical"
selectedKeys=
{store.header.selectMenu}
onClick=
{CheckMenu}
class=
"lefmenu"
>
<!-- <ant-MenuItem key="search"> <ant-Icon type="home" />首页</ant-MenuItem>
<ant-MenuItem key="account"> <ant-Icon type="switcher" />数据账户</ant-MenuItem>
<ant-MenuItem key="3"> <ant-Icon type="block" />区块</ant-MenuItem>
<ant-MenuItem key="4"> <ant-Icon type="swap" />交易</ant-MenuItem>
<ant-MenuItem key="user"> <ant-Icon type="user" />用户</ant-MenuItem> -->
<
#each
{
store.header.menuData
}
>
<
#each
{
store.header.menuData
}
>
<ant-MenuItem
key=
{path}
>
<ant-Icon
type=
{icon}
/>
{name}
</ant-MenuItem>
<ant-MenuItem
key=
{path}
>
<ant-Icon
type=
{icon}
/>
{name}
</ant-MenuItem>
</
#
each>
</
#
each>
...
...
src/web/images/logo_color.png
0 → 100644
浏览文件 @
e0d3ed02
5.1 KB
src/web/images/logo_mini.png
0 → 100644
浏览文件 @
e0d3ed02
1.8 KB
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录