add fittopage checkbox + custom print options

two bugs here:
- accidently comparing with == instead != against error
- using return instead of continue during for loop

controllers/printController.go

@@ -182,8 +182,9 @@ func (rc *printController) PrintHandler(c *gin.Context) {
 		for _, printJob := range printJobs {
 			err := printJob.Execute()
 
-			if err == nil {
-				return
+			if err != nil {
+				fmt.Printf("Error: %s\n", err)
+				continue
 			}
 
 			printJob.ShopItem.WasPrinted = true
@@ -192,7 +193,6 @@ func (rc *printController) PrintHandler(c *gin.Context) {
 			if err != nil {
 				fmt.Printf("Error: %s\n", err)
 			}
-
 		}
 	}
 

controllers/shopItemController.go

@@ -78,6 +78,8 @@ func (rc *shopItemController) NewShopItemFromForm(ctx *gin.Context) (models.Shop
 	image, err := ctx.FormFile("image")
 	dstImage := defaultImagePath
 	printMode := ctx.PostForm("print-mode")
+	fitToPage := ctx.PostForm("fit-to-page")
+	customPrintOptions := ctx.PostForm("custom-print-options")
 
 	if err == nil {
 		dstImage = filepath.Join("static/uploads", image.Filename)
@@ -150,18 +152,26 @@ func (rc *shopItemController) NewShopItemFromForm(ctx *gin.Context) (models.Shop
 		})
 	}
 
+	doFit := false
+	fmt.Println("FitToPage: ", fitToPage)
+	if fitToPage == "true" {
+		doFit = true
+	}
+
 	shopItem := models.ShopItem{
-		Name:        name,
-		Abstract:    abstract,
-		Description: description,
-		Category:    category,
-		IsPublic:    true,
-		BasePrice:   rc.GetBasePrice(variants),
-		Image:       dstImage,
-		Pdf:         dstPdf,
-		Variants:    variants,
-		PrintMode:   printMode,
-		WasPrinted:  false,
+		Name:               name,
+		Abstract:           abstract,
+		Description:        description,
+		Category:           category,
+		IsPublic:           true,
+		BasePrice:          rc.GetBasePrice(variants),
+		Image:              dstImage,
+		Pdf:                dstPdf,
+		Variants:           variants,
+		PrintMode:          printMode,
+		WasPrinted:         false,
+		FitToPage:          doFit,
+		CustomPrintOptions: customPrintOptions,
 	}
 
 	fmt.Println("Creating Shopitem: ", shopItem)
@@ -391,17 +401,19 @@ func (rc *shopItemController) AddItemsHandler(c *gin.Context) {
 		}
 
 		shopItem := models.ShopItem{
-			Name:        file.Filename,
-			Abstract:    file.Filename,
-			Description: file.Filename,
-			Category:    category,
-			IsPublic:    true,
-			BasePrice:   rc.GetBasePrice(variants),
-			Image:       dstImage,
-			Pdf:         dstPdf,
-			Variants:    variants,
-			PrintMode:   "CreateBooklet",
-			WasPrinted:  false,
+			Name:               file.Filename,
+			Abstract:           file.Filename,
+			Description:        file.Filename,
+			Category:           category,
+			IsPublic:           true,
+			BasePrice:          rc.GetBasePrice(variants),
+			Image:              dstImage,
+			Pdf:                dstPdf,
+			Variants:           variants,
+			PrintMode:          "CreateBooklet",
+			WasPrinted:         false,
+			FitToPage:          false,
+			CustomPrintOptions: "",
 		}
 
 		_, err = repositories.ShopItems.Create(shopItem)
@@ -540,6 +552,8 @@ func (rc *shopItemController) EditItemHandler(c *gin.Context) {
 	newShopItem.BasePrice = shopItem.BasePrice
 	newShopItem.IsPublic = shopItem.IsPublic
 	newShopItem.WasPrinted = false
+	newShopItem.FitToPage = shopItem.FitToPage
+	newShopItem.CustomPrintOptions = shopItem.CustomPrintOptions
 
 	if len(shopItem.Tags) != 0 {
 		newShopItem.Tags = shopItem.Tags

flake.lock

@@ -2,11 +2,11 @@
   "nodes": {
     "nixpkgs": {
       "locked": {
-        "lastModified": 1744463964,
-        "narHash": "sha256-LWqduOgLHCFxiTNYi3Uj5Lgz0SR+Xhw3kr/3Xd0GPTM=",
+        "lastModified": 1765186076,
+        "narHash": "sha256-hM20uyap1a0M9d344I692r+ik4gTMyj60cQWO+hAYP8=",
         "owner": "nixos",
         "repo": "nixpkgs",
-        "rev": "2631b0b7abcea6e640ce31cd78ea58910d31e650",
+        "rev": "addf7cf5f383a3101ecfba091b98d0a1263dc9b8",
         "type": "github"
       },
       "original": {

flake.nix

@@ -19,7 +19,7 @@
       packages = with pkgs; [
         go
         gotools
-        poppler_utils #get first pdf page to png
+        poppler-utils #get first pdf page to png
         cups
         imagemagick
         tailwindcss
@@ -29,7 +29,7 @@
     packages.zineshop = nixpkgs.legacyPackages.x86_64-linux.buildGoModule {
       pname = "zineshop";
       version = "1.0";
-      vendorHash = "sha256-0M/xblZXVw4xIFZeDewYrFu7VGUCsPTPG13r9ZpTGJo=";
+      vendorHash = "sha256-aMB2kRVNvBmZO6YIMCXvENPL4NEOb4AOaMvSf8+z3xw=";
       src = ./.;
 
       postInstall = ''
@@ -72,7 +72,7 @@
         config = lib.mkIf cfg.enable {
           environment.systemPackages = [ 
             zineshop-pkg
-            pkgs.poppler_utils #get first pdf page to png
+            pkgs.poppler-utils #get first pdf page to png
             pkgs.cups
             pkgs.imagemagick
           ];
@@ -104,7 +104,7 @@
               WorkingDirectory = "/var/lib/zineshop";
               ExecStart = pkgs.writeScript "start-zineshop" ''
                 #! ${pkgs.bash}/bin/bash
-                PATH="$PATH:${lib.makeBinPath [ pkgs.poppler_utils pkgs.cups pkgs.imagemagick ]}"
+                PATH="$PATH:${lib.makeBinPath [ pkgs.poppler-utils pkgs.cups pkgs.imagemagick ]}"
                 ${zineshop-pkg}/bin/zineshop
               '';
               Restart = "on-failure";

models/printer.go

@@ -19,6 +19,7 @@ const (
 	ShortEdge     PrintOption = "-o Binding=TopBinding"
 	CreateBooklet PrintOption = "-o Combination=Booklet -o PageSize=A5"
 	TriFold       PrintOption = "-o Fold=TriFold -o Binding=TopBinding"
+	FitToPage     PrintOption = "-o fit-to-page"
 )
 
 type OldPrintJob struct {
@@ -101,7 +102,12 @@ func (p *PrintJob) GeneratePrintOptions() []PrintOption {
 		result = append(result, CoverPage)
 	}
 
+	if p.ShopItem.FitToPage {
+		result = append(result, FitToPage)
+	}
+
 	result = append(result, GetPrintMode(p.ShopItem.PrintMode))
+	result = append(result, PrintOption(p.ShopItem.CustomPrintOptions))
 	return result
 }
 

models/shopItem.go

@@ -42,16 +42,18 @@ type ItemVariant struct {
 
 type ShopItem struct {
 	gorm.Model
-	Name        string        `json:"name" binding:"required" gorm:"unique;not null"`
-	Abstract    string        `json:"abstract" binding:"required"`
-	Description string        `json:"description" binding:"required"`
-	Category    Category      `json:"category"`
-	Variants    []ItemVariant `json:"variant"`
-	BasePrice   float64       `json:"basePrice"`
-	IsPublic    bool          `json:"isPublic" gorm:"default:true"`
-	Tags        []Tag         `gorm:"many2many:item_tags;"`
-	Image       string
-	Pdf         string
-	PrintMode   string `json:"printMode" gorm:"default:CreateBooklet"`
-	WasPrinted  bool   `gorm:"default:false"`
+	Name               string        `json:"name" binding:"required" gorm:"unique;not null"`
+	Abstract           string        `json:"abstract" binding:"required"`
+	Description        string        `json:"description" binding:"required"`
+	Category           Category      `json:"category"`
+	Variants           []ItemVariant `json:"variant"`
+	BasePrice          float64       `json:"basePrice"`
+	IsPublic           bool          `json:"isPublic" gorm:"default:true"`
+	Tags               []Tag         `gorm:"many2many:item_tags;"`
+	Image              string
+	Pdf                string
+	PrintMode          string `json:"printMode" gorm:"default:CreateBooklet"`
+	CustomPrintOptions string `gorm:"default:''"`
+	FitToPage          bool   `gorm:"default:false"`
+	WasPrinted         bool   `gorm:"default:false"`
 }

static/output.css

@@ -583,6 +583,10 @@ video {
   right: 0px;
 }
 
+.col-span-1 {
+  grid-column: span 1 / span 1;
+}
+
 .col-span-12 {
   grid-column: span 12 / span 12;
 }
@@ -591,6 +595,10 @@ video {
   grid-column: span 3 / span 3;
 }
 
+.col-span-7 {
+  grid-column: span 7 / span 7;
+}
+
 .-m-1\.5 {
   margin: -0.375rem;
 }
@@ -754,6 +762,10 @@ video {
   width: 3rem;
 }
 
+.w-16 {
+  width: 4rem;
+}
+
 .w-4 {
   width: 1rem;
 }
@@ -854,6 +866,10 @@ video {
   align-items: center;
 }
 
+.items-stretch {
+  align-items: stretch;
+}
+
 .justify-center {
   justify-content: center;
 }
@@ -887,6 +903,12 @@ video {
   row-gap: 1rem;
 }
 
+.space-x-2 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
+}
+
 .space-x-4 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-x-reverse: 0;
   margin-right: calc(1rem * var(--tw-space-x-reverse));
@@ -945,14 +967,6 @@ video {
   word-break: normal;
 }
 
-.break-words {
-  overflow-wrap: break-word;
-}
-
-.break-all {
-  word-break: break-all;
-}
-
 .rounded {
   border-radius: 0.25rem;
 }
@@ -2139,6 +2153,10 @@ video {
     display: flex;
   }
 
+  .sm\:grid {
+    display: grid;
+  }
+
   .sm\:hidden {
     display: none;
   }
@@ -2151,6 +2169,10 @@ video {
     max-width: 24rem;
   }
 
+  .sm\:grid-cols-8 {
+    grid-template-columns: repeat(8, minmax(0, 1fr));
+  }
+
   .sm\:items-center {
     align-items: center;
   }
@@ -2285,129 +2307,3 @@ video {
     padding-right: 0px;
   }
 }
-
-@media (prefers-color-scheme: dark) {
-  .dark\:hidden {
-    display: none;
-  }
-
-  .dark\:divide-gray-800 > :not([hidden]) ~ :not([hidden]) {
-    --tw-divide-opacity: 1;
-    border-color: rgb(31 41 55 / var(--tw-divide-opacity, 1));
-  }
-
-  .dark\:divide-neutral-700 > :not([hidden]) ~ :not([hidden]) {
-    --tw-divide-opacity: 1;
-    border-color: rgb(64 64 64 / var(--tw-divide-opacity, 1));
-  }
-
-  .dark\:border-gray-600 {
-    --tw-border-opacity: 1;
-    border-color: rgb(75 85 99 / var(--tw-border-opacity, 1));
-  }
-
-  .dark\:border-gray-700 {
-    --tw-border-opacity: 1;
-    border-color: rgb(55 65 81 / var(--tw-border-opacity, 1));
-  }
-
-  .dark\:border-gray-800 {
-    --tw-border-opacity: 1;
-    border-color: rgb(31 41 55 / var(--tw-border-opacity, 1));
-  }
-
-  .dark\:bg-gray-600 {
-    --tw-bg-opacity: 1;
-    background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1));
-  }
-
-  .dark\:bg-gray-700 {
-    --tw-bg-opacity: 1;
-    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
-  }
-
-  .dark\:bg-gray-800 {
-    --tw-bg-opacity: 1;
-    background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
-  }
-
-  .dark\:bg-gray-900 {
-    --tw-bg-opacity: 1;
-    background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
-  }
-
-  .dark\:bg-red-600 {
-    --tw-bg-opacity: 1;
-    background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));
-  }
-
-  .dark\:text-gray-300 {
-    --tw-text-opacity: 1;
-    color: rgb(209 213 219 / var(--tw-text-opacity, 1));
-  }
-
-  .dark\:text-gray-400 {
-    --tw-text-opacity: 1;
-    color: rgb(156 163 175 / var(--tw-text-opacity, 1));
-  }
-
-  .dark\:text-gray-900 {
-    --tw-text-opacity: 1;
-    color: rgb(17 24 39 / var(--tw-text-opacity, 1));
-  }
-
-  .dark\:text-neutral-200 {
-    --tw-text-opacity: 1;
-    color: rgb(229 229 229 / var(--tw-text-opacity, 1));
-  }
-
-  .dark\:text-neutral-500 {
-    --tw-text-opacity: 1;
-    color: rgb(115 115 115 / var(--tw-text-opacity, 1));
-  }
-
-  .dark\:text-white {
-    --tw-text-opacity: 1;
-    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
-  }
-
-  .dark\:placeholder-gray-400::-moz-placeholder {
-    --tw-placeholder-opacity: 1;
-    color: rgb(156 163 175 / var(--tw-placeholder-opacity, 1));
-  }
-
-  .dark\:placeholder-gray-400::placeholder {
-    --tw-placeholder-opacity: 1;
-    color: rgb(156 163 175 / var(--tw-placeholder-opacity, 1));
-  }
-
-  .dark\:hover\:bg-gray-600:hover {
-    --tw-bg-opacity: 1;
-    background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1));
-  }
-
-  .dark\:hover\:bg-gray-700:hover {
-    --tw-bg-opacity: 1;
-    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
-  }
-
-  .dark\:hover\:text-white:hover {
-    --tw-text-opacity: 1;
-    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
-  }
-
-  .dark\:focus\:border-blue-500:focus {
-    --tw-border-opacity: 1;
-    border-color: rgb(59 130 246 / var(--tw-border-opacity, 1));
-  }
-
-  .dark\:focus\:ring-blue-500:focus {
-    --tw-ring-opacity: 1;
-    --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));
-  }
-
-  .dark\:focus\:ring-gray-700:focus {
-    --tw-ring-opacity: 1;
-    --tw-ring-color: rgb(55 65 81 / var(--tw-ring-opacity, 1));
-  }
-}

views/additem.html

@@ -25,7 +25,7 @@
 
       <div>
         <label for="description" class="block text-sm/6 font-medium text-gray-900" for="passwordConfirmation">Description</label>
-        <textarea id="description" name="description" type="textarea" class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring"></textarea>
+        <textarea id="description" name="description" type="textarea" class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md focus:border-blue-500 focus:outline-none focus:ring"></textarea>
       </div>
 
        <div class="mb-4">
@@ -127,7 +127,7 @@
       <label class="block text-sm font-medium text-gray-900">
         Print Mode
       </label>
-      <select name="print-mode" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+      <select name="print-mode" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 ">
         <option selected value="CreateBooklet">Create Booklet</option>
           <option value="LongEdge">Long Edge</option>
           <option value="ShortEdge">Short Edge</option>

views/cart.html

@@ -62,7 +62,7 @@
                 <form action="/checkout" method="GET">
                 <div class="flex flex-col md:flex-row items-center md:items-center justify-between lg:px-6 pb-6 border-b border-gray-200 max-lg:max-w-lg max-lg:mx-auto">
                   <h2 class="text-gray-900 font-manrope font-semibold leading-9 w-full max-md:text-center max-md:mb-4">Select shipping method</h2>
-                      <select name="shippingMethod" id="shippingMethod" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+                      <select name="shippingMethod" id="shippingMethod" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 ">
                         <option selected value="">Shipping</option>
                         {{ range .data.shipping }}
                           <option value="{{ .Id }}">{{ .Name }} - {{ .Price }}€</option>

views/checkout.html

@@ -70,7 +70,7 @@
 
       <div>
         <label for="comment" class="block text-sm/6 font-medium text-gray-900" for="passwordConfirmation">Comment</label>
-        <textarea id="comment" name="comment" type="textarea" class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring"></textarea>
+        <textarea id="comment" name="comment" type="textarea" class="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md focus:border-blue-500 focus:outline-none focus:ring"></textarea>
       </div>
 
       <p class="mt-10 text-center text-sm/6 text-red-500">

views/edititem.html

@@ -62,14 +62,14 @@
 
       <div>
         <label for="description" class="block text-sm/6 font-medium text-gray-900">Description</label>
-        <textarea id="description" name="description" type="textarea" class="block w-full px-4 py-2 mt-2 text-gray-900 bg-white border border-gray-300 rounded-md dark:bg-gray-800 dark:text-gray-900 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring">{{ .data.shopItem.Description}}</textarea>
+        <textarea id="description" name="description" type="textarea" class="block w-full px-4 py-2 mt-2 text-gray-900 bg-white border border-gray-300 rounded-md focus:border-blue-500 focus:outline-none focus:ring">{{ .data.shopItem.Description}}</textarea>
       </div>
 
       <label class="block text-sm/6 font-medium text-gray-900">
         Print Mode
       </label>
       <select name="print-mode" required class="bg-white border border-gray-300 text-gray-900 text-sm rounded-lg
-        focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+        focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 ">
         <option selected value="{{ .data.shopItem.PrintMode }}">{{ .data.shopItem.PrintMode }}</option>
           <option value="CreateBooklet">CreateBooklet</option>
           <option value="LongEdge">Long Edge</option>
@@ -77,6 +77,20 @@
           <option value="TriFold">Tri-Fold (Flyer)</option>
       </select>
 
+      <label class="flex text-sm/6 items-center">
+        <input type="checkbox" {{ if .data.shopItem.FitToPage }} checked {{ else }} {{ end }} class="form-checkbox h-4 w-4 text-gray-900"
+        value="true" name="fit-to-page">
+          <span class="ml-2 text-sm/6 text-gray-900">Fit to Page</span>
+      </label>
+
+
+      <div>
+        <label for="custom-print-options" class="block text-sm/6 font-medium text-gray-900">Custom Print Options:</label>
+        <textarea id="custom-print-options" name="custom-print-options" type="textarea" class="block w-full px-4 py-2
+          mt-2 text-gray-900 bg-white border border-gray-300 rounded-md focus:border-blue-500 focus:outline-none
+          focus:ring">{{ .data.shopItem.CustomPrintOptions}}</textarea>
+      </div>
+
 
        <div class="mb-4">
            <label class="block text-sm/6 text-gray-900">Select Categories</label>

views/editorders.html

@@ -14,7 +14,7 @@
         <div class="flex">
           <input type="text" id="name" name="name" value="{{ .Token }}" readonly="readonly" class="flex-grow border border-gray-300 rounded-md p-2 focus:outline-none focus:ring focus:ring-blue-500">
           <div>
-      <select name="order-status" required class="bg-gray-50 border ml-4 border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+      <select name="order-status" required class="bg-gray-50 border ml-4 border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block p-2.5 ">
         <option selected value="{{ .Status }}">{{ .Status }}</option>
           <option value="AwaitingConfirmation">AwaitingConfirmation</option>
           <option value="Received">Received</option>

views/invoice.html

@@ -1,31 +1,31 @@
   <div class="-m-1.5 overflow-x-auto">
     <div class="p-1.5 min-w-full inline-block align-middle">
       <div class="overflow-hidden">
-        <table class="min-w-full divide-y divide-gray-200 dark:divide-neutral-700">
+        <table class="min-w-full divide-y divide-gray-200 ">
           <thead>
             <tr>
-              <th scope="col" class="px-6 py-3 text-start text-xs font-medium text-gray-500 uppercase dark:text-neutral-500"></th>
-              <th scope="col" class="px-6 py-3 text-start text-xs font-medium text-gray-500 uppercase dark:text-neutral-500">Name</th>
-              <th scope="col" class="px-6 py-3 text-end text-xs font-medium text-gray-500 uppercase dark:text-neutral-500">Paper</th>
-              <th scope="col" class="px-6 py-3 text-end text-xs font-medium text-gray-500 uppercase dark:text-neutral-500">Amount</th>
-              <th scope="col" class="px-6 py-3 text-end text-xs font-medium text-gray-500 uppercase dark:text-neutral-500">Price</th>
+              <th scope="col" class="px-6 py-3 text-start text-xs font-medium text-gray-500 uppercase "></th>
+              <th scope="col" class="px-6 py-3 text-start text-xs font-medium text-gray-500 uppercase ">Name</th>
+              <th scope="col" class="px-6 py-3 text-end text-xs font-medium text-gray-500 uppercase ">Paper</th>
+              <th scope="col" class="px-6 py-3 text-end text-xs font-medium text-gray-500 uppercase ">Amount</th>
+              <th scope="col" class="px-6 py-3 text-end text-xs font-medium text-gray-500 uppercase ">Price</th>
             </tr>
           </thead>
-          <tbody class="divide-y divide-gray-200 dark:divide-neutral-700">
+          <tbody class="divide-y divide-gray-200 ">
         {{ range .PrintJobs }}
             <tr>
-              <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-neutral-200">
+              <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 ">
                         <a href="/shopitems/{{ .Variant.ShopItemID }}" class="flex items-center aspect-square w-8 h-10 shrink-0">
-                            <img class="h-auto w-full max-h-full dark:hidden" src="/{{ .ShopItem.Image }}" alt="imac image" />
+                            <img class="h-auto w-full max-h-full " src="/{{ .ShopItem.Image }}" alt="imac image" />
                         </a>
               </td>
-              <td class="px-6 py-4 text-sm text-gray-800 dark:text-neutral-200">
+              <td class="px-6 py-4 text-sm text-gray-800 ">
                 <div class="text-sm break-normal">
                   <p>{{ .ShopItem.Name }}</p>
                   <p>{{ .Variant.Name }}</p>
                 </div>
               </td>
-              <td class="px-6 py-4 text-sm text-gray-800 dark:text-neutral-200">
+              <td class="px-6 py-4 text-sm text-gray-800 ">
                 <div class="text-xs">
                   <p>{{ .PaperType.Brand }} - {{.PaperType.Name }}: {{ .PaperType.Size }} {{ .PaperType.Weight }}g</p>
                   {{ if .CoverPaperType }}
@@ -33,20 +33,20 @@
                   {{ end }}
                 </div>
               </td>
-              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-neutral-200">{{ .Amount }}</td>
-              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-neutral-200">{{ .PriceTotal }}</td>
+              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 ">{{ .Amount }}</td>
+              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 ">{{ .PriceTotal }}</td>
             </tr>
 
       {{ end }}
 
             <tr>
-              <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-neutral-200">
+              <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 ">
                 <b>TOTAL</b>
               </td>
-              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-neutral-200"></td>
-              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-neutral-200"></td>
-              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-neutral-200"></td>
-              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-neutral-200"><b>{{ .PriceTotal }}</b></td>
+              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 "></td>
+              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 "></td>
+              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 "></td>
+              <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 "><b>{{ .PriceTotal }}</b></td>
             </tr>
           </tbody>
         </table>

views/order.html

@@ -1,27 +1,27 @@
 {{ template "header.html" . }}
 
-<section class="bg-white py-8 antialiased dark:bg-gray-900 md:py-16">
+<section class="bg-white py-8 antialiased md:py-16">
   <div class="mx-auto max-w-screen-xl px-4 2xl:px-0">
     <div class="mx-auto max-w-3xl">
-      <h2 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl">Order summary</h2>
-        <dd class="mt-1 text-base font-normal text-gray-500 dark:text-gray-400">
+      <h2 class="text-xl font-semibold text-gray-900 sm:text-2xl">Order summary</h2>
+        <dd class="mt-1 text-base font-normal text-gray-500 ">
           Thanks for your order! As soon as your payment arrived we will print your Order.
         </dd>
 
-      <div class="mt-6 space-y-4 border-b border-t border-gray-200 py-8 dark:border-gray-700 sm:mt-8">
-        <h4 class="text-lg font-semibold text-gray-900 dark:text-white">Order status: {{ .data.order.Status }}</h4>
+      <div class="mt-6 space-y-4 border-b border-t border-gray-200 py-8 sm:mt-8">
+        <h4 class="text-lg font-semibold text-gray-900 ">Order status: {{ .data.order.Status }}</h4>
         <dl>
-          <dd class="mt-1 text-base font-normal text-gray-500 dark:text-gray-400">
+          <dd class="mt-1 text-base font-normal text-gray-500 ">
           Order Code: {{ .data.order.Token }}
           </dd>
         </dl>
       </div>
 
-      <div class="mt-6 space-y-4 border-b border-t border-gray-200 py-8 dark:border-gray-700 sm:mt-8">
-        <h4 class="text-lg font-semibold text-gray-900 dark:text-white">Payment information</h4>
+      <div class="mt-6 space-y-4 border-b border-t border-gray-200 py-8 sm:mt-8">
+        <h4 class="text-lg font-semibold text-gray-900 ">Payment information</h4>
 
         <dl>
-          <dd class="mt-1 text-base font-normal text-gray-500 dark:text-gray-400">
+          <dd class="mt-1 text-base font-normal text-gray-500 ">
           Either you transfer money to our bank account, or you come by and pay in cash.<br><br>
           
           Miteinander Dresden e.V.*<br>
@@ -33,11 +33,11 @@
         </dl>
       </div>
 
-      <div class="mt-6 space-y-4 border-b border-t border-gray-200 py-8 dark:border-gray-700 sm:mt-8">
-        <h4 class="text-lg font-semibold text-gray-900 dark:text-white">Delivery information</h4>
+      <div class="mt-6 space-y-4 border-b border-t border-gray-200 py-8 sm:mt-8">
+        <h4 class="text-lg font-semibold text-gray-900 ">Delivery information</h4>
 
         <dl>
-          <dd class="mt-1 text-base font-normal text-gray-500 dark:text-gray-400">
+          <dd class="mt-1 text-base font-normal text-gray-500 ">
             <p><b>Shipping:</b> {{ .data.shipping.Name }}</p>
             {{ if .data.askAddress }}
             <p><b>First Name:</b> {{ .data.order.FirstName }}</p>
@@ -54,21 +54,21 @@
       </div>
 
       <div class="mt-6 sm:mt-8">
-        <div class="relative overflow-x-auto border-b border-gray-200 dark:border-gray-800">
-          <table class="w-full text-left font-medium text-gray-900 dark:text-white ">
-            <tbody class="divide-y divide-gray-200 dark:divide-gray-800">
+        <div class="relative overflow-x-auto border-b border-gray-200 ">
+          <table class="w-full text-left font-medium text-gray-900 ">
+            <tbody class="divide-y divide-gray-200 ">
                 {{ range .data.order.CartItems }}
               <tr>
                 <td class="whitespace-nowrap py-4">
                   <div class="flex items-center gap-4">
                     <a href="#" class="flex items-center aspect-square w-8 h-10 shrink-0">
-                      <img class="h-auto w-full max-h-full dark:hidden" src="/{{ .ShopItem.Image }}" alt="imac image" />
+                      <img class="h-auto w-full max-h-full " src="/{{ .ShopItem.Image }}" alt="imac image" />
                     </a>
                     <a href="/shopitems/{{ .ShopItem.ID }}" class="hover:underline">{{ .ShopItem.Name }} - {{ .ItemVariant.Name }}</a>
                   </div>
                 </td>
-                <td class="p-4 text-base font-normal text-gray-900 dark:text-white">x{{ .Quantity }}</td>
-                <td class="p-4 text-right text-base font-bold text-gray-900 dark:text-white">{{ .ItemVariant.Price }}€</td>
+                <td class="p-4 text-base font-normal text-gray-900 ">x{{ .Quantity }}</td>
+                <td class="p-4 text-right text-base font-bold text-gray-900 ">{{ .ItemVariant.Price }}€</td>
               </tr>
                 {{ end }}
 
@@ -81,20 +81,20 @@
           <div class="space-y-4">
             <div class="space-y-2">
               <dl class="flex items-center justify-between gap-4">
-                <dt class="text-gray-500 dark:text-gray-400">Original price</dt>
-                <dd class="text-base font-medium text-gray-900 dark:text-white">{{ .data.priceProducts }}€</dd>
+                <dt class="text-gray-500 ">Original price</dt>
+                <dd class="text-base font-medium text-gray-900 ">{{ .data.priceProducts }}€</dd>
               </dl>
 
               <dl class="flex items-center justify-between gap-4">
-                <dt class="text-gray-500 dark:text-gray-400">Shipping</dt>
-                <dd class="text-base font-medium text-gray-900 dark:text-white">{{ .data.shipping.Price }}€</dd>
+                <dt class="text-gray-500 ">Shipping</dt>
+                <dd class="text-base font-medium text-gray-900 ">{{ .data.shipping.Price }}€</dd>
               </dl>
 
             </div>
 
-            <dl class="flex items-center justify-between gap-4 border-t border-gray-200 pt-2 dark:border-gray-700">
-              <dt class="text-lg font-bold text-gray-900 dark:text-white">Total</dt>
-              <dd class="text-lg font-bold text-gray-900 dark:text-white">{{ .data.priceTotal }}€</dd>
+            <dl class="flex items-center justify-between gap-4 border-t border-gray-200 pt-2 ">
+              <dt class="text-lg font-bold text-gray-900 ">Total</dt>
+              <dd class="text-lg font-bold text-gray-900 ">{{ .data.priceTotal }}€</dd>
             </dl>
           </div>
         </div>

views/orderpreview.html

@@ -1,16 +1,16 @@
 {{ template "header.html" . }}
 
-<section class="bg-white py-8 antialiased dark:bg-gray-900 md:py-16">
+<section class="bg-white py-8 antialiased md:py-16">
   <form action="/order" method="POST" class="mx-auto max-w-screen-xl px-4 2xl:px-0">
     <input type="hidden" name="confirm-order" value="true" required>
     <div class="mx-auto max-w-3xl">
-      <h2 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl">Order summary</h2>
+      <h2 class="text-xl font-semibold text-gray-900 sm:text-2xl">Order summary</h2>
 
-      <div class="mt-6 space-y-4 border-b border-t border-gray-200 py-8 dark:border-gray-700 sm:mt-8">
-        <h4 class="text-lg font-semibold text-gray-900 dark:text-white">Delivery information</h4>
+      <div class="mt-6 space-y-4 border-b border-t border-gray-200 py-8 sm:mt-8">
+        <h4 class="text-lg font-semibold text-gray-900 ">Delivery information</h4>
 
         <dl>
-          <dd class="mt-1 text-base font-normal text-gray-500 dark:text-gray-400">
+          <dd class="mt-1 text-base font-normal text-gray-500">
             <p><b>Shipping:</b> {{ .data.shipping.Name }}</p>
             {{ if .data.askAddress }}
             <p><b>First Name:</b> {{ .data.order.FirstName }}</p>
@@ -25,25 +25,25 @@
           </dd>
         </dl>
 
-        <a  href="/checkout?shippingMethod={{ .data.order.Shipping }}" data-modal-target="billingInformationModal" data-modal-toggle="billingInformationModal" class="text-base font-medium text-primary-700 hover:underline dark:text-primary-500">Edit</a>
+        <a  href="/checkout?shippingMethod={{ .data.order.Shipping }}" data-modal-target="billingInformationModal" data-modal-toggle="billingInformationModal" class="text-base font-medium text-primary-700 hover:underline ">Edit</a>
       </div>
 
       <div class="mt-6 sm:mt-8">
-        <div class="relative overflow-x-auto border-b border-gray-200 dark:border-gray-800">
-          <table class="w-full text-left font-medium text-gray-900 dark:text-white ">
-            <tbody class="divide-y divide-gray-200 dark:divide-gray-800">
+        <div class="relative overflow-x-auto border-b border-gray-200 ">
+          <table class="w-full text-left font-medium text-gray-900 ">
+            <tbody class="divide-y divide-gray-200 ">
                 {{ range .data.order.CartItems }}
               <tr>
                 <td class="whitespace-nowrap py-4">
                   <div class="flex items-center gap-4">
                     <a href="#" class="flex items-center aspect-square w-8 h-10 shrink-0">
-                      <img class="h-auto w-full max-h-full dark:hidden" src="/{{ .ShopItem.Image }}" alt="imac image" />
+                      <img class="h-auto w-full max-h-full " src="/{{ .ShopItem.Image }}" alt="imac image" />
                     </a>
                     <a href="/shopitems/{{ .ShopItem.ID }}" class="hover:underline">{{ .ShopItem.Name }} - {{ .ItemVariant.Name }}</a>
                   </div>
                 </td>
-                <td class="p-4 text-base font-normal text-gray-900 dark:text-white">x{{ .Quantity }}</td>
-                <td class="p-4 text-right text-base font-bold text-gray-900 dark:text-white">{{ .ItemVariant.Price }}€</td>
+                <td class="p-4 text-base font-normal text-gray-900 ">x{{ .Quantity }}</td>
+                <td class="p-4 text-right text-base font-bold text-gray-900 ">{{ .ItemVariant.Price }}€</td>
               </tr>
                 {{ end }}
 
@@ -52,32 +52,32 @@
         </div>
 
         <div class="mt-4 space-y-6">
-          <h4 class="text-xl font-semibold text-gray-900 dark:text-white">Order summary</h4>
+          <h4 class="text-xl font-semibold text-gray-900 ">Order summary</h4>
 
           <div class="space-y-4">
             <div class="space-y-2">
               <dl class="flex items-center justify-between gap-4">
-                <dt class="text-gray-500 dark:text-gray-400">Original price</dt>
-                <dd class="text-base font-medium text-gray-900 dark:text-white">{{ .data.priceProducts }}€</dd>
+                <dt class="text-gray-500 ">Original price</dt>
+                <dd class="text-base font-medium text-gray-900 ">{{ .data.priceProducts }}€</dd>
               </dl>
 
               <dl class="flex items-center justify-between gap-4">
-                <dt class="text-gray-500 dark:text-gray-400">Shipping</dt>
-                <dd class="text-base font-medium text-gray-900 dark:text-white">{{ .data.shipping.Price }}€</dd>
+                <dt class="text-gray-500 ">Shipping</dt>
+                <dd class="text-base font-medium text-gray-900 ">{{ .data.shipping.Price }}€</dd>
               </dl>
 
             </div>
 
-            <dl class="flex items-center justify-between gap-4 border-t border-gray-200 pt-2 dark:border-gray-700">
-              <dt class="text-lg font-bold text-gray-900 dark:text-white">Total</dt>
-              <dd class="text-lg font-bold text-gray-900 dark:text-white">{{ .data.priceTotal }}€</dd>
+            <dl class="flex items-center justify-between gap-4 border-t border-gray-200 pt-2 ">
+              <dt class="text-lg font-bold text-gray-900 ">Total</dt>
+              <dd class="text-lg font-bold text-gray-900 ">{{ .data.priceTotal }}€</dd>
             </dl>
           </div>
 
           <div class="gap-4 sm:flex sm:items-center">
-            <button type="button" class="w-full rounded-lg  border border-gray-200 bg-white px-5  py-2.5 text-sm font-medium text-gray-900 hover:bg-gray-100 hover:text-primary-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-100 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white dark:focus:ring-gray-700"><a href="/">Return to Shopping</a></button>
+            <button type="button" class="w-full rounded-lg  border border-gray-200 bg-white px-5  py-2.5 text-sm font-medium text-gray-900 hover:bg-gray-100 hover:text-primary-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-100 "><a href="/">Return to Shopping</a></button>
 
-            <button type="submit" class="w-full bg-gray-900 dark:bg-gray-600 rounded-lg  border border-gray-200 bg-white px-5  py-2.5 text-sm font-medium text-gray-900 hover:bg-gray-100 hover:text-primary-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-100 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white dark:focus:ring-gray-700">Place binding order</button>
+            <button type="submit" class="w-full bg-gray-900 rounded-lg  border border-gray-200 bg-white px-5  py-2.5 text-sm font-medium text-gray-900 hover:bg-gray-100 hover:text-primary-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-100">Place binding order</button>
           </div>
         </div>
       </div>

views/printstarted.html

@@ -1,9 +1,9 @@
 {{ template "header.html" . }}
 
-<section class="bg-white py-8 antialiased dark:bg-gray-900 md:py-16">
+<section class="bg-white py-8 antialiased md:py-16">
     <div class="mx-auto max-w-3xl">
       <div class="mt-6 sm:mt-8">
-        <div class="relative overflow-x-auto border-b border-gray-200 dark:border-gray-800">
+        <div class="relative overflow-x-auto border-b border-gray-200 ">
                 <h2 class="title font-manrope font-bold text-4xl leading-10 mb-8 text-center text-black">Print Started
                 </h2>
   <div class="w-full grid grid-cols-1 gap-4 mx-auto p-4 m-4 flex flex-wrap border rounded shadow-md">

views/printvariant.html

@@ -1,9 +1,10 @@
 {{ template "header.html" . }}
 
-<section class="bg-white py-8 antialiased dark:bg-gray-900 md:py-16">
+<section class="bg-white py-8 antialiased md:py-16">
     <div class="mx-auto max-w-4xl">
       <div class="mt-6 sm:mt-8">
-        <div class="relative overflow-x-auto border-b border-gray-200 dark:border-gray-800">
+        <div class="relative overflow-x-auto border-b border-gray-200">
+          <div class="m-4">
                 <h2 class="title font-manrope font-bold text-4xl leading-10 mb-8 text-center text-black">Zineshop Print
                   Service
                 </h2>
@@ -21,58 +22,44 @@
 
 
     </p>
+          </div>
 
     <form action="/print" method="POST">
-    <table class="w-full text-left font-medium text-gray-900 dark:text-white">
-        <tbody class="divide-y divide-gray-200 dark:divide-gray-800">
             {{ range .data.cartItems }}
-            <tr>
-                <input type="hidden" name="variant-id[]" value="{{ .ItemVariant.ID }}" required>
-                <td class="whitespace-nowrap py-4">
-                    <div class="flex items-center gap-4">
-                        <a href="/shopitems/{{ .ItemVariant.ShopItemID }}" class="flex items-center aspect-square w-8 h-10 shrink-0">
-                            <img class="h-auto w-full max-h-full dark:hidden" src="/{{ .ShopItem.Image }}" alt="imac image" />
-                        </a>
-
+            <div class="flex items-stretch border rounded m-4 p-2 sm:grid sm:grid-cols-8 gap-4">
+              <input type="hidden" name="variant-id[]" value="{{ .ItemVariant.ID }}" required>
+              <div class="col-span-1 hidden sm:block">
+                <a href="/shopitems/{{ .ItemVariant.ShopItemID }}" class="flex items-center aspect-square h-full shrink-0">
+                    <img class="h-full w-auto" src="/{{ .ShopItem.Image }}" alt="imac image" />
+                </a>
+              </div>
+                <div class="flex flex-col col-span-7 justify-between p-4">
+                    <div class="flex items-center mb-8">
+                        <a href="/shopitems/{{ .ItemVariant.ShopItemID }}" class="hover:underline">{{ .ShopItem.Name }} - {{ .ItemVariant.Name }}</a>
+                    </div>
+                    <div class="flex space-x-2 mb-2">
                         {{ if .ShopItem.WasPrinted }}
                           <span class="inline-flex items-center rounded-md bg-green-50 px-2 py-1 text-xs font-medium text-green-700 ring-1 ring-green-600/20 ring-inset">Tested</span>
                         {{ else }}
-                          <span class="inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-red-600/10 ring-inset">NOT TESTED</span>
+                          <span class="inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-red-600/10 ring-inset">Not Tested</span>
                         {{ end }}
-                        <a href="/shopitems/{{ .ItemVariant.ShopItemID }}" class="hover:underline">{{ .ShopItem.Name }} - {{ .ItemVariant.Name }}</a>
-                    </div>
-                </td>
-
-                <td class="whitespace-nowrap py-4">
-                      <select name="variant-papertype[]" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+                      <select name="variant-papertype[]" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5">
                         {{ range $.data.paper }}
                         <option value="{{ .ID }}">{{ .Brand }} - {{ .Name }}: {{ .Size }} {{ .Weight }}g/m2</option>
                         {{ end}}
                       </select>
-                </td>
-
-                <td class="whitespace-nowrap py-4">
-                      <select name="variant-coverpage[]" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+                      <select name="variant-coverpage[]" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5">
                         <option selected value="0">CoverPage: None</option>
                         {{ range $.data.paper }}
                         <option value="{{ .ID }}">{{ .Brand }} - {{ .Name }}: {{ .Size }} {{ .Weight }}g/m2</option>
                         {{ end}}
                       </select>
-                </td>
-                <td class="whitespace-nowrap py-4">
-                    Amount:
-                </td>
-                <td class="p-4 text-right text-base font-bold text-gray-900 dark:text-white">
-                    <div>
-                        <div class="mt-2">
-                          <input type="number" name="variant-amount[]" value="{{ .Quantity }}" step="1" min="0" required class="block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600 sm:text-sm/6">
-                        </div>
+                          <input type="number" name="variant-amount[]" value="{{ .Quantity }}" step="1" min="0" required class="text-right border rounded p-2 w-16">
                     </div>
-                </td>
-            </tr>
+                </div>
+            </div>
+
             {{ end }}
-        </tbody>
-    </table>
 
     <div class="max-lg:max-w-lg max-lg:mx-auto">
         <p class="font-normal text-base leading-7 text-gray-500 text-center mb-5 mt-6">If CoverPage selected, make sure you put paper in the BypassTray</p>

views/shopitem.html

@@ -1,46 +1,46 @@
 {{ template "header.html" . }}
 
-<div class="bg-gray-100 dark:bg-gray-800 py-8">
+<div class="bg-gray-100 py-8">
                   <form action="/cart" method="POST">
     <div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
         <div class="flex flex-col md:flex-row -mx-4">
             <div class="md:flex-1 px-4">
-                <div class="rounded-lg bg-gray-300 dark:bg-gray-700 mb-4">
+                <div class="rounded-lg bg-gray-300 mb-4">
                   <img class="w-full h-full object-cover" src="/{{ .data.shopItem.Image}}" alt="Product Image">
                 </div>
                 <div class="flex -mx-2 mb-4">
     {{ if .loggedIn }}
                   <input type="hidden" id="{{ .data.shopItem.ID}}" name="ShopItemId" value="{{ .data.shopItem.ID }}">
                     <div class="w-1/3 px-2">
-                        <button type="submit" class="w-full bg-gray-900 dark:bg-gray-600 text-white py-2 px-4 rounded-lg font-bold hover:bg-gray-800 dark:hover:bg-gray-700">Add to Cart</button>
+                        <button type="submit" class="w-full bg-gray-900 text-white py-2 px-4 rounded-lg font-bold hover:bg-gray-800 ">Add to Cart</button>
                     </div>
     {{ end }}
 
                     <div class="w-1/3 px-2">
-                      <button type="button" class="w-full bg-blue-900 dark:bg-gray-600 text-white py-2 px-4 rounded-lg font-bold hover:bg-gray-800 dark:hover:bg-gray-700"><a href="/{{ .data.shopItem.Pdf }}">View</a></button>
+                      <button type="button" class="w-full bg-blue-900 text-white py-2 px-4 rounded-lg font-bold hover:bg-gray-800 "><a href="/{{ .data.shopItem.Pdf }}">View</a></button>
                     </div>
 
     {{ if .isAdmin }}
                     <div class="w-1/3 px-2">
-                      <button type="button" class="w-full bg-blue-900 dark:bg-gray-600 text-white py-2 px-4 rounded-lg font-bold hover:bg-gray-800 dark:hover:bg-gray-700"><a href="{{ .data.shopItem.ID }}/edit">Edit</a></button>
+                      <button type="button" class="w-full bg-blue-900 text-white py-2 px-4 rounded-lg font-bold hover:bg-gray-800 "><a href="{{ .data.shopItem.ID }}/edit">Edit</a></button>
                     </div>
 
                     <div class="w-1/3 px-2">
-                      <button type="button" class="w-full bg-red-900 dark:bg-red-600 text-white py-2 px-4 rounded-lg font-bold hover:bg-gray-800 dark:hover:bg-gray-700"><a href="{{ .data.shopItem.ID }}/delete">Delete</a></button>
+                      <button type="button" class="w-full bg-red-900 text-white py-2 px-4 rounded-lg font-bold hover:bg-gray-800 "><a href="{{ .data.shopItem.ID }}/delete">Delete</a></button>
                     </div>
     {{ end }}
                 </div>
             </div>
             <div class="md:flex-1 px-4">
-              <h2 class="text-2xl font-bold text-gray-800 dark:text-white mb-2">{{ .data.shopItem.Name }}</h2>
-                <p class="text-gray-600 dark:text-gray-300 text-sm mb-4">
+              <h2 class="text-2xl font-bold text-gray-800 ">{{ .data.shopItem.Name }}</h2>
+                <p class="text-gray-600 text-sm mb-4">
                   {{ .data.shopItem.Abstract }}
                 </p>
 
     {{ if .loggedIn }}
                 <div class="flex mb-4">
-                    <label for="ItemVariantId" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white"></label>
-                      <select name="ItemVariantId" id="ItemVariantId" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
+                    <label for="ItemVariantId" class="block mb-2 text-sm font-medium text-gray-900 "></label>
+                      <select name="ItemVariantId" id="ItemVariantId" required class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 ">
                         <option selected value="">Choose a variant</option>
                   {{ range .data.shopItem.Variants }}
                     <option value="{{ .ID }}">{{ .Name }} - {{ .Price }}€</option>
@@ -51,27 +51,27 @@
 
                 <div class="flex mb-4">
                     <div class="mr-4">
-                        <span class="font-bold text-gray-700 dark:text-gray-300">Tags:</span>
+                        <span class="font-bold text-gray-700 ">Tags:</span>
                           <p class="mt-1 text-sm text-gray-500">
                             {{ range .data.shopItem.Tags }}
-                            <a href="/tags/{{ .ID }}"><span class="bg-{{ .Color }}-100 text-{{ .Color }}-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm dark:bg-{{ .Color }}-900 dark:text-{{ .Color }}-300">{{ .Name }}</span></a>
+                            <a href="/tags/{{ .ID }}"><span class="bg-{{ .Color }}-100 text-{{ .Color }}-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm ">{{ .Name }}</span></a>
                             {{ end }}
                           </p>
                     </div>
                 </div>
                 <!--
                 <div class="mb-4">
-                    <span class="font-bold text-gray-700 dark:text-gray-300">Select Size:</span>
+                    <span class="font-bold text-gray-700 ">Select Size:</span>
                     <div class="flex items-center mt-2">
-                        <button class="bg-gray-300 dark:bg-gray-700 text-gray-700 dark:text-white py-2 px-4 rounded-full font-bold mr-2 hover:bg-gray-400 dark:hover:bg-gray-600">Black/White</button>
-                        <button class="bg-gray-300 dark:bg-gray-700 text-gray-700 dark:text-white py-2 px-4 rounded-full font-bold mr-2 hover:bg-gray-400 dark:hover:bg-gray-600">Colored</button>
-                        <button class="bg-gray-300 dark:bg-gray-700 text-gray-700 dark:text-white py-2 px-4 rounded-full font-bold mr-2 hover:bg-gray-400 dark:hover:bg-gray-600">Colored Covering Page</button>
+                        <button class="bg-gray-300 text-gray-700 py-2 px-4 rounded-full font-bold mr-2 hover:bg-gray-400 ">Black/White</button>
+                        <button class="bg-gray-300 text-gray-700 py-2 px-4 rounded-full font-bold mr-2 hover:bg-gray-400 ">Colored</button>
+                        <button class="bg-gray-300 text-gray-700 py-2 px-4 rounded-full font-bold mr-2 hover:bg-gray-400 ">Colored Covering Page</button>
                     </div>
                 </div>
                 -->
                 <div>
-                    <span class="font-bold text-gray-700 dark:text-gray-300">Product Description:</span>
-                    <p class="text-gray-600 dark:text-gray-300 text-sm mt-2">
+                    <span class="font-bold text-gray-700 ">Product Description:</span>
+                    <p class="text-gray-600 text-sm mt-2">
                       {{ .data.shopItem.Description }}
                     </p>
                 </div>

views/shopitems.html

@@ -21,7 +21,7 @@
 
           <p class="mt-1 text-sm text-gray-500">
             {{ range .Tags }}
-            <a href="/tags/{{ .ID }}"><span class="bg-{{ .Color }}-100 text-{{ .Color }}-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm dark:bg-{{ .Color }}-900 dark:text-{{ .Color }}-300">{{ .Name }}</span></a>
+            <a href="/tags/{{ .ID }}"><span class="bg-{{ .Color }}-100 text-{{ .Color }}-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm ">{{ .Name }}</span></a>
             {{ end }}
           </p>
         </div>

views/tagview.html

@@ -14,7 +14,7 @@
         <div class="flex">
 
           <span class="bg-{{ .Color }}-100 text-{{ .Color }}-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm
-            dark:bg-{{ .Color }}-900 dark:text-{{ .Color }}-300">Preview</span>
+            ">Preview</span>
           <input type="text" id="name" name="name" value="{{ .Name }}" class="flex-grow border border-gray-300 rounded-l-md p-2 focus:outline-none focus:ring focus:ring-blue-500">
           <select name="color" required>
             <option selected value="{{ .Color }}">{{ .Color }}</option>