diff --git a/eet/css/ie.css b/eet/css/ie.css deleted file mode 100644 index 18c513c..0000000 --- a/eet/css/ie.css +++ /dev/null @@ -1,294 +0,0 @@ -* { - padding:0px; - margin:0px; -} - -html, body{ - background: url(./../images/square_bg.png) repeat top left; - font-family:"Myriad Pro", "Lucida Grande", "Trebuchet MS", sans-serif; - width:100%; - height:100%; - padding:0; - margin:0; - - position:absolute; - top:0px; - left:0px; - z-index:-1; -} - -#centerhelp{ - width:1%; - height:60%; - margin-bottom:-150px; /* half of container's height */ - float:left; -} - -#header{ - text-align:right; - position:absolute; - right:0px; - padding:0px; - padding-right:10px; - margin:0px; - - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#1cffffff', endColorstr='#1cffffff'); -} - -#title{ - color:#0B75AF; - font-size: 3.5em; - font-weight:normal; - margin-top:-16px; - text-shadow:2px 1px 2px #999; - vertical-align:top; -} - -#subtitle{ - color:#777; - text-transform:uppercase; - font-size: 1em; - font-weight:normal; - margin:0px; - margin-top:20px; - border-width:0px; -} - -#logo{ - margin:0px; - border-width:0px; - width:400px; - background:none; -} - -#dashboard{ - width:100%; - margin:0 auto; - clear:left; - height:100px; - text-align: center; -} - -/* Dashboard Navigation */ - -#nav{ - padding:0; - list-style: none; - font-size:14px; - display: inline-block; -} - -#nav a{ - text-decoration:none; - outline:none; -} - -#nav li{ - float:left; - width:300px; - height:85px; - position:relative; - cursor:pointer; - border: 1px solid white; -} - -#nav li > a{ - position:absolute; - top:0px; - left:0px; - width:100%; - height:85px; - z-index:12; - background: #DDDDDD; -} - -#nav li a img{ - border:none; - position:absolute; - width:0px; - height:0px; - bottom:0px; - left:85px; - z-index:100; -} - -#nav li span.nav_wrap{ - position:absolute; - top:25px; - left:0px; - height:60px; - z-index:15; - margin-left:5%; - width:90%; -} -#nav li span.nav_active{ - position:absolute; - background:#111; - top:85px; - width:300px; - height:0px; - left:0px; - z-index:14; - - background:#000000; -} - -#nav li span span.nav_link, -#nav li span span.nav_descr, -#nav li div.nav_box a{ - text-transform:uppercase; - width:100%; - text-align:center; -} - -#nav li span span.nav_link{ - color:#000; - font-size:24px; - float:left; - clear:both; - text-align:center; - text-shadow:1px 1px 1px #FFF; -} -#nav li span span.nav_descr{ - color:#0B75AF; - float:left; - clear:both; - font-size:10px; - letter-spacing:1px; - width:100%; -} - -/* DEV CUT */ - -#nav li div.nav_box{ - display:block; - position:absolute; - width:280px; - overflow:hidden; - height:200px; - top:85px; - left:0px; - display:none; - background:#000000; - - padding-left:20px; -} -#nav li div.nav_box a{ - float:left; - clear:both; - line-height:30px; - color:#0B75AF; - text-align:left; -} -#nav li div.nav_box a:first-child{ - margin-top:15px; -} -#nav li div.nav_box a:hover{ - color:#fff; -} - -#nav li:hover .nav_link { - color:#FFFFFF; - text-shadow:1px 1px 1px #000000; -} - -#dashboard ul -{ - height:50px; - padding:12px 0 0 0; - list-style-type: none; - text-align: left; -} - -#dashboard ul li:first-child { - border-left:none; -} - -#dashboard ul li { - display: inline; - padding:0; -} - -#dashboard ul li a { - font-size:13px; - line-height:1.5em; - font-weight:bold; - color:#7d838b; - text-decoration:none; -} - -#dashboard ul li a:hover { - text-decoration:none; - color:#bbc0c7; -} - -/* Footer */ - -#reference{ - position:fixed; - left:10px; - bottom:10px; - font-size:12px; - color:#444; -} -#reference a{ - color:#222; - text-transform:uppercase; - text-decoration:none; - text-shadow:1px 1px 1px #fff; -} -#reference a:hover{ - color:#000; - text-decoration:underline; -} - - -/* Impressum */ - -#impressum{ - color:#000000; - display:block; - background: #DDDDDD; - width:650px; - padding:20px 50px; - margin:30px auto; -} - -#impressum a{ - color:#000000; - text-decoration: underline; -} - -#impressum a:hover{ - color:#FFFFFF; -} - -.impressum_sources_list{ - padding-left:2em; - text-align:left; -} - -#impressum_back{ - width:50px; - margin-top:15px; - margin-left:10px; - border:0; -} - -.columnHeader{ - text-align:left; - padding-top: 5px; - padding-bottom: 5px; - padding-left:10px; -} - -.columns{ - text-align:justify; - margin:auto; - padding-left:10px; -} - -.nameBox{ - float:left; - padding-right:10px; -} \ No newline at end of file diff --git a/eet/css/style.css b/eet/css/style.css index d29b431..77a5824 100644 --- a/eet/css/style.css +++ b/eet/css/style.css @@ -1,247 +1,120 @@ * { - padding:0px; - margin:0px; + margin: 0; + padding: 0; + position: relative; + box-sizing: border-box; } -html, body{ - background: url(./../images/square_bg.png) repeat top left; - font-family:"Myriad Pro", "Lucida Grande", "Trebuchet MS", sans-serif; - width:100%; - height:100%; - padding:0; - margin:0; - - position:absolute; - top:0px; - left:0px; - z-index:-1; +body { + display: grid; + grid-template-rows: auto 1fr auto; + height: 100vh; + padding: 2rem; + font-family:"Myriad Pro", "Lucida Grande", "Trebuchet MS", sans-serif; + color: #202020; + background: + url(../images/square_bg.png) repeat top left, + url(../images/logo_transparent.png) no-repeat calc(100vw - 200px) 30px; + background-size: auto, 150px 150px; } -#centerhelp{ - width:1%; - height:40%; - margin-bottom:-150px; /* half of container's height */ - float:left; +h1, h2 { + padding-bottom: .5rem; } -#header{ - text-align:right; - position:absolute; - top:1em; - right:0px; - padding:0px; - padding-right:10px; - margin:0px; - - background:rgba(255,255,255,0.1); - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#1cffffff', endColorstr='#1cffffff'); +main ul { + display: grid; + margin: 2rem 0; + height: calc(100% - 4rem); + grid-template-rows: repeat(4, 1fr); + grid-template-columns: repeat(3, 1fr); + grid-gap: 4px; + list-style: none; } -#title{ - color:#0B75AF; - font-size: 3.5em; - font-weight:normal; - margin-top:-16px; - text-shadow:2px 1px 2px #999; - vertical-align:top; +main ul li a { + --baseHue: 213; + --altHue: 199; + + --hue: var(--baseHue); + --sat: 100%; + --lum: 67%; + --alpha: .4; + + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + padding: 1.5rem; + background-color: hsla(var(--hue), var(--sat), var(--lum), var(--alpha)); + transition: background-color .2s ease-in-out; } -#subtitle{ - color:#777; - text-transform:uppercase; - font-size: 1em; - font-weight:normal; - margin:0px; - margin-top:20px; - border-width:0px; +main ul li:nth-of-type(2n) a { + --hue: var(--altHue); } -#logo{ - margin:0px; - border-width:0px; - width:400px; - background:none; +main ul li a:hover { + --alpha: .2; } -#dashboard{ - width:100%; - margin:0 auto; - clear:left; - height:100px; - text-align: center; +main a:link, +main a:visited, +main a:active, +main a:hover { + text-decoration: none; } -/* Dashboard Navigation */ - -#nav{ - padding:0; - list-style: none; - font-size:14px; - display: inline-block; +a:link, +a:visited, +a:active, +a:hover { + color: rgb(15, 15, 15); + transition: color .2s; } -#nav a{ - text-decoration:none; - outline:none; +.without-english-version { + display: none; } -#nav li{ - float:left; - width:300px; - height:85px; - position:relative; - cursor:pointer; +@media screen and (max-width: 850px) { + body { + background: url(../images/square_bg.png) repeat top left; + } + + main ul { + grid-template-columns: repeat(2, 1fr); + } + + main ul li:nth-of-type(2n) a { + --hue: var(--baseHue) + } + + main ul li:nth-of-type(4n + 1) a, + main ul li:nth-of-type(4n + 4) a { + --hue: var(--altHue) + } } -#nav li > a{ - position:absolute; - top:0px; - left:0px; - width:100%; - height:85px; - z-index:12; - background: rgb(0,0,0) transparent; - background: rgba(0,0,0,0.2); - -moz-box-shadow:1px 2px 2px #fff inset; - -webkit-box-shadow:0px 0px 2px #fff inset; - box-shadow:1px 2px 2px #fff inset; -} +@media screen and (max-width: 530px) { + body { + padding: 1rem; + } -#nav li .step { - padding-left: 0.5em; - padding-top: 1.5em; - font-size: 1.5em; - font-weight: bold; - color: #666666; -} + main ul { + grid-template-columns: 1fr; + } -#nav li span.nav_wrap{ - position:absolute; - top:25px; - left:0px; - height:60px; - z-index:15; - margin-left:5%; - width:90%; -} -#nav li span.nav_active{ - position:absolute; - background:#111; - top:85px; - width:300px; - height:0px; - left:0px; - z-index:14; + main ul li:nth-of-type(4n + 1) a, + main ul li:nth-of-type(4n + 4) a { + --hue: var(--baseHue) + } - background:#000000; -} + main ul li:nth-of-type(2n) a { + --hue: var(--altHue) + } -#nav li span span.nav_link, -#nav li span span.nav_descr, -#nav li div.nav_box a{ - text-transform:uppercase; - width:100%; - text-align:center; -} - -#nav li span span.nav_link{ - color:#000; - font-size:24px; - float:left; - clear:both; - text-align:center; - text-shadow:1px 1px 1px #FFF; -} -#nav li span span.nav_descr{ - color:#0B75AF; - float:left; - clear:both; - font-size:10px; - letter-spacing:1px; - width:100%; -} - -/* DEV CUT */ - -#nav li div.nav_box{ - display:block; - position:absolute; - width:280px; - overflow:hidden; - height:200px; - top:85px; - left:0px; - display:none; - background:#000000; - - padding-left:20px; -} -#nav li div.nav_box a{ - float:left; - clear:both; - line-height:30px; - color:#0B75AF; - text-align:left; -} -#nav li div.nav_box a:first-child{ - margin-top:15px; -} -#nav li div.nav_box a:hover{ - color:#fff; -} - -#nav li:hover .nav_link { - color:#FFFFFF; - text-shadow:1px 1px 1px #000000; -} - -#dashboard ul -{ - max-width: 1200px; - height:50px; - padding:12px 0 0 0; - list-style-type: none; - text-align: left; -} - -#dashboard ul li:first-child { - border-left:none; -} - -#dashboard ul li { - display: inline; - padding:20px 0 0 0; -} - -#dashboard ul li a { - font-size:13px; - line-height:1.5em; - font-weight:bold; - color:#7d838b; - text-decoration:none; -} - -#dashboard ul li a:hover { - text-decoration:none; - color:#bbc0c7; -} - -/* Footer */ - -#reference{ - position:fixed; - left:10px; - bottom:10px; - font-size:12px; - color:#444; -} -#reference a{ - color:#222; - text-transform:uppercase; - text-decoration:none; - text-shadow:1px 1px 1px #fff; -} -#reference a:hover{ - color:#000; - text-decoration:underline; -} + main ul li a { + padding: 1rem; + } +} \ No newline at end of file diff --git a/eet/english.html b/eet/english.html new file mode 100644 index 0000000..e121b60 --- /dev/null +++ b/eet/english.html @@ -0,0 +1,109 @@ + + + + + EETs | Kurzlinks + + + + + + + + + + + +
+

Introductory Days for First Semester Students

+ Overview of useful web pages for studying in Bamberg +
+
+ +
+ + + + +​ diff --git a/eet/images/logo_transparent.png b/eet/images/logo_transparent.png new file mode 100644 index 0000000..7d93974 Binary files /dev/null and b/eet/images/logo_transparent.png differ diff --git a/eet/index.html b/eet/index.html index 4dbfd7e..957a702 100644 --- a/eet/index.html +++ b/eet/index.html @@ -1,145 +1,103 @@ - - - + + - EET - - - - - - - + + EETs | Kurzlinks + + + + + + + + + - -
-
-
+ -
- © Fachschaft WIAI 2013-2017 -
- ​