site: improve styles

site/theme/static/common.less

@@ -62,10 +62,10 @@ a {
     position: relative;
     .anticon {
       font-size: 12px;
-      color: #999;
+      color: @primary-color;
       opacity: 0;
       position: absolute;
-      right: -4px;
+      right: -10px;
       top: 16px;
       transition: all .3s;
     }

site/theme/static/demo.less

@@ -112,13 +112,13 @@ section.code-box-meta p {
 
 .code-box .collapse {
   position: absolute;
-  right: 16px;
-  bottom: 17px;
+  right: 14px;
+  bottom: 22px;
   cursor: pointer;
-  width: 18px;
-  height: 18px;
-  font-size: 18px;
-  line-height: 18px;
+  width: 16px;
+  height: 16px;
+  font-size: 16px;
+  line-height: 16px;
   opacity: 0.5;
   text-align: center;
   transition: all 0.3s;
@@ -161,8 +161,21 @@ section.code-box-meta p {
 .code-box .code-box-code-copy {
   position: absolute;
   top: 10px;
-  right: 13.5px;
+  right: 12px;
   margin: 0 !important;
+  font-size: 14px;
+  cursor: pointer;
+  color: #888;
+  transition: all .3s;
+  background: #fff;
+  width: 20px;
+  height: 20px;
+  line-height: 20px;
+  text-align: center;
+  border-radius: 20px;
+  &:hover {
+    color: @primary-color;
+  }
 }
 
 .code-box pre {

site/theme/template/Content/Demo.jsx

@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom';
 import { FormattedMessage } from 'react-intl';
 import CopyToClipboard from 'react-copy-to-clipboard';
 import classNames from 'classnames';
-import { Icon, Tooltip, Button, message } from 'antd';
+import { Icon, Tooltip, message } from 'antd';
 import EditButton from './EditButton';
 
 export default class Demo extends React.Component {
@@ -108,13 +108,7 @@ export default class Demo extends React.Component {
               onCopy={() => message.success('Code copied!')}
             >
               <Tooltip title={<FormattedMessage id="app.demo.copy" />}>
-                <Button
-                  shape="circle"
-                  size="small"
-                  className="code-box-code-copy"
-                >
-                  <Icon type="copy" />
-                </Button>
+                <Icon type="copy" className="code-box-code-copy" />
               </Tooltip>
             </CopyToClipboard>
             {props.utils.toReactComponent(highlightedCode)}