From c552f7f336f9490fd17dd1b3d4afb8c40e9d2f53 Mon Sep 17 00:00:00 2001 From: Richard Lewis Date: Wed, 7 Jun 2017 10:55:49 +0100 Subject: [PATCH] App icon styling --- src/components/structures/ModularWidgets.js | 8 ++++++-- src/components/views/dialogs/AddAppDialog.js | 13 ++++++++++++- src/components/views/elements/AppIconTile.js | 4 +++- 3 files changed, 21 insertions(+), 4 deletions(-) diff --git a/src/components/structures/ModularWidgets.js b/src/components/structures/ModularWidgets.js index 16b00dfbf3..306a645a6f 100644 --- a/src/components/structures/ModularWidgets.js +++ b/src/components/structures/ModularWidgets.js @@ -2,11 +2,15 @@ class ModularWidgets { static widgetTypes = [ { type: 'etherpad', - icon: '', + icon: 'http://localhost:8000/static/etherpad.svg', + name: 'Etherpad', + description: 'Collaborative text editor', }, { type: 'grafana', - icon: '', + icon: 'http://localhost:8000/static/grafana.svg', + name: 'Grafana', + description: 'Graph and monitor all the things!', }, ]; } diff --git a/src/components/views/dialogs/AddAppDialog.js b/src/components/views/dialogs/AddAppDialog.js index 90bb53f3c3..0d24c641a6 100644 --- a/src/components/views/dialogs/AddAppDialog.js +++ b/src/components/views/dialogs/AddAppDialog.js @@ -16,6 +16,8 @@ limitations under the License. import React from 'react'; import sdk from '../../../index'; +import AppIconTile from '../elements/AppIconTile'; +import ModularWidgets from '../../structures/ModularWidgets'; /** * Prompt the user for address of iframe widget @@ -50,13 +52,22 @@ export default React.createClass({ render: function() { const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog'); + const appCards = ModularWidgets.widgetTypes.map((widgetType, index) => + , + ); + return (
- + {appCards} {/*
Or enter the URL of the widget to add.
diff --git a/src/components/views/elements/AppIconTile.js b/src/components/views/elements/AppIconTile.js index 2c67efcede..9e9dbe6d41 100644 --- a/src/components/views/elements/AppIconTile.js +++ b/src/components/views/elements/AppIconTile.js @@ -21,7 +21,9 @@ class AppIconTile extends React.Component { render() { return (
- {this.props.name} +
+ {this.props.name} +

{this.props.name}

{this.props.description}