diff --git a/Makefile b/Makefile
index bf8ef2ca08e4a7e8f930c9be65d6bbff9a5d6a63..2c3c7bd91684a67ade4c913eb86518d4c266603e 100644
--- a/Makefile
+++ b/Makefile
@@ -8,10 +8,7 @@ FRONTEND_TMP=${TMPDIR}shields-frontend-deploy
# pushing secrets to GitHub, this branch is configured to reject pushes.
WORKING_BRANCH=server-deploy-working-branch
-all: website test
-
-website:
- npm run build
+all: test
deploy: deploy-s0 deploy-s1 deploy-s2 clean-server-deploy deploy-gh-pages deploy-gh-pages-clean
@@ -19,9 +16,11 @@ deploy-s0: prepare-server-deploy push-s0
deploy-s1: prepare-server-deploy push-s1
deploy-s2: prepare-server-deploy push-s2
-prepare-server-deploy: website
+prepare-server-deploy:
# Ship a copy of the front end to each server for debugging.
# https://github.com/badges/shields/issues/1220
+ INCLUDE_DEV_PAGES=false \
+ npm run build
rm -rf ${SERVER_TMP}
git worktree prune
git worktree add -B ${WORKING_BRANCH} ${SERVER_TMP}
@@ -49,6 +48,7 @@ deploy-gh-pages:
rm -rf ${FRONTEND_TMP}
git worktree prune
GATSBY_BASE_URL=https://img.shields.io \
+ INCLUDE_DEV_PAGES=false \
npm run build
git worktree add -B gh-pages ${FRONTEND_TMP}
git -C ${FRONTEND_TMP} ls-files | xargs git -C ${FRONTEND_TMP} rm
@@ -67,4 +67,4 @@ deploy-gh-pages-clean:
test:
npm test
-.PHONY: all website deploy prepare-server-deploy clean-server-deploy deploy-s0 deploy-s1 deploy-s2 push-s0 push-s1 push-s2 deploy-gh-pages deploy-gh-pages-clean deploy-heroku setup redis test
+.PHONY: all deploy prepare-server-deploy clean-server-deploy deploy-s0 deploy-s1 deploy-s2 push-s0 push-s1 push-s2 deploy-gh-pages deploy-gh-pages-clean deploy-heroku setup redis test
diff --git a/frontend/components/development/logo-page.js b/frontend/components/development/logo-page.js
new file mode 100644
index 0000000000000000000000000000000000000000..44894dad1132a07a690defd07d251e298a79eb38
--- /dev/null
+++ b/frontend/components/development/logo-page.js
@@ -0,0 +1,69 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import styled from 'styled-components'
+import { staticBadgeUrl } from '../../lib/badge-url'
+import { baseUrl } from '../../constants'
+import Meta from '../meta'
+import Header from '../header'
+import { H3, Badge } from '../common'
+import { shieldsLogos, simpleIcons } from '../../../supported-features.json'
+
+const StyledTable = styled.table`
+ border: 1px solid #ccc;
+ border-collapse: collapse;
+
+ td {
+ border: 1px solid #ccc;
+ padding: 3px;
+ text-align: left;
+ }
+`
+
+const NamedLogoTable = ({ logoNames }) => (
+ <StyledTable>
+ <thead>
+ <tr>
+ <td>Flat</td>
+ <td>Social</td>
+ </tr>
+ </thead>
+ <tbody>
+ {logoNames.map(name => (
+ <tr key={name}>
+ <td>
+ <Badge
+ src={staticBadgeUrl(baseUrl, 'named logo', name, 'blue', {
+ logo: name,
+ })}
+ alt={`logo: ${name}`}
+ />
+ </td>
+ <td>
+ <Badge
+ src={staticBadgeUrl(baseUrl, 'Named Logo', name, 'blue', {
+ logo: name,
+ style: 'social',
+ })}
+ alt={`logo: ${name}`}
+ />
+ </td>
+ </tr>
+ ))}
+ </tbody>
+ </StyledTable>
+)
+NamedLogoTable.propTypes = {
+ logoNames: PropTypes.arrayOf(PropTypes.string).isRequired,
+}
+
+const LogoPage = () => (
+ <div>
+ <Meta />
+ <Header />
+ <H3>Named logos</H3>
+ <NamedLogoTable logoNames={shieldsLogos} />
+ <H3>Simple-icons</H3>
+ <NamedLogoTable logoNames={simpleIcons} />
+ </div>
+)
+export default LogoPage
diff --git a/frontend/components/usage.js b/frontend/components/usage.js
index 313c0231f2547054c67da624d8edd1cb1ba824a8..7a88c2fef0f23bb1dadab267c1370fa21a2b3f46 100644
--- a/frontend/components/usage.js
+++ b/frontend/components/usage.js
@@ -3,7 +3,7 @@ import { Link } from 'gatsby'
import PropTypes from 'prop-types'
import styled from 'styled-components'
import { staticBadgeUrl } from '../lib/badge-url'
-import { advertisedStyles, logos } from '../../supported-features.json'
+import { advertisedStyles, shieldsLogos } from '../../supported-features.json'
import StaticBadgeMaker from './static-badge-maker'
import DynamicBadgeMaker from './dynamic-badge-maker'
import { H2, H3, Badge, VerticalSpace } from './common'
@@ -110,7 +110,7 @@ export default class Usage extends React.PureComponent {
static renderNamedLogos() {
const renderLogo = logo => <LogoName key={logo}>{logo}</LogoName>
- const [first, ...rest] = logos
+ const [first, ...rest] = shieldsLogos
return [renderLogo(first)].concat(
rest.reduce((result, logo) => result.concat([', ', renderLogo(logo)]), [])
)
diff --git a/gatsby-node.js b/gatsby-node.js
index 68e575a682fd304577517310ad24cbe12baa5465..929e2e6a7783703ea8b0b06d5224baeb0058b468 100644
--- a/gatsby-node.js
+++ b/gatsby-node.js
@@ -8,6 +8,9 @@
const fs = require('fs')
const yaml = require('js-yaml')
+const envFlag = require('node-env-flag')
+
+const includeDevPages = envFlag(process.env.INCLUDE_DEV_PAGES, true)
const { categories } = yaml.safeLoad(
fs.readFileSync('./service-definitions.yml', 'utf8')
@@ -17,6 +20,13 @@ const { categories } = yaml.safeLoad(
// unnecessary complexity here, so this uses the programmatic API.
// https://www.gatsbyjs.org/docs/using-gatsby-without-graphql/#the-approach-fetch-data-and-use-gatsbys-createpages-api
async function createPages({ actions: { createPage } }) {
+ if (includeDevPages) {
+ createPage({
+ path: '/dev/logos',
+ component: require.resolve('./frontend/components/development/logo-page'),
+ })
+ }
+
categories.forEach(category => {
const { id } = category
createPage({
diff --git a/scripts/export-supported-features-cli.js b/scripts/export-supported-features-cli.js
index 19fd67d5276729ae8622b39bda9d1dc3f927b83e..40a93e0af110e395feb3dc10cfe0d4fb7c70afe4 100644
--- a/scripts/export-supported-features-cli.js
+++ b/scripts/export-supported-features-cli.js
@@ -1,12 +1,17 @@
'use strict'
-const path = require('path')
-const glob = require('glob')
+const logos = require('../lib/load-logos')()
+const simpleIcons = require('../lib/load-simple-icons')()
+
+const shieldsLogos = Object.keys(logos)
+
+const simpleIconSet = new Set(Object.keys(simpleIcons))
+shieldsLogos.forEach(logo => simpleIconSet.delete(logo))
+const simpleIconNames = Array.from(simpleIconSet)
const supportedFeatures = {
- logos: glob
- .sync(`${__dirname}/../logo/*.svg`)
- .map(filename => path.basename(filename, '.svg')),
+ shieldsLogos,
+ simpleIcons: simpleIconNames,
advertisedStyles: [
'plastic',
'flat',