summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorxengineering <me@xengineering.eu>2021-08-30 09:04:20 +0200
committerxengineering <me@xengineering.eu>2021-08-30 09:04:20 +0200
commit51ff53be7d7b734cb306f7fb98c8381d5e35ab7d (patch)
tree99452f8359bfb401cab4d1a8a8af4e8f5af83357
parentf1ff1a362529a6f49e1b40eafb008f1fa3e663a9 (diff)
downloadlibweb-51ff53be7d7b734cb306f7fb98c8381d5e35ab7d.tar
libweb-51ff53be7d7b734cb306f7fb98c8381d5e35ab7d.tar.zst
libweb-51ff53be7d7b734cb306f7fb98c8381d5e35ab7d.zip
Add old Code
-rw-r--r--css/xengineering.css93
1 files changed, 93 insertions, 0 deletions
diff --git a/css/xengineering.css b/css/xengineering.css
new file mode 100644
index 0000000..63357e9
--- /dev/null
+++ b/css/xengineering.css
@@ -0,0 +1,93 @@
+/*
+ vim: shiftwidth=2 tabstop=2 expandtab
+*/
+
+/*
+ General Stuff
+*/
+
+* {
+ box-sizing: border-box; /* Include padding and border in the element's total width and height */
+}
+
+body {
+ margin: 0; /* avoid ugly white margin */
+ font-family: Arial, Helvetica, sans-serif; /* select a nice font */
+}
+
+nav {
+ background-color: black;
+}
+
+main {
+ background-color: white;
+}
+
+nav a {
+ color: lightgray;
+ text-decoration: none; /* disable ugly underlined links */
+}
+
+/* How should the link behave if the mouse is over this item? */
+nav a:hover {
+ background-color: lightgray;
+ color: black;
+}
+
+
+
+/*
+ Default Geometry / Geometry for Phones ('Mobile First Development')
+*/
+
+main {
+ padding-left: 20px;
+ padding-right: 20px;
+ text-align: justify;
+}
+
+nav a {
+ display: block;
+ padding: 16px;
+ text-align: center;
+}
+
+
+
+/*
+ Geometry for Tablets
+*/
+
+@media only screen and (min-width: 600px) {
+ /* empty --> same rules as for phones */
+}
+
+
+
+/*
+ Geometry for Desktops
+*/
+
+@media only screen and (min-width: 768px) {
+
+ nav {
+ height: 100%;
+ width: 200px;
+ position: fixed; /* position fixed in top left corner (with offset) */
+ top: 0px; /* disable the offset from top left corner */
+ }
+
+ nav a {
+ text-align: left;
+ }
+
+ main {
+ margin-left: 200px; /* transparent margin on the left for nav */
+ }
+
+ main *{ /* everything inside the content container */
+ max-width: 960px; /* maximum width on desktops should be 960 px */
+ margin-left: auto; /* center it with margin */
+ margin-right: auto; /* center it with margin */
+ }
+}