diff --git a/fonts/kitematic.eot b/fonts/kitematic.eot index 3bccd0f7fc..5f57382eed 100644 Binary files a/fonts/kitematic.eot and b/fonts/kitematic.eot differ diff --git a/fonts/kitematic.svg b/fonts/kitematic.svg index 717dfdef22..0d577b4207 100644 --- a/fonts/kitematic.svg +++ b/fonts/kitematic.svg @@ -7,25 +7,26 @@ - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + diff --git a/fonts/kitematic.ttf b/fonts/kitematic.ttf index 72bb395c5a..99254250b0 100644 Binary files a/fonts/kitematic.ttf and b/fonts/kitematic.ttf differ diff --git a/fonts/kitematic.woff b/fonts/kitematic.woff index 121ee6e711..af71b03b6d 100644 Binary files a/fonts/kitematic.woff and b/fonts/kitematic.woff differ diff --git a/package.json b/package.json index e1cf0cdfba..81342308da 100644 --- a/package.json +++ b/package.json @@ -35,6 +35,7 @@ "mixpanel": "kitematic/mixpanel-node", "mkdirp": "^0.5.0", "node-uuid": "^1.4.3", + "numeral": "^1.5.3", "object-assign": "^4.0.1", "osx-release": "^1.1.0", "parseUri": "^1.2.3-2", diff --git a/src/components/ImageCard.react.js b/src/components/ImageCard.react.js index 6d77201f9f..a18420b16c 100644 --- a/src/components/ImageCard.react.js +++ b/src/components/ImageCard.react.js @@ -8,6 +8,7 @@ import containerActions from '../actions/ContainerActions'; import containerStore from '../stores/ContainerStore'; import tagStore from '../stores/TagStore'; import tagActions from '../actions/TagActions'; +import numeral from 'numeral'; var ImageCard = React.createClass({ mixins: [Router.Navigation], @@ -147,6 +148,8 @@ var ImageCard = React.createClass({ ); } + let favCount = (this.props.image.star_count < 1000) ? numeral(this.props.image.star_count).value() : numeral(this.props.image.star_count).format('0.0a').toUpperCase(); + let pullCount = (this.props.image.pull_count < 1000) ? numeral(this.props.image.pull_count).value() : numeral(this.props.image.pull_count).format('0a').toUpperCase(); return (
@@ -185,7 +188,9 @@ var ImageCard = React.createClass({
- {this.props.image.star_count} + {favCount} + + {pullCount}
diff --git a/styles/icons.less b/styles/icons.less index de69405330..65f7f2e74e 100644 --- a/styles/icons.less +++ b/styles/icons.less @@ -35,8 +35,8 @@ text-transform: none !important; speak: none; line-height: 1; - //-webkit-font-smoothing: subpixel-antialiased; - -webkit-font-smoothing: antialiased; + -webkit-font-smoothing: subpixel-antialiased; + //-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @@ -103,3 +103,6 @@ .icon-edit:before { content: "o"; } +.icon-download:before { + content: "p"; +} diff --git a/styles/new-container.less b/styles/new-container.less index c84361a26d..7ca9247a3d 100644 --- a/styles/new-container.less +++ b/styles/new-container.less @@ -366,16 +366,20 @@ font-size: 11px; color: @gray-normal; border-right: 1px solid @color-divider; - padding: 1.1rem 1.2rem; + padding: 1.1rem 1rem; .icon { position: relative; font-size: 11px; - margin-right: 0.5rem; + margin-right: 0.3rem; color: @gray-normal; } + .icon-download { + margin-left: 0.5rem; + } .text { position: relative; top: -0.2rem; + margin-right: 0.3rem; } } .tags { @@ -400,10 +404,16 @@ } .more-menu { flex: 0 auto; - width: 39px; - padding: 0.4rem 1rem; + width: 30px; + padding: 0.4rem 0.5rem; font-size: 20px; .box-button(); + .box-button { + .icon { + font-size: 1.5rem; + margin-left: 0.2rem; + } + } } .action { flex: 0 auto;