#174: New AwesomeWM Website - prototype 1 main page and styling. (#175)

* #174: New AwesomeWM Website - prototype 1 main page and styling. * Improve spaces and add 15yrs anniversary logo. * Prototype 2 main skeleton finished. * The fonts to path. * Add buttons. * Add bullets and buttons colors. * Update whole html structure, add effects, clean up. * Add corrections for github-pages server specifics. * Change color of bullet points. * The review comments implemented. * Add review fixes 1 of prototype 3. * Center anniversary image to letter 'S'. * hover-color-change added for navigation menu. Co-authored-by: Antonin Fischer <[email protected]>
awesomeWM · Sep 28, 2022 · 06e004c · 06e004c
1 parent 06c9044
commit 06e004c
Show file tree

Hide file tree

Showing 20 changed files with 2,585 additions and 456 deletions.
diff --git a/css/dark.css b/css/dark.css
@@ -0,0 +1,50 @@
+/**
+ * AWESOME THEME DARK
+ * background:  #222222
+ * foreground:  #c4c5c8
+ * color0:  #000300
+ * color1:  #b44631
+ * color2:  #6fc24e
+ * color3:  #cab14c
+ * color4:  #59929d
+ * color5:  #926090
+ * color6:  #668d96
+ * color7:  #728c8d
+ * color8:  #3f5f47
+ * color9:  #c1605d
+ * colorA:  #a9c68e
+ * colorB:  #decf50
+ * colorC:  #a6bbcb
+ * colorD:  #ad79a2
+ * colorE:  #8aa1af
+ * colorF:  #bababa
+ * color10: #755cf2
+ */
+
+:root {
+  --background-color: #222222;
+  --color: #c4c5c8;
+  --link-color: #59929d;
+  --image-filter: grayscale(50%);
+  --main-headline-color: #b44631;
+  --bullet-points-color: #b44631;
+  --accent-background-color: #00bcd4;
+  --accent-color: #050505;
+  --warning-message: #b44631;
+  --menu-hover-color: #ad79a2;
+  --screenshot-border-color: #347272;
+  --button-background-color: #59929d;
+  --button-text-color: #fafafa;
+  --button-hover-color: #00bcd4;
+  --nav-text-color: #59929d;
+  --nav-accent-color: #c4c5c8;
+}
+
+img:not([src*=".svg"]) {
+  filter: var(--image-filter);
+}
+
+.lightmode {
+  visibility: hidden;
+  display: none;
+}
diff --git a/css/light.css b/css/light.css
@@ -0,0 +1,45 @@
+/**
+ * AWESOME THEME LIGHT
+ * background:  #ffffff
+ * foreground:  #000300
+ * color0:  #000300
+ * color1:  #b44631
+ * color2:  #6fc24e
+ * color3:  #cab14c
+ * color4:  #006194
+ * color5:  #926090
+ * color6:  #59929d
+ * color7:  #3c4847
+ * color8:  #3f5f47
+ * color9:  #c1605d
+ * colorA:  #a9c68e
+ * colorB:  #decf50
+ * colorC:  #a6bbcb
+ * colorD:  #ad79a2
+ * colorE:  #8aa1af
+ * colorF:  #fafafa
+ * colorA:  #4f5867
+ */
+
+:root {
+  --background-color: #ffffff;
+  --color: #000300;
+  --link-color: #006194;
+  --main-headline-color: #3c4847;
+  --bullet-points-color: #3c4847;
+  --accent-background-color: #006194;
+  --accent-color: #fafafa;
+  --warning-message: #b44631;
+  --menu-hover-color: #000300;
+  --screenshot-border-color: #347272;
+  --button-background-color: #535d6c;
+  --button-text-color: #fafafa;
+  --button-hover-color: #000300;
+  --nav-text-color: #006194;
+  --nav-accent-color: #000300;
+}
+
+.darkmode {
+  visibility: hidden;
+  display: none;
+}