Initial commit

assets/theme-template/README.md

@@ -0,0 +1,63 @@
+# Theme Template
+
+This is a basic Drupal theme template. To use it:
+
+1. Copy this directory to your Drupal installation: `themes/custom/yourthemename/`
+2. Rename files from `THEMENAME.*` to `yourthemename.*`
+3. Replace all instances of `THEMENAME` with your theme's machine name (lowercase, underscores)
+4. Replace all instances of `THEMELABEL` with your theme's human-readable name
+5. Customize the theme as needed
+
+## Files Included
+
+- `THEMENAME.info.yml` - Theme metadata
+- `THEMENAME.libraries.yml` - CSS/JS library definitions
+- `THEMENAME.theme` - Theme functions and preprocessing
+- `templates/page.html.twig` - Page template
+- `css/base/reset.css` - Base CSS reset
+- `js/custom.js` - Custom JavaScript
+
+## Directory Structure
+
+```
+THEMENAME/
+├── THEMENAME.info.yml
+├── THEMENAME.libraries.yml
+├── THEMENAME.theme
+├── css/
+│   └── base/
+│       └── reset.css
+├── js/
+│   └── custom.js
+└── templates/
+    └── page.html.twig
+```
+
+You can expand the CSS structure as needed:
+```
+css/
+├── base/
+│   └── reset.css
+├── layout/
+│   └── layout.css
+├── components/
+│   └── components.css
+└── theme/
+    └── theme.css
+```
+
+## Next Steps
+
+After creating your theme:
+
+1. Clear cache: `ddev drush cr`
+2. Enable your theme: Go to `/admin/appearance`
+3. Set as default theme
+4. Start customizing!
+
+## Development Tips
+
+- Enable Twig debugging in `sites/default/services.yml`
+- Disable CSS/JS aggregation during development
+- Clear cache frequently: `ddev drush cr`
+- Use template suggestions for specific pages/content types

assets/theme-template/THEMENAME.info.yml

@@ -0,0 +1,40 @@
+name: THEMELABEL
+description: 'A custom Drupal theme.'
+type: theme
+core_version_requirement: ^9 || ^10 || ^11
+package: Custom
+
+# Base theme (uncomment one)
+# base theme: stable9
+# base theme: claro
+# base theme: olivero
+base theme: false
+
+# Regions
+regions:
+  header: Header
+  primary_menu: 'Primary menu'
+  secondary_menu: 'Secondary menu'
+  page_top: 'Page top'
+  page_bottom: 'Page bottom'
+  highlighted: Highlighted
+  breadcrumb: Breadcrumb
+  content: Content
+  sidebar_first: 'Sidebar first'
+  sidebar_second: 'Sidebar second'
+  footer: Footer
+
+# Libraries
+libraries:
+  - THEMENAME/global-styling
+  - THEMENAME/global-scripts
+
+# Component libraries (optional)
+# component-libraries:
+#   atoms:
+#     paths:
+#       - components/atoms
+
+# Logo and favicon
+# logo: images/logo.svg
+# favicon: images/favicon.ico

assets/theme-template/THEMENAME.libraries.yml

@@ -0,0 +1,19 @@
+global-styling:
+  version: 1.0
+  css:
+    base:
+      css/base/reset.css: {}
+    layout:
+      css/layout/layout.css: {}
+    component:
+      css/components/components.css: {}
+    theme:
+      css/theme/theme.css: {}
+
+global-scripts:
+  version: 1.0
+  js:
+    js/custom.js: {}
+  dependencies:
+    - core/drupal
+    - core/drupalSettings

assets/theme-template/THEMENAME.theme

@@ -0,0 +1,39 @@
+<?php
+
+/**
+ * @file
+ * Functions to support theming in the THEMELABEL theme.
+ */
+
+use Drupal\Core\Form\FormStateInterface;
+
+/**
+ * Implements hook_preprocess_HOOK() for page templates.
+ */
+function THEMENAME_preprocess_page(&$variables) {
+  // Add custom variables or modify existing ones.
+}
+
+/**
+ * Implements hook_preprocess_HOOK() for node templates.
+ */
+function THEMENAME_preprocess_node(&$variables) {
+  /** @var \Drupal\node\NodeInterface $node */
+  $node = $variables['node'];
+
+  // Add custom variables based on node.
+}
+
+/**
+ * Implements hook_theme_suggestions_HOOK_alter() for page templates.
+ */
+function THEMENAME_theme_suggestions_page_alter(array &$suggestions, array $variables) {
+  // Add custom template suggestions.
+}
+
+/**
+ * Implements hook_form_alter().
+ */
+function THEMENAME_form_alter(&$form, FormStateInterface $form_state, $form_id) {
+  // Modify forms as needed.
+}

assets/theme-template/css/base/reset.css

@@ -0,0 +1,26 @@
+/**
+ * @file
+ * Basic CSS reset and normalization.
+ */
+
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+html {
+  font-size: 16px;
+  line-height: 1.5;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  color: #333;
+  background-color: #fff;
+}
+
+img {
+  max-width: 100%;
+  height: auto;
+}

assets/theme-template/js/custom.js

@@ -0,0 +1,16 @@
+/**
+ * @file
+ * Custom JavaScript for THEMELABEL theme.
+ */
+
+(function (Drupal) {
+  'use strict';
+
+  Drupal.behaviors.THEMENAME = {
+    attach: function (context, settings) {
+      // Custom JavaScript code here
+      console.log('THEMELABEL theme loaded');
+    }
+  };
+
+})(Drupal);

assets/theme-template/templates/page.html.twig

@@ -0,0 +1,57 @@
+{#
+/**
+ * @file
+ * Theme override to display a page.
+ */
+#}
+<div class="layout-container">
+  {% if page.header %}
+    <header role="banner" class="site-header">
+      {{ page.header }}
+    </header>
+  {% endif %}
+
+  {% if page.primary_menu %}
+    <nav role="navigation" class="primary-menu">
+      {{ page.primary_menu }}
+    </nav>
+  {% endif %}
+
+  {% if page.breadcrumb %}
+    <div class="breadcrumb-wrapper">
+      {{ page.breadcrumb }}
+    </div>
+  {% endif %}
+
+  {% if page.highlighted %}
+    <div class="highlighted">
+      {{ page.highlighted }}
+    </div>
+  {% endif %}
+
+  <main role="main" class="main-content">
+    <a id="main-content" tabindex="-1"></a>
+
+    <div class="layout-content">
+      {{ page.content }}
+    </div>
+
+    {% if page.sidebar_first %}
+      <aside class="sidebar sidebar--first" role="complementary">
+        {{ page.sidebar_first }}
+      </aside>
+    {% endif %}
+
+    {% if page.sidebar_second %}
+      <aside class="sidebar sidebar--second" role="complementary">
+        {{ page.sidebar_second }}
+      </aside>
+    {% endif %}
+  </main>
+
+  {% if page.footer %}
+    <footer role="contentinfo" class="site-footer">
+      {{ page.footer }}
+    </footer>
+  {% endif %}
+</div>