diff --git a/src/routes/Dashboard/Workplace.js b/src/routes/Dashboard/Workplace.js index afa32402be8d98878ebfcb816ce45d1a5bd4a38c..83896cc5461d65d317ef85cf163dcb11c5ba6b2b 100644 --- a/src/routes/Dashboard/Workplace.js +++ b/src/routes/Dashboard/Workplace.js @@ -148,17 +148,17 @@ export default class Workplace extends PureComponent { ); - const pageHeaderExtra = ( -
-
+ const extraContent = ( +
+

项目数

56

-
+

团队内排名

8 / 24

-
+

项目访问

2,223

@@ -168,7 +168,7 @@ export default class Workplace extends PureComponent { return ( diff --git a/src/routes/Dashboard/Workplace.less b/src/routes/Dashboard/Workplace.less index 12c4d8150412876812db8c0b918fae14a844bccc..4c8752927e40435003aa0e3944e70ae8f3162801 100644 --- a/src/routes/Dashboard/Workplace.less +++ b/src/routes/Dashboard/Workplace.less @@ -40,25 +40,26 @@ } } -.pageHeaderExtra { +.extraContent { .clearfix(); float: right; - & > div { + white-space: nowrap; + .statItem { padding: 0 32px; position: relative; - float: left; - & > p:first-child { + display: inline-block; + > p:first-child { color: @text-color-secondary; font-size: @font-size-base; line-height: 22px; margin-bottom: 4px; } - & > p { + > p { color: @heading-color; font-size: 30px; line-height: 38px; margin: 0; - & > span { + > span { color: @text-color-secondary; font-size: 20px; } @@ -72,11 +73,11 @@ height: 40px; content: ''; } - } - & > div:last-child { - padding-right: 0; - &:after { - display: none; + &:last-child { + padding-right: 0; + &:after { + display: none; + } } } } @@ -163,12 +164,6 @@ color: @disabled-color; } -@media screen and (min-width: @screen-xl) { - .pageHeaderExtra { - min-width: 345px; - } -} - @media screen and (max-width: @screen-xl) and (min-width: @screen-lg) { .activeCard { margin-bottom: 24px; @@ -176,9 +171,9 @@ .members { margin-bottom: 0; } - .pageHeaderExtra { + .extraContent { margin-left: -44px; - & > div { + .statItem { padding: 0 16px; } } @@ -191,10 +186,10 @@ .members { margin-bottom: 0; } - .pageHeaderExtra { + .extraContent { float: none; margin-right: 0; - & > div { + .statItem { padding: 0 16px; text-align: left; &:after { @@ -205,7 +200,7 @@ } @media screen and (max-width: @screen-md) { - .pageHeaderExtra { + .extraContent { margin-left: -16px; } .projectList { @@ -222,8 +217,8 @@ margin-left: 0; } } - .pageHeaderExtra { - & > div { + .extraContent { + .statItem { float: none; } }