From 9855c0f51f3a35cb7527321dce632c9fc880b8cf Mon Sep 17 00:00:00 2001 From: Paul Melnikow Date: Sun, 22 Jul 2018 17:24:14 -0500 Subject: [PATCH 1/3] List the named logos in the frontend Fix #1787 --- .gitignore | 1 + frontend/components/markup-modal.js | 2 +- frontend/components/usage.js | 7 ++----- lib/export-supported-features-cli.js | 19 +++++++++++++++++++ lib/supported-features.js | 13 ------------- package.json | 5 +++-- 6 files changed, 26 insertions(+), 21 deletions(-) create mode 100644 lib/export-supported-features-cli.js delete mode 100644 lib/supported-features.js diff --git a/.gitignore b/.gitignore index 0bcb375debcc4..1a6cd4d5502db 100644 --- a/.gitignore +++ b/.gitignore @@ -90,3 +90,4 @@ typings/ /build .next badge-examples.json +supported-features.json diff --git a/frontend/components/markup-modal.js b/frontend/components/markup-modal.js index 7a45d8b7324eb..93cca54bbb20c 100644 --- a/frontend/components/markup-modal.js +++ b/frontend/components/markup-modal.js @@ -4,7 +4,7 @@ import Modal from 'react-modal'; import ClickToSelect from '@mapbox/react-click-to-select'; import resolveBadgeUrl from '../lib/badge-url'; import generateAllMarkup from '../lib/generate-image-markup'; -import { advertisedStyles } from '../../lib/supported-features'; +import { advertisedStyles } from '../../supported-features.json'; export default class MarkupModal extends React.Component { static propTypes = { diff --git a/frontend/components/usage.js b/frontend/components/usage.js index dd92550222a92..d83b0354b3503 100644 --- a/frontend/components/usage.js +++ b/frontend/components/usage.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import StaticBadgeMaker from './static-badge-maker'; import DynamicBadgeMaker from './dynamic-badge-maker'; import { staticBadgeUrl } from '../lib/badge-url'; -import { advertisedStyles } from '../../lib/supported-features'; +import { advertisedStyles, logos } from '../../supported-features.json'; export default class Usage extends React.PureComponent { static propTypes = { @@ -160,10 +160,7 @@ export default class Usage extends React.PureComponent { ?logo=appveyor - - Insert one of the {} - named logos - + Insert one of the named logos ({logos.join(', ')}) diff --git a/lib/export-supported-features-cli.js b/lib/export-supported-features-cli.js new file mode 100644 index 0000000000000..bed3cc0efdcd8 --- /dev/null +++ b/lib/export-supported-features-cli.js @@ -0,0 +1,19 @@ +'use strict'; + +const path = require('path'); +const glob = require('glob'); + +const supportedFeatures = { + logos: glob + .sync(`${__dirname}/../logo/*.svg`) + .map(filename => path.basename(filename, '.svg')), + advertisedStyles: [ + 'plastic', + 'flat', + 'flat-square', + 'for-the-badge', + 'social', + ], +}; + +console.log(JSON.stringify(supportedFeatures, null, 2)); diff --git a/lib/supported-features.js b/lib/supported-features.js deleted file mode 100644 index 28039e96d5121..0000000000000 --- a/lib/supported-features.js +++ /dev/null @@ -1,13 +0,0 @@ -'use strict'; - -const advertisedStyles = [ - 'plastic', - 'flat', - 'flat-square', - 'for-the-badge', - 'social', -]; - -module.exports = { - advertisedStyles -}; diff --git a/package.json b/package.json index 29386be8fbd5b..e09cde79115b3 100644 --- a/package.json +++ b/package.json @@ -73,13 +73,14 @@ "depcheck": "check-node-version --node \">= 8.0\"", "postinstall": "npm run depcheck", "prebuild": "npm run depcheck", + "features": "node lib/export-supported-features-cli.js > supported-features.json", "examples": "node lib/export-badge-examples-cli.js > badge-examples.json", - "build": "npm run examples && next build && next export -o build/", + "build": "npm run examples && npm run features && next build && next export -o build/", "heroku-postbuild": "npm run build", "analyze": "ANALYZE=true LONG_CACHE=false BASE_URL=https://img.shields.io npm run build", "start:server": "HANDLE_INTERNAL_ERRORS=false RATE_LIMIT=false node server 8080 ::", "now-start": "node server", - "prestart": "npm run depcheck && npm run examples", + "prestart": "npm run depcheck && npm run examples && npm run features", "start": "concurrently --names server,frontend \"ALLOWED_ORIGIN=http://localhost:3000 npm run start:server\" \"BASE_URL=http://[::]:8080 next dev\"" }, "bin": { From d7065ee9ace8d03086c2a371d2d06875fe76c807 Mon Sep 17 00:00:00 2001 From: Paul Melnikow Date: Mon, 23 Jul 2018 14:34:19 -0500 Subject: [PATCH 2/3] Improve formatting of named logo list --- frontend/components/usage.js | 16 +++++++++++++--- static/main.css | 17 +++++++++++++++++ 2 files changed, 30 insertions(+), 3 deletions(-) diff --git a/frontend/components/usage.js b/frontend/components/usage.js index d83b0354b3503..7a4ae2977d128 100644 --- a/frontend/components/usage.js +++ b/frontend/components/usage.js @@ -66,7 +66,15 @@ export default class Usage extends React.PureComponent { ); } - render () { + static renderNamedLogos() { + const renderLogo = logo => {logo}; + const [first, ...rest] = logos; + return [renderLogo(first)].concat( + rest.reduce((result, logo) => result.concat([', ', renderLogo(logo)]), []) + ); + } + + render() { const { baseUri } = this.props; return (
@@ -142,7 +150,7 @@ export default class Usage extends React.PureComponent {

Here are a few other parameters you can use: (connecting several with "&" is possible)

- +
- +
@@ -160,7 +168,9 @@ export default class Usage extends React.PureComponent { ?logo=appveyor Insert one of the named logos ({logos.join(', ')}) + Insert one of the named logos ({this.constructor.renderNamedLogos()}) +
diff --git a/static/main.css b/static/main.css index 87d9256e8873a..0295f0e1a0eb8 100644 --- a/static/main.css +++ b/static/main.css @@ -57,6 +57,23 @@ table.centered > tbody > tr > td:first-child { text-align: right; } +table.usage { + table-layout: fixed; + border-spacing: 20px 10px; +} + +.nowrap { + white-space: nowrap; +} + +table.usage td:first-of-type { + max-width: 300px; +} + +table.usage td:nth-of-type(2) { + max-width: 600px; +} + th, td { text-align: left; From 6cb393d9c1d0eb775c7d7c13fe01dfd65f35ea35 Mon Sep 17 00:00:00 2001 From: Paul Melnikow Date: Mon, 23 Jul 2018 14:36:41 -0500 Subject: [PATCH 3/3] class -> className --- frontend/components/usage.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/components/usage.js b/frontend/components/usage.js index 7a4ae2977d128..448fad5755691 100644 --- a/frontend/components/usage.js +++ b/frontend/components/usage.js @@ -150,7 +150,7 @@ export default class Usage extends React.PureComponent {

Here are a few other parameters you can use: (connecting several with "&" is possible)

- +