From eda0bce7330521401d02cd56011ddf2a447a1a64 Mon Sep 17 00:00:00 2001 From: "wenbo.dong" Date: Thu, 24 Aug 2017 14:13:22 +0800 Subject: [PATCH] =?UTF-8?q?opti:=20=E9=98=B4=E5=BD=B1=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/ProjectCard/ProjectCard.scss | 8 ++ client/containers/Home/Home.js | 81 +++++++------------ client/containers/Home/Home.scss | 8 ++ 3 files changed, 46 insertions(+), 51 deletions(-) diff --git a/client/components/ProjectCard/ProjectCard.scss b/client/components/ProjectCard/ProjectCard.scss index ba33b2aa..996ef079 100644 --- a/client/components/ProjectCard/ProjectCard.scss +++ b/client/components/ProjectCard/ProjectCard.scss @@ -11,12 +11,19 @@ .m-card, .card-btns { transform: translateY(-4px); } + .m-card .ant-card-body { + box-shadow: 0 4px 8px rgba(50, 50, 93, 0.11), 0 4px 6px rgba(0, 0, 0, 0.08); + } } &:active { .m-card, .card-btns { transform: translateY(4px); } } + // 覆盖 card 组件 hover 状态的默认阴影样式 + .ant-card:not(.ant-card-no-hovering):hover { + box-shadow: none; + } // 卡片右上角按钮 .card-btns { position: absolute; @@ -47,6 +54,7 @@ border-radius: 4px; padding-top: .24rem + .16rem + 1rem; box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08); + transition: all .2s; } .ui-logo { width: 1rem; diff --git a/client/containers/Home/Home.js b/client/containers/Home/Home.js index 8c4b56db..12967d19 100644 --- a/client/containers/Home/Home.js +++ b/client/containers/Home/Home.js @@ -8,11 +8,8 @@ import { logoSVG } from '../../common.js'; // import Intro from '../../components/Intro/Intro' import { changeMenuItem } from '../../reducer/modules/menu' -import { OverPack } from 'rc-scroll-anim' -import TweenOne from 'rc-tween-one' -import QueueAnim from 'rc-queue-anim'; -const oneAnim = { y: '+=30', opacity: 0, type: 'from', ease: 'easeOutQuad' }; +// const oneAnim = { y: '+=30', opacity: 0, type: 'from', ease: 'easeOutQuad' }; const HomeGuest = () => (
@@ -56,43 +53,25 @@ const HomeGuest = () => (
- - -

为API开发者设计的管理平台

- YApi让接口开发更简单高效,让接口的管理更具可读性、可维护性,让团队协作更合理。 -
- - - - -

项目接口管理

- 提供基本的项目分组,项目管理,接口管理功能 - - - -

可部署

- 用户只需配置接口的基本路径,通过将线上域名指到我们的YApi平台服务器,就可使用mockServer服务 - - - -

用户管理

- 提供基本的用户注册登录管理等功能,集成了去哪儿QSSO登录 - -
-
-
+

为API开发者设计的管理平台

+ YApi让接口开发更简单高效,让接口的管理更具可读性、可维护性,让团队协作更合理。 + + + +

项目接口管理

+ 提供基本的项目分组,项目管理,接口管理功能 + + + +

可部署

+ 用户只需配置接口的基本路径,通过将线上域名指到我们的YApi平台服务器,就可使用mockServer服务 + + + +

用户管理

+ 提供基本的用户注册登录管理等功能,集成了去哪儿QSSO登录 + +
@@ -110,15 +89,15 @@ const HomeGuest = () => (

通过学习一些简单的 Mock 模板规则即可轻松编写接口,这将大大提高定义接口的效率,并且无需为编写 Mock 数据烦恼: 所有的数据都可以实时随机生成。

    -
  1. 1{  
  2. -
  3. 2    "errcode|200-500": 200,  
  4. -
  5. 3    "errmsg|4-8": "@string",  
  6. -
  7. 4    "data": {  
  8. -
  9. 5        "boolean|1": true,  
  10. -
  11. 6        "array|4": 1,  
  12. -
  13. 7        "combine": "@boolean & @array"  
  14. -
  15. 8    }  
  16. -
  17. 9}  
  18. +
  19. 1{  
  20. +
  21. 2    "errcode|200-500": 200,  
  22. +
  23. 3    "errmsg|4-8": "@string",  
  24. +
  25. 4    "data": {  
  26. +
  27. 5        "boolean|1": true,  
  28. +
  29. 6        "array|4": 1,  
  30. +
  31. 7        "combine": "@boolean & @array"  
  32. +
  33. 8    }  
  34. +
  35. 9}  
@@ -146,7 +125,7 @@ const HomeGuest = () => (
- +
diff --git a/client/containers/Home/Home.scss b/client/containers/Home/Home.scss index 44dd075c..5f5de77b 100644 --- a/client/containers/Home/Home.scss +++ b/client/containers/Home/Home.scss @@ -351,6 +351,9 @@ $color-bg-lightblue: #c6e2ff; box-shadow: 0 15px 35px rgba(50,50,93,.1), 0 5px 15px rgba(0,0,0,.07); border: none; } + .ant-card:not(.ant-card-no-hovering):hover { + box-shadow: 0 15px 35px rgba(50,50,93,.1), 0 5px 15px rgba(0,0,0,.07); + } .ant-card-head { background-color: $color-blue-grey-lighter; border-top-left-radius: .04rem; @@ -399,6 +402,11 @@ $color-bg-lightblue: #c6e2ff; .keyword { color: #2359f1; } + .item { + overflow: hidden; + text-overflow:ellipsis; + white-space: nowrap; + } } .mock-after { .ant-card-head {