迷你版本樣式

components/pagination/demo/mini-more.md

@@ -0,0 +1,19 @@
+# 迷你的改变
+
+- order: 5
+
+改变每页显示条目数
+
+---
+
+````jsx
+var Pagination = antd.Pagination;
+
+function onChange(page) {
+  console.log(page);
+}
+
+React.render(
+  <Pagination className="mini" showQuickJumper={true} showSizeChanger={true} onChange={onChange} total={500} />, 
+ document.getElementById('components-pagination-demo-mini-more'));
+````

components/pagination/demo/mini.md

@@ -0,0 +1,19 @@
+# 迷你
+
+- order: 4
+
+迷你版本
+
+---
+
+````jsx
+var Pagination = antd.Pagination;
+
+function onChange(page) {
+  console.log(page);
+}
+
+React.render(
+  <Pagination className="mini" onChange={onChange} total={50} />, 
+ document.getElementById('components-pagination-demo-mini'));
+````

components/pagination/index.jsx

@@ -7,7 +7,7 @@ let prefixCls = 'ant-patination';
 
 class AntPagination extends React.Component {
   render() {
-    return <Pagination className={prefixCls} {...this.props} />;
+    return <Pagination className={prefixCls + this.props.className} {...this.props} />;
   }
 }
 

style/components/pagination.less

@@ -105,9 +105,19 @@
     border: 1px solid #d9d9d9;
 
     a {
+      font-size: 16px;
+      line-height: 1;
       color: #666;
     }
 
+    &:hover {
+      border-color: #2db7f5;
+
+      a {
+        color: #2db7f5;
+      }
+    }
+
     &.disabled {
       cursor: not-allowed;
       a {
@@ -149,3 +159,38 @@
   }
 }
 
+.@{prefixClass}.mini {
+
+  .@{prefixClass}-item {
+    border: none;
+    margin: 0;
+    min-width: 20px;
+    height: 20px;
+    line-height: 20px;
+  }
+
+  .prev, .next {
+    margin: 0;
+    min-width: 20px;
+    height: 20px;
+    line-height: 20px;
+    border: none;
+  }
+
+  .jump-prev, .jump-next {
+    height: 20px;
+    line-height: 20px;
+  }
+
+  .quick-jumper {
+    height: 20px;
+    line-height: 20px;
+
+    input {
+      padding: 3px 7px;
+      width: 40px;
+      height: 20px;
+      line-height: 20px;
+    }
+  }
+}