add bg css pattern

1 files changed, 20 insertions, 1 deletions

diff --git a/extras/html/themes/future/style.css b/extras/html/themes/future/style.css
index 078bb62..b8e2569 100644
--- a/extras/html/themes/future/style.css
+++ b/extras/html/themes/future/style.css
@@ -21,6 +21,25 @@
 @font-face {
     font-family: 'typewriter';
     src: url("./typewriter.ttf") format("truetype");
+}  
+
+/* https://css-pattern.com/ */
+html {
+  --s: 162px; /* control the size*/
+  --c1: #cd2942;
+  --c2: #62928c;
+  --c3: #e8cba9;
+  --c4: #33152e;
+  --c5: #414352;
+  
+  --_g: conic-gradient(from 30deg at 50% 25%,#0000 300deg,var(--c1) 0);
+  background:
+    var(--_g) calc(0.2885*var(--s)) calc(7*var(--s)/12),
+    var(--_g) 0 calc(var(--s)/12),
+    conic-gradient(from 120deg at 50% calc(250%/3),var(--c2) 120deg,#0000 0),
+    repeating-conic-gradient(from 30deg,#0000 0 60deg,var(--c3) 0 120deg),
+    repeating-conic-gradient(var(--c4) 0 60deg,var(--c2) 0 120deg,var(--c5) 0 180deg);
+  background-size: calc(0.577*var(--s)) var(--s);
 }
 
 body {
@@ -30,7 +49,7 @@ body {
     max-width: 1024px;
     padding: 20px;
     margin: 20px auto;
-    border: 1px solid #333;
+    border: 5px double #ff6347;
     box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
     border-radius: 15px;
 }