CustomizeLayoutSetting.jsx 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. import React from 'react';
  2. class CustomizeLayoutSetting extends React.Component {
  3. render() {
  4. return (
  5. <form>
  6. <div className="col-sm-4">
  7. <h4>
  8. <div className="radio radio-primary">
  9. <input
  10. type="radio"
  11. id="radioLayoutGrowi"
  12. name="settingForm[customize:layout]"
  13. value="growi"
  14. onClick="selectableTheme(event)"
  15. />
  16. <label htmlFor="radioLayoutGrowi">
  17. GROWI Enhanced Layout <small className="text-success">(Recommended)</small>
  18. </label>
  19. </div>
  20. </h4>
  21. <a href="/images/admin/customize/layout-crowi-plus.gif" className="ss-container">
  22. <img src="/images/admin/customize/layout-crowi-plus-thumb.gif" width="240px" />
  23. </a>
  24. <h4>Simple and Clear</h4>
  25. <ul>
  26. {/* TODO i18n */}
  27. <li>Full screen layout and thin margins/paddings</li>
  28. <li>Show and post comments at the bottom of the page</li>
  29. <li>Affix Table-of-contents</li>
  30. </ul>
  31. </div>
  32. <div className="col-sm-4">
  33. <h4>
  34. <div className="radio radio-primary">
  35. <input type="radio" id="radioLayoutKibela" name="settingForm[customize:layout]" value="kibela" onClick="selectableTheme(event)" />
  36. <label htmlFor="radioLayoutKibela">
  37. Kibela Like Layout
  38. </label>
  39. </div>
  40. </h4>
  41. <a href="/images/admin/customize/layout-kibela.gif" className="ss-container">
  42. <img src="/images/admin/customize/layout-kibela-thumb.gif" width="240px" />
  43. </a>
  44. <h4>Easy Viewing Structure</h4>
  45. <ul>
  46. {/* TODO i18n */}
  47. <li>Center aligned contents</li>
  48. <li>Show and post comments at the bottom of the page</li>
  49. <li>Affix Table-of-contents</li>
  50. </ul>
  51. </div>
  52. </form>
  53. );
  54. }
  55. }
  56. export default CustomizeLayoutSetting;