summaryrefslogtreecommitdiffstats
path: root/web/react/components/user_settings/premade_theme_chooser.jsx
diff options
context:
space:
mode:
authorHarrison Healey <harrisonmhealey@gmail.com>2015-09-23 15:04:22 -0400
committerHarrison Healey <harrisonmhealey@gmail.com>2015-09-23 15:04:22 -0400
commit15f15de8ca5ee91e5d11ed017ba0e3d49b1471ec (patch)
treec410bad529a7d968a08e3b4e01cf3e9631eb47d1 /web/react/components/user_settings/premade_theme_chooser.jsx
parent301706f2558d55271275273dec0de1fb86082f8a (diff)
parente4a15076f458be1416de25b2c45578975b914de5 (diff)
downloadchat-15f15de8ca5ee91e5d11ed017ba0e3d49b1471ec.tar.gz
chat-15f15de8ca5ee91e5d11ed017ba0e3d49b1471ec.tar.bz2
chat-15f15de8ca5ee91e5d11ed017ba0e3d49b1471ec.zip
Merge pull request #759 from mattermost/plt-242-3
PLT-242 Implement custom UI theme colors.
Diffstat (limited to 'web/react/components/user_settings/premade_theme_chooser.jsx')
-rw-r--r--web/react/components/user_settings/premade_theme_chooser.jsx55
1 files changed, 55 insertions, 0 deletions
diff --git a/web/react/components/user_settings/premade_theme_chooser.jsx b/web/react/components/user_settings/premade_theme_chooser.jsx
new file mode 100644
index 000000000..e36503053
--- /dev/null
+++ b/web/react/components/user_settings/premade_theme_chooser.jsx
@@ -0,0 +1,55 @@
+// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+var Utils = require('../../utils/utils.jsx');
+var Constants = require('../../utils/constants.jsx');
+
+export default class PremadeThemeChooser extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {};
+ }
+ render() {
+ const theme = this.props.theme;
+
+ const premadeThemes = [];
+ for (const k in Constants.THEMES) {
+ if (Constants.THEMES.hasOwnProperty(k)) {
+ const premadeTheme = $.extend(true, {}, Constants.THEMES[k]);
+
+ let activeClass = '';
+ if (premadeTheme.type === theme.type) {
+ activeClass = 'active';
+ }
+
+ premadeThemes.push(
+ <div className='col-sm-3 premade-themes'>
+ <div
+ className={activeClass}
+ onClick={() => this.props.updateTheme(premadeTheme)}
+ >
+ <label>
+ <img
+ className='img-responsive'
+ src={'/static/images/themes/' + premadeTheme.type + '.png'}
+ />
+ <div className='theme-label'>{Utils.toTitleCase(premadeTheme.type)}</div>
+ </label>
+ </div>
+ </div>
+ );
+ }
+ }
+
+ return (
+ <div className='row'>
+ {premadeThemes}
+ </div>
+ );
+ }
+}
+
+PremadeThemeChooser.propTypes = {
+ theme: React.PropTypes.object.isRequired,
+ updateTheme: React.PropTypes.func.isRequired
+};