Kaynağa Gözat

update components

afc163 8 yıl önce
ebeveyn
işleme
c222d67562

+ 8 - 1
src/components/FooterToolbar/demo/basic.md

@@ -11,7 +11,14 @@ import FooterToolbar from 'ant-design-pro/lib/FooterToolbar';
 import { Button } from 'antd';
 
 ReactDOM.render(
-  <div style={{ background: '#f7f7f7' }}>
+  <div style={{ background: '#f7f7f7', padding: 24 }}>
+    <p>页面内容 页面内容 页面内容 页面内容</p>
+    <p>页面内容 页面内容 页面内容 页面内容</p>
+    <p>页面内容 页面内容 页面内容 页面内容</p>
+    <p>页面内容 页面内容 页面内容 页面内容</p>
+    <p>页面内容 页面内容 页面内容 页面内容</p>
+    <p>页面内容 页面内容 页面内容 页面内容</p>
+    <p>页面内容 页面内容 页面内容 页面内容</p>
     <p>页面内容 页面内容 页面内容 页面内容</p>
     <p>页面内容 页面内容 页面内容 页面内容</p>
     <p>页面内容 页面内容 页面内容 页面内容</p>

+ 3 - 1
src/components/GlobalFooter/demo/basic.md

@@ -25,6 +25,8 @@ const links = [{
 const copyright = <div>Copyright <Icon type="copyright" /> 2017 蚂蚁金服体验技术部出品</div>;
 
 ReactDOM.render(
-  <GlobalFooter links={links} copyright={copyright} />
+  <div style={{ background: '#f5f5f5', overflow: 'hidden' }}>
+    <GlobalFooter links={links} copyright={copyright} />
+  </div>
 , mountNode);
 ````

+ 4 - 1
src/components/HeaderSearch/index.js

@@ -60,7 +60,10 @@ export default class HeaderSearch extends PureComponent {
       [styles.show]: this.state.searchMode,
     });
     return (
-      <span className={className} onClick={this.enterSearchMode}>
+      <span
+        className={classNames(className, styles.headerSearch)}
+        onClick={this.enterSearchMode}
+      >
         <Icon type="search" />
         <AutoComplete
           className={inputClass}

+ 27 - 21
src/components/HeaderSearch/index.less

@@ -1,26 +1,32 @@
 @import "~antd/lib/style/themes/default.less";
 
-.input {
-  transition: width .3s, margin-left .3s;
-  width: 0;
-  background: transparent;
-  border-radius: 0;
-  :global(.ant-select-selection) {
-    background: transparent;
-  }
-  input {
-    border: 0;
-    padding-left: 0;
-    padding-right: 0;
-    box-shadow: none !important;
+.headerSearch {
+  :global(.anticon-search) {
+    cursor: pointer;
+    font-size: 16px;
   }
-  &,
-  &:hover,
-  &:focus {
-    border-bottom: 1px solid @border-color-base;
-  }
-  &.show {
-    width: 210px;
-    margin-left: 8px;
+  .input {
+    transition: width .3s, margin-left .3s;
+    width: 0;
+    background: transparent;
+    border-radius: 0;
+    :global(.ant-select-selection) {
+      background: transparent;
+    }
+    input {
+      border: 0;
+      padding-left: 0;
+      padding-right: 0;
+      box-shadow: none !important;
+    }
+    &,
+    &:hover,
+    &:focus {
+      border-bottom: 1px solid @border-color-base;
+    }
+    &.show {
+      width: 210px;
+      margin-left: 8px;
+    }
   }
 }