Use PostCSS for bundling

scripts/build.sh

@@ -6,24 +6,15 @@ set -e
 # Log the start of the build process
 echo "Starting build process..."
 
-# Log the beginning of CSS compilation
+# Log the beginning of CSS compilation and data preparation
+echo "Running pre-build tasks..."
+yarn run prebuild
+echo "Pre-build tasks completed successfully."
+
+# Log the beginning of CSS building
 echo "Building CSS..."
-# Assuming sass is installed and available in the environment or Docker image
-# Compile theme.scss to theme.css
-echo "Compiling SASS to CSS..."
-sass assets/css/scss/theme.scss static/assets/css/theme.css
-echo "CSS compilation completed successfully."
-
-# Log the beginning of data fetching from WordPress
-echo "Fetching content from WordPress..."
-# Assuming Node.js and Yarn are installed and available in the environment or Docker image
-yarn run fetch-data
-echo "Content fetched successfully from WordPress."
-
-# Log the beginning of content generation for Hugo
-echo "Generating content for Hugo..."
-yarn run generate-content
-echo "Content generation for Hugo completed successfully."
+yarn run build
+echo "CSS building completed successfully."
 
 # Log the beginning of Hugo production build
 echo "Generating production build with Hugo..."

scripts/bundle-css.js

@@ -0,0 +1,46 @@
+const fs = require('fs');
+const path = require('path');
+
+// Define the CSS files to bundle in order
+const cssFiles = [
+  'static/assets/plugins/bootstrap/bootstrap.min.css',
+  'static/assets/css/theme.css',
+  'static/assets/plugins/bootstrap-icons/bootstrap-icons.css',
+  'static/assets/plugins/font-awesome/css/all.css'
+];
+
+// Output file
+const outputFile = 'static/assets/css/bundle.min.css';
+
+// Function to bundle CSS files
+function bundleCSS() {
+  let bundledCSS = '';
+  
+  console.log('Starting CSS bundling...');
+  
+  cssFiles.forEach(file => {
+    const filePath = path.join(__dirname, '..', file);
+    console.log(`Processing: ${filePath}`);
+    
+    if (fs.existsSync(filePath)) {
+      const content = fs.readFileSync(filePath, 'utf8');
+      bundledCSS += `\n/* === ${file} === */\n${content}\n`;
+      console.log(`✓ Added: ${file}`);
+    } else {
+      console.warn(`⚠ Warning: ${file} not found`);
+    }
+  });
+  
+  // Ensure output directory exists
+  const outputDir = path.dirname(outputFile);
+  if (!fs.existsSync(outputDir)) {
+    fs.mkdirSync(outputDir, { recursive: true });
+  }
+  
+  // Write bundled CSS
+  fs.writeFileSync(path.join(__dirname, '..', outputFile), bundledCSS);
+  console.log(`✓ Bundled CSS saved to: ${outputFile}`);
+}
+
+// Run the bundling
+bundleCSS();