system-themes-page.html.twig 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. {#
  2. /**
  3. * @file
  4. * Theme override for the Appearance page.
  5. *
  6. * Available variables:
  7. * - attributes: HTML attributes for the main container.
  8. * - theme_groups: A list of theme groups. Each theme group contains:
  9. * - attributes: HTML attributes specific to this theme group.
  10. * - title: Title for the theme group.
  11. * - state: State of the theme group, e.g. installed or uninstalled.
  12. * - themes: A list of themes within the theme group. Each theme contains:
  13. * - attributes: HTML attributes specific to this theme.
  14. * - screenshot: A screenshot representing the theme.
  15. * - description: Description of the theme.
  16. * - name: Theme name.
  17. * - version: The theme's version number.
  18. * - is_default: Boolean indicating whether the theme is the default theme
  19. * or not.
  20. * - is_admin: Boolean indicating whether the theme is the admin theme or
  21. * not.
  22. * - notes: Identifies what context this theme is being used in, e.g.,
  23. * default theme, admin theme.
  24. * - incompatible: Text describing any compatibility issues.
  25. * - operations: A list of operation links, e.g., Settings, Enable, Disable,
  26. * etc. these links should only be displayed if the theme is compatible.
  27. *
  28. * @see template_preprocess_system_themes_page()
  29. */
  30. #}
  31. <div{{ attributes }}>
  32. {% for theme_group in theme_groups %}
  33. {%
  34. set theme_group_classes = [
  35. 'system-themes-list',
  36. 'system-themes-list-' ~ theme_group.state,
  37. 'clearfix',
  38. ]
  39. %}
  40. <div{{ theme_group.attributes.addClass(theme_group_classes) }}>
  41. <h2 class="system-themes-list__header">{{ theme_group.title }}</h2>
  42. {% for theme in theme_group.themes %}
  43. {%
  44. set theme_classes = [
  45. theme.is_default ? 'theme-default',
  46. theme.is_admin ? 'theme-admin',
  47. 'theme-selector',
  48. 'clearfix',
  49. ]
  50. %}
  51. <div{{ theme.attributes.addClass(theme_classes) }}>
  52. {% if theme.screenshot %}
  53. {{ theme.screenshot }}
  54. {% endif %}
  55. <div class="theme-info">
  56. <h3 class="theme-info__header">
  57. {{- theme.name }} {{ theme.version -}}
  58. {% if theme.notes %}
  59. ({{ theme.notes|safe_join(', ') }})
  60. {%- endif -%}
  61. </h3>
  62. <div class="theme-info__description">{{ theme.description }}</div>
  63. {# Display operation links if the theme is compatible. #}
  64. {% if theme.incompatible %}
  65. <div class="incompatible">{{ theme.incompatible }}</div>
  66. {% else %}
  67. {{ theme.operations }}
  68. {% endif %}
  69. </div>
  70. </div>
  71. {% endfor %}
  72. </div>
  73. {% endfor %}
  74. </div>