blob: def260342695b36faaa64f383c81879e632d978e (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
|
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at http://mozilla.org/MPL/2.0/. */
import React from "react";
import { Localized } from "./MSLocalized";
export const Themes = props => {
return (
<div className="tiles-theme-container">
<div>
<fieldset className="tiles-theme-section">
<Localized text={props.content.subtitle}>
<legend className="sr-only" />
</Localized>
{props.content.tiles.data.map(
({ theme, label, tooltip, description }) => (
<Localized
key={theme + label}
text={typeof tooltip === "object" ? tooltip : {}}
>
<label className="theme" title={theme + label}>
<Localized
text={typeof description === "object" ? description : {}}
>
<input
type="radio"
value={theme}
name="theme"
checked={theme === props.activeTheme}
className="sr-only input"
onClick={props.handleAction}
/>
</Localized>
<div
className={`icon ${
theme === props.activeTheme ? " selected" : ""
} ${theme}`}
/>
<Localized text={label}>
<div className="text" />
</Localized>
</label>
</Localized>
)
)}
</fieldset>
</div>
</div>
);
};
|
