From 53d10a96faef83a7cd815d0c6fb27a32c4d95fe5 Mon Sep 17 00:00:00 2001
From: Brian Read <brianr@bjsystems.co.uk>
Date: Fri, 20 Sep 2024 17:31:09 +0100
Subject: [PATCH] Add empty relevant css classes to css file

---
 .../CreateStarterWebsite-Custom.pm            |  2 +-
 .../CreateStarterWebsite.pm                   |  2 +-
 .../CreateStarterWebsite/_csw_PARAMS.html.ep  | 42 +++++++++----------
 .../createstarterwebsite.css                  | 22 +++++++++-
 .../createstarterwebsite.html.ep              | 18 ++++----
 .../createstarterwebsite_en.lex               | 30 ++++++-------
 Targets/DiskUsage/DiskUsage-Custom.pm         |  6 +--
 Targets/DiskUsage/DiskUsage.pm                |  2 +-
 Targets/DiskUsage/_du_PARAMS.html.ep          | 18 ++++----
 Targets/DiskUsage/diskusage.css               | 15 +++++++
 Targets/DiskUsage/diskusage.html.ep           |  8 ++--
 Targets/DiskUsage/diskusage_en.lex            | 17 ++++----
 Templates/html_controls.html.ep.xml           | 12 +++---
 Templates/layout.html.ep.tem                  |  2 +-
 json5/DiskUsage.json5                         |  3 ++
 sm2gen.py                                     | 33 +++++++++++----
 16 files changed, 146 insertions(+), 86 deletions(-)
 create mode 100644 Targets/DiskUsage/diskusage.css

diff --git a/Targets/CreateStarterWebsite/CreateStarterWebsite-Custom.pm b/Targets/CreateStarterWebsite/CreateStarterWebsite-Custom.pm
index 44fc6f9..1827615 100644
--- a/Targets/CreateStarterWebsite/CreateStarterWebsite-Custom.pm
+++ b/Targets/CreateStarterWebsite/CreateStarterWebsite-Custom.pm
@@ -1,5 +1,5 @@
 #
-# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 08:43:41 
+# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:07:43 
 #
 #
 # Routines to be edited by the developer to provide validation for parameters
diff --git a/Targets/CreateStarterWebsite/CreateStarterWebsite.pm b/Targets/CreateStarterWebsite/CreateStarterWebsite.pm
index 0176f84..ca5e1b6 100644
--- a/Targets/CreateStarterWebsite/CreateStarterWebsite.pm
+++ b/Targets/CreateStarterWebsite/CreateStarterWebsite.pm
@@ -1,6 +1,6 @@
 package SrvMngr::Controller::CreateStarterWebsite;
 #
-# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 08:43:41 
+# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:07:43 
 #
 #----------------------------------------------------------------------
 # heading     : Miscellaneous
diff --git a/Targets/CreateStarterWebsite/_csw_PARAMS.html.ep b/Targets/CreateStarterWebsite/_csw_PARAMS.html.ep
index 2b2ae3a..9efb9eb 100644
--- a/Targets/CreateStarterWebsite/_csw_PARAMS.html.ep
+++ b/Targets/CreateStarterWebsite/_csw_PARAMS.html.ep
@@ -1,5 +1,5 @@
 %#
-%# Generated by SM2Gen version:0.8 Chameleon version:3.8.1 On Python:3.12.3 at 2024-09-19 09:57:16 
+%# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:07:43 
 %#
 <div id="CreateStarterWebsite-PARAMS" class="partial CreateStarterWebsite-PARAMS">
   <script>
@@ -13,86 +13,86 @@
     % my $btn = l('csw_APPLY');
     %= form_for "CreateStarterWebsited" => (method => 'POST') => begin
 
-   	    % param 'trt' => ${prefix}_data->{trt} unless param 'trt';
-		%= hidden_field 'trt' => ${prefix}_data->{trt}
+   	    % param 'trt' => $csw_data->{trt} unless param 'trt';
+		%= hidden_field 'trt' => $csw_data->{trt}
 		%# Inputs etc in here.
 
 		<h1><%=l('csw_Create_a_starter_website')%></h1>
 	
 		<h2><%=l('csw_Manage_CreateStarterWebsite_settings:')%></h2>
 	
-		<p>
+		<p class='paragraph para1'>
 			%=l('csw_To_create_a_simple_web')
 		</p>
 	
-		<p>
+		<p class='paragraph para2'>
 			%=l('csw_You_can_leave_any_field')
 		</p>
 	
-		<p>
+		<p class='paragraph para3'>
 			%=l('csw_The_text_that_you_enter')
 		</p>
 	
-		<p>
+		<p class='paragraph para4'>
 			%=l('csw_Do_not_use_this_optionif')
 		</p>
 	
 		<p><span class=label>
 			%=l('csw_')
 		</span><span class=data>
-			% param 'companyName' => ${prefix}_data->{companyName} unless param 'companyName';
-			%= text_field 'companyName', size => '50', class => 'input' , pattern=>'.*' , placeholder=>'companyName'
+			% param 'companyName' => $csw_data->{companyName} unless param 'companyName';
+			%= text_field 'companyName', size => '50', class => 'textinput companyName' , pattern=>'.*' , placeholder=>'companyName'
 		<br></span></p>
 	
-		<p>
+		<p class='paragraph para5'>
 			%=l('csw_First_header,_typically_used_for')
 		</p>
 	
 		<p><span class=label>
 			%=l('csw_')
 		</span><span class=data>
-			% param 'header1' => ${prefix}_data->{header1} unless param 'header1';
-			%= text_field 'header1', size => '50', class => 'input' , pattern=>'.*' , placeholder=>'header1'
+			% param 'header1' => $csw_data->{header1} unless param 'header1';
+			%= text_field 'header1', size => '50', class => 'textinput header1' , pattern=>'.*' , placeholder=>'header1'
 		<br></span></p>
 	
-		<p>
+		<p class='paragraph para6'>
 			%=l('csw_Text_following_first_header,_typically')
 		</p>
 	
 		<span class=label>
 			%=l('csw_')
 		</span><span class=data>
-			% param 'text1' => ${prefix}_data->{text1} unless param 'text1';
+			% param 'text1' => $csw_data->{text1} unless param 'text1';
 			%= text_area 'text1', cols=>40, rows=>10
 		</span><br>
 	
-		<p>
+		<p class='paragraph para7'>
 			%=l('csw_Second_header,_typically_used_for')
 		</p>
 	
 		<p><span class=label>
 			%=l('csw_')
 		</span><span class=data>
-			% param 'header2' => ${prefix}_data->{header2} unless param 'header2';
-			%= text_field 'header2', size => '50', class => 'input' , pattern=>'.*' , placeholder=>'header2'
+			% param 'header2' => $csw_data->{header2} unless param 'header2';
+			%= text_field 'header2', size => '50', class => 'textinput header2' , pattern=>'.*' , placeholder=>'header2'
 		<br></span></p>
 	
-		<p>
+		<p class='paragraph para8'>
 			%=l('csw_Text_following_second_header,_typically')
 		</p>
 	
 		<span class=label>
 			%=l('csw_')
 		</span><span class=data>
-			% param 'text2' => ${prefix}_data->{text2} unless param 'text2';
+			% param 'text2' => $csw_data->{text2} unless param 'text2';
 			%= text_area 'text2', cols=>40, rows=>10
 		</span><br>
 	
-		<p>
+		<p class='paragraph para9'>
 			%=l('csw_When_you_create_this_web')
 		</p>
 	
-		<p>
+		<p class='paragraph para10'>
 			%=l('csw_Do_you_wish_to_proceed?')
 		</p>
 	
diff --git a/Targets/CreateStarterWebsite/createstarterwebsite.css b/Targets/CreateStarterWebsite/createstarterwebsite.css
index ed82125..ddd56a6 100644
--- a/Targets/CreateStarterWebsite/createstarterwebsite.css
+++ b/Targets/CreateStarterWebsite/createstarterwebsite.css
@@ -1,3 +1,23 @@
 /*
- Generated by SM2Gen version: SM2Gen version:0.8 Chameleon version:3.8.1 On Python:3.12.3 at 2024-09-19 09:57:16
+ Generated by SM2Gen version: SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:07:43
 */
+.name {}
+.rout {}
+.head {}
+.subh {}
+.para1 {}
+.para2 {}
+.para3 {}
+.para4 {}
+.text1 {}
+.para5 {}
+.text2 {}
+.para6 {}
+.text3 {}
+.para7 {}
+.text4 {}
+.para8 {}
+.text5 {}
+.para9 {}
+.para10 {}
+.subm6 {}
diff --git a/Targets/CreateStarterWebsite/createstarterwebsite.html.ep b/Targets/CreateStarterWebsite/createstarterwebsite.html.ep
index 052cb8c..404ee21 100644
--- a/Targets/CreateStarterWebsite/createstarterwebsite.html.ep
+++ b/Targets/CreateStarterWebsite/createstarterwebsite.html.ep
@@ -1,10 +1,10 @@
 %#
-%# Generated by SM2Gen version:0.8 Chameleon version:3.8.1 On Python:3.12.3 at 2024-09-19 09:57:16 
+%# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:07:43 
 %#
 % layout 'default', title => "Sme server 2 - Create Starter Website", share_dir => './';
 %# css specific to this panel:
-%= stylesheet '/css/createstarterwebsite.css'
 % content_for 'module' => begin
+%= stylesheet '/css/createstarterwebsite.css'
 <div id="module" class="module CreateStarterWebsite-panel">
 
     % if ($config->{debug} == 1) {
@@ -19,22 +19,22 @@
 	%= $c->render_to_string(inline => stash('modul') );
     % }
 
-   	%if (${prefix}_data->{first}) {
+   	%if ($csw_data->{first}) {
 	    <br><p>
-		%=$c->render_to_string(inline =>$c->l(${prefix}_data->{first}))
+		%=$c->render_to_string(inline =>$c->l($csw_data->{first}))
 		</p>
 
-	%} elsif (${prefix}_data->{success}) {
+	%} elsif ($csw_data->{success}) {
 		<div class='sme-border'>
 	       <h2> Operation Status Report</h2><p>
-			%= $c->l(${prefix}_data->{success});
+			%= $c->l($csw_data->{success});
 			</p>
 		</div>
 
-	   %} elsif (${prefix}_data->{error}) { 
+	   %} elsif ($csw_data->{error}) { 
 	   <div class='sme-error'>
 	       <h2> Operation Status Report - error</h2><p>
-			%= $c->l(${prefix}_data->{error});
+			%= $c->l($csw_data->{error});
 			</p>
     	</div>
 	%}
@@ -42,7 +42,7 @@
 	%#Routing to partials according to trt parameter.
 	%#This ought to be cascading if/then/elsif, but is easier to just stack the if/then's rather like a case statement'
 	
-	% if (${prefix}_data->{trt} eq "PARAMS") {
+	% if ($csw_data->{trt} eq "PARAMS") {
 		%= include 'partials/_csw_PARAMS'
 	%}
 	
diff --git a/Targets/CreateStarterWebsite/createstarterwebsite_en.lex b/Targets/CreateStarterWebsite/createstarterwebsite_en.lex
index 9312bfb..0f94554 100644
--- a/Targets/CreateStarterWebsite/createstarterwebsite_en.lex
+++ b/Targets/CreateStarterWebsite/createstarterwebsite_en.lex
@@ -1,21 +1,21 @@
 #
-# Generated by SM2Gen version: SM2Gen version:0.8 Chameleon version:3.8.1 On Python:3.12.3 at 2024-09-19 09:57:16
+# Generated by SM2Gen version: SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:07:43
 #
-'csw_When_you_create_this_web' => 'When you create this web page, The file index.  Htm will be overwritten in your web site directory.  ',
-'csw_Text_following_first_header,_typically' => 'Text following first header, Typically used for a paragraph of marketing information.  ',
-'csw_APPLY' => 'Apply',
-'csw_First_header,_typically_used_for' => 'First header, Typically used for short phrases such as Leader in the field of textile manufacturing',
 'csw_Create_a_starter_website' => 'Create a starter website',
-'csw_' => '',
-'csw_You_can_leave_any_field' => 'You can leave any field blank if you do not need it.  ',
-'csw_Manage_CreateStarterWebsite_settings:' => 'Manage CreateStarterWebsite settings:',
-'csw_Second_header,_typically_used_for' => 'Second header, Typically used for short phrases such as For more information or To order our products:',
-'csw_Create_Starter_Website' => 'Create Starter Website',
-'csw_Hello_PARAMS' => 'Hello PARAMS',
-'csw_Create' => 'Create',
-'csw_Do_you_wish_to_proceed?' => 'Do you wish to proceed?',
 'csw_The_text_that_you_enter' => 'The text that you enter below will be line wrapped for a nicer appearance in your web page.  Leave a blank line whenever you want to start a new paragraph.  If you need to force a line break without starting a new paragraph (for example after each line of a mailing address), Then type the four-character sequence',
-'csw_Do_not_use_this_optionif' => 'Do not use this optionif you have already customized your web site, Since it will overwrite the index.  Htm file in your web site directory.  ',
-'csw_Text_following_second_header,_typically' => 'Text following second header, Typically used for contact or ordering information:',
+'csw_First_header,_typically_used_for' => 'First header, Typically used for short phrases such as Leader in the field of textile manufacturing',
 'csw_PARAMS_panel_action_was_successful' => 'PARAMS panel action was successful',
 'csw_To_create_a_simple_web' => 'To create a simple web page for your company, Fill in the fields below and click onCreate.  ',
+'csw_Text_following_first_header,_typically' => 'Text following first header, Typically used for a paragraph of marketing information.  ',
+'csw_Text_following_second_header,_typically' => 'Text following second header, Typically used for contact or ordering information:',
+'csw_Create_Starter_Website' => 'Create Starter Website',
+'csw_Do_not_use_this_optionif' => 'Do not use this optionif you have already customized your web site, Since it will overwrite the index.  Htm file in your web site directory.  ',
+'csw_Manage_CreateStarterWebsite_settings:' => 'Manage CreateStarterWebsite settings:',
+'csw_' => '',
+'csw_Hello_PARAMS' => 'Hello PARAMS',
+'csw_Second_header,_typically_used_for' => 'Second header, Typically used for short phrases such as For more information or To order our products:',
+'csw_When_you_create_this_web' => 'When you create this web page, The file index.  Htm will be overwritten in your web site directory.  ',
+'csw_Do_you_wish_to_proceed?' => 'Do you wish to proceed?',
+'csw_Create' => 'Create',
+'csw_You_can_leave_any_field' => 'You can leave any field blank if you do not need it.  ',
+'csw_APPLY' => 'Apply',
diff --git a/Targets/DiskUsage/DiskUsage-Custom.pm b/Targets/DiskUsage/DiskUsage-Custom.pm
index 18a97ca..df231d3 100644
--- a/Targets/DiskUsage/DiskUsage-Custom.pm
+++ b/Targets/DiskUsage/DiskUsage-Custom.pm
@@ -1,10 +1,10 @@
 #
+# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:30:21 
+#
+#
 # Routines to be edited by the developer to provide validation for parameters
 # and provison of the control data for table(s)
 #
-# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-15 10:49 
-#
-
 use esmith::util;
 use esmith::HostsDB;
 use esmith::AccountsDB;
diff --git a/Targets/DiskUsage/DiskUsage.pm b/Targets/DiskUsage/DiskUsage.pm
index a572c97..798b0e0 100644
--- a/Targets/DiskUsage/DiskUsage.pm
+++ b/Targets/DiskUsage/DiskUsage.pm
@@ -1,6 +1,6 @@
 package SrvMngr::Controller::DiskUsage;
 #
-# Generated by version:SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-16 11:18 
+# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:30:21 
 #
 #----------------------------------------------------------------------
 # heading     : Miscellaneous
diff --git a/Targets/DiskUsage/_du_PARAMS.html.ep b/Targets/DiskUsage/_du_PARAMS.html.ep
index 0090872..69439f7 100644
--- a/Targets/DiskUsage/_du_PARAMS.html.ep
+++ b/Targets/DiskUsage/_du_PARAMS.html.ep
@@ -1,5 +1,5 @@
 %#
-%# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-16 11:18 
+%# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:30:21 
 %#
 <div id="DiskUsage-PARAMS" class="partial DiskUsage-PARAMS">
   <script>
@@ -21,11 +21,11 @@
 	
 		<h2><%=l('du_Manage_DiskUsage_settings:')%></h2>
 	
-		<p>
+		<p class='paragraph para1'>
 			%=l('du_Wed_Sep_11_19:01:00_BST')
 		</p>
 	
-<pre>
+<pre class='preformatted pref1'>
 	Filesystem             Size  Used Avail Use% Mounted on
 /dev/mapper/main-root   29G  4.8G   24G  17% /
 devtmpfs               2.0G     0  2.0G   0% /dev
@@ -36,15 +36,15 @@ tmpfs                  2.0G  648K  2.0G   1% /run
 </pre>
 	
 	
-		<br /><table class="sme-border TableSort sme-table">
-			<thead>
+		<br /><table class="sme-border TableSort sme-table tabl1 ">
+			<thead class='tabl1'>
 				<tr table-head-row>
 					<th class='sme-border table-head-col table-head-col-I-bays '><%=l('du_I-bays')%></th>
 					<th class='sme-border table-head-col table-head-col-Usage '><%=l('du_Usage')%></th>
 					<th class='sme-border table-head-col table-head-col-Path '><%=l('du_Path')%></th>
 				</tr>
 			</thead>
-			<tbody>
+			<tbody class='tabl1'>
 				% my $control_data = $self->stash('Table1');
 				% foreach my $row (@$control_data) {
 				<tr class='table-row'>
@@ -57,15 +57,15 @@ tmpfs                  2.0G  648K  2.0G   1% /run
 		</table>
 		
 	
-		<br /><table class="sme-border TableSort sme-table">
-			<thead>
+		<br /><table class="sme-border TableSort sme-table tabl2 ">
+			<thead class='tabl2'>
 				<tr table-head-row>
 					<th class='sme-border table-head-col table-head-col-Users '><%=l('du_Users')%></th>
 					<th class='sme-border table-head-col table-head-col-Usage '><%=l('du_Usage')%></th>
 					<th class='sme-border table-head-col table-head-col-Path '><%=l('du_Path')%></th>
 				</tr>
 			</thead>
-			<tbody>
+			<tbody class='tabl2'>
 				% my $control_data = $self->stash('Table2');
 				% foreach my $row (@$control_data) {
 				<tr class='table-row'>
diff --git a/Targets/DiskUsage/diskusage.css b/Targets/DiskUsage/diskusage.css
new file mode 100644
index 0000000..8e9f55e
--- /dev/null
+++ b/Targets/DiskUsage/diskusage.css
@@ -0,0 +1,15 @@
+/*
+ Generated by SM2Gen version: SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:30:21
+*/
+.name {}
+.rout {}
+.head {}
+.subh {}
+.para1 {}
+.pref1 {}
+.tabl1 {}
+thead .tabl1 {}
+tboay .tabl1 {}
+.tabl2 {}
+thead .tabl2 {}
+tboay .tabl2 {}
diff --git a/Targets/DiskUsage/diskusage.html.ep b/Targets/DiskUsage/diskusage.html.ep
index 5723156..c0a170e 100644
--- a/Targets/DiskUsage/diskusage.html.ep
+++ b/Targets/DiskUsage/diskusage.html.ep
@@ -1,8 +1,10 @@
+%#
+%# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:30:21 
+%#
 % layout 'default', title => "Sme server 2 - Disk Usage", share_dir => './';
-%#
-%# Generated by SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-16 11:18 
-%#
+%# css specific to this panel:
 % content_for 'module' => begin
+%= stylesheet '/css/diskusage.css'
 <div id="module" class="module DiskUsage-panel">
 
     % if ($config->{debug} == 1) {
diff --git a/Targets/DiskUsage/diskusage_en.lex b/Targets/DiskUsage/diskusage_en.lex
index f896851..65928de 100644
--- a/Targets/DiskUsage/diskusage_en.lex
+++ b/Targets/DiskUsage/diskusage_en.lex
@@ -1,11 +1,14 @@
-'du_Path' => 'Path',
+#
+# Generated by SM2Gen version: SM2Gen version:0.8 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:30:21
+#
+'du_Hello_PARAMS' => 'Hello PARAMS',
+'du_Usage' => 'Usage',
+'du_Users' => 'Users',
 'du_I-bays' => 'I-bays',
-'du_PARAMS_panel_action_was_successful' => 'PARAMS panel action was successful',
+'du_Disk_Usage' => 'Disk Usage',
 'du_Disk_usage' => 'Disk usage',
+'du_PARAMS_panel_action_was_successful' => 'PARAMS panel action was successful',
+'du_Manage_DiskUsage_settings:' => 'Manage DiskUsage settings:',
 'du_APPLY' => 'Apply',
 'du_Wed_Sep_11_19:01:00_BST' => 'Wed Sep 11 19:01:00 BST 2024',
-'du_Users' => 'Users',
-'du_Manage_DiskUsage_settings:' => 'Manage DiskUsage settings:',
-'du_Hello_PARAMS' => 'Hello PARAMS',
-'du_Disk_Usage' => 'Disk Usage',
-'du_Usage' => 'Usage',
+'du_Path' => 'Path',
diff --git a/Templates/html_controls.html.ep.xml b/Templates/html_controls.html.ep.xml
index 844d9a6..a87ea09 100644
--- a/Templates/html_controls.html.ep.xml
+++ b/Templates/html_controls.html.ep.xml
@@ -42,7 +42,7 @@
 			%=l('${prefix}_${Label}')
 		</span><span class=data>
 			% param '${Name}' => $$${prefix}_data->{${Name}} unless param '${Name}';
-			%= text_field '${Name}', size => '${size | 50}', class => 'input' , pattern=>'${regexp | ".*"}' , placeholder=>'${placeholder | Name}'
+			%= text_field '${Name}', size => '${size | 50}', class => 'textinput ${Name}' , pattern=>'${regexp | ".*"}' , placeholder=>'${placeholder | Name}'
 		<br></span></p>
 	]]></Text>
 
@@ -55,7 +55,7 @@
 	</Header>
 	
 	<Paragraph><![CDATA[
-		<p>
+		<p class='paragraph para${type_serial}'>
 			%=l('${Value}')
 		</p>
 	]]></Paragraph>
@@ -194,13 +194,13 @@
 	</checkbox>
 
 	<Table><![CDATA[
-		<br /><table class="sme-border TableSort sme-table">
-			<thead>
+		<br /><table class="sme-border TableSort sme-table ${classname} ">
+			<thead class='${classname}'>
 				<tr table-head-row><tal:block tal:repeat="ColHead TopHeadings">
 					<th class='sme-border table-head-col table-head-col-${ColHead} '><%=l('${ColHead}')%></th></tal:block>
 				</tr>
 			</thead>
-			<tbody>
+			<tbody class='${classname}'>
 				% my $control_data = $self->stash('${TableControl}');
 				% foreach my $row (@$control_data) {
 				<tr class='table-row'><tal:block tal:repeat="ColContent Columns">
@@ -213,7 +213,7 @@
 	</Table>
 	
 	<Preformatted><![CDATA[
-<pre>
+<pre class='preformatted pref${type_serial}'>
 	${Value}'
 </pre>
 	]]>
diff --git a/Templates/layout.html.ep.tem b/Templates/layout.html.ep.tem
index 1962302..a46329e 100644
--- a/Templates/layout.html.ep.tem
+++ b/Templates/layout.html.ep.tem
@@ -3,8 +3,8 @@
 %#
 % layout 'default', title => "Sme server 2 - ${MenuDescription}", share_dir => './';
 %# css specific to this panel:
-%= stylesheet '/css/${lcPackageName}.css'
 % content_for 'module' => begin
+%= stylesheet '/css/${lcPackageName}.css'
 <div id="module" class="module ${PackageName}-panel">
 
     % if ($config->{debug} == 1) {
diff --git a/json5/DiskUsage.json5 b/json5/DiskUsage.json5
index 0e9e289..f9923c6 100644
--- a/json5/DiskUsage.json5
+++ b/json5/DiskUsage.json5
@@ -1,3 +1,6 @@
+//
+// Generated by sm1-html-2-json5 version:0.5 Chameleon version:4.5.4 On Python:3.12.3 at 2024-09-19 12:30:19
+//
 {
     'PackageName': 'DiskUsage',
     'prefix': 'du',
diff --git a/sm2gen.py b/sm2gen.py
index 2874515..9c8f87f 100644
--- a/sm2gen.py
+++ b/sm2gen.py
@@ -562,10 +562,6 @@ if __name__ == "__main__":
 	except Exception as e:
 		print(f"A Chameleon template layout file error occurred: {e}")
 		
-	# Create the css file (empty for now, except the header)
-	# maybe it should have empty expamples of all the relevant classes?
-	with open(css_file, "w") as file:
-		file.write(f"/*\n Generated by SM2Gen version: {strVersion}\n*/\n")
 	
 	# Generate a partial file for each of the entries in the html list
 	# Pull in the template code for each of the input types
@@ -595,32 +591,48 @@ if __name__ == "__main__":
 		# Now generate the controls from the rest of the entries in the dict.
 		all_controls_html = ""
 		prefix_is = hl("prefix")
+		acc_css_entries = "";  #One entry for each class created for html entries
 		for html_control in html:
 			inner_html = html[html_control]
 			if isinstance(inner_html, dict):
+				# input or table
+				html_Type = inner_html['Type']
+				type_serial = "".join(char for char in html_control if char.isdigit())
+				class_name = html_Type.lower()[:4]+type_serial
+				acc_css_entries += f".{class_name} {{}}\n"
+				if html_Type == "Table":
+					acc_css_entries += f"thead .{class_name} {{}}\n"
+					acc_css_entries += f"tboay .{class_name} {{}}\n"
 				try:
 					control_template = PageTemplate(html_controls[inner_html["Type"]])
 					try:
 						control_html = control_template.render(
-							version=strVersion, **inner_html, prefix=prefix_is
+							version=strVersion, **inner_html, prefix=prefix_is,
+							classname=class_name
 						)
 						all_controls_html = all_controls_html + control_html
 					except Exception as e:
 						print(
-							f"A Chameleon render on partial file control {inner_html['Name']} error occurred: {e}"
+							f"A Chameleon render on partial file control {html_control} error occurred: {e}"
 						)
 				except Exception as e:
 					print(
-						f"A Chameleon render on partial file control {inner_html['Name']} error occurred: {e}"
+						f"A Chameleon render on partial file control {html_control} error occurred: {e}"
 					)
 			else:
 				# just a simple entry - name less numerics is type
 				html_Type = "".join(char for char in html_control if not char.isdigit())
+				type_serial = "".join(char for char in html_control if char.isdigit())
+				class_name = html_Type.lower()[:4]+type_serial
+				acc_css_entries += f".{class_name} {{}}\n"
+				if not type_serial == "":
+					print(html_control,html_Type,type_serial)
 				try:
 					simple_control_template = PageTemplate(html_controls[html_Type])
 					try:
 						simple_control_html = simple_control_template.render(
-							version=strVersion, Value=inner_html, prefix=prefix_is
+							version=strVersion, Value=inner_html, prefix=prefix_is,
+							type_serial=type_serial
 						)
 						all_controls_html = all_controls_html + simple_control_html
 					except Exception as e:
@@ -650,6 +662,11 @@ if __name__ == "__main__":
 		print(f"Content modified and saved to {partial_files[i]}")
 		i += 1
 
+	# Create the css file (the header, followed by a dumy entry for each class created/used above)
+	with open(css_file, "w") as file:
+		file.write(f"/*\n Generated by SM2Gen version: {strVersion}\n*/\n")
+		file.write(acc_css_entries);
+
 	# Now generate the <name>.en file
 	# Look through the generated files for the /l[\s|(]['|"](.*)['|"]\)/ strings.