From af596b0d84b8f4c3e9f438756978f6a60ecd0171 Mon Sep 17 00:00:00 2001 From: Pradyumna Shome Date: Mon, 6 May 2019 21:42:43 -0500 Subject: [PATCH] Improved staff page layout. - Replaced 3 by 3 layout with flexbox - Centered, and increased space - Made colors less bright - Added note on emailing to staff page --- _pages/staff.html | 79 ++++++++++++++-------------- _pages/staff_hall_of_fame.html | 83 ++++++++++++++---------------- css/main.css | 94 ++++++++++++++++++++-------------- 3 files changed, 132 insertions(+), 124 deletions(-) diff --git a/_pages/staff.html b/_pages/staff.html index 394a4a59a..b40eb072e 100644 --- a/_pages/staff.html +++ b/_pages/staff.html @@ -5,46 +5,43 @@ {% include head.html %} {% include header.html %} -
-
-
-
- - {% assign team = site.data.staff | sort: 'netid' | sort: 'instructor', 'last' %} - {% assign instructor = team | first %} - {% assign sorted_team = team | shift | sort: 'name' | unshift: instructor %} - {% assign photos = site.static_files | where_exp: "file", "file.path contains '/images/staffPhotos/'" %} -
- {% for member in sorted_team %} - {% assign value = forloop.index0 | modulo:3 %} - {% if value == 0 %} -
- {% endif %} - {% assign photofile = photos | where_exp: "file", "file.path contains member.netid" | first %} - {% assign photo = photofile.path | default: "/images/staffPhotos/default.jpg" %} - -
-
-
-
{{ member.name }}
-
-
-
- -
- {% if forloop.last or value == 2 %} -
- {% endif %} - {% endfor %} -
-
-
-
+

+ Course Staff +

+
+

+ Most questions should be asked on Piazza, so that answers can benefit the entire class. + Please acquaint yourself with our Piazza policy! +

+

+ However, if you have a sensitive issue feel free to make a private note on Piazza, or email course staff directly. +

+
+ + {% assign team = site.data.staff | sort: 'netid' | sort: 'instructor', 'last' %} + {% assign instructor = team | first %} + {% assign sorted_team = team | shift | sort: 'name' | unshift: instructor %} + {% assign photos = site.static_files | where_exp: "file", "file.path contains '/images/staffPhotos/'" %} +
+ {% for member in sorted_team %} + {% assign photofile = photos | where_exp: "file", "file.path contains member.netid" | first %} + {% assign photo = photofile.path | default: "/images/staffPhotos/default.jpg" %} +
+ +
+
+
+ {{ member.name }} +
+ +
+ {% endfor %} +
{% include footer.html %} - + \ No newline at end of file diff --git a/_pages/staff_hall_of_fame.html b/_pages/staff_hall_of_fame.html index b1aba9d0a..08e5bb04e 100644 --- a/_pages/staff_hall_of_fame.html +++ b/_pages/staff_hall_of_fame.html @@ -2,48 +2,43 @@ --- -{% include head.html %} - -{% include header.html %} -
-
-
-
-

Staff Hall of Fame

-

These are all graduated TAs and CAs that have been on staff for multiple semesters and contributed greatly to the course.

- -

If I have seen farther than others, it is by standing on the shoulders of giants -- Isaac Newton

- - {% assign team = site.data.staff-emeritus | sort: 'name' %} - {% assign photos = site.static_files | where_exp: "file", "file.path contains '/images/staffPhotos/retired/'" %} -
- {% for member in team %} - {% capture mods %}{{ forloop.index0 | modulo: 3 }}{% endcapture %} - {% if mods == '0' or forloop.first %} -
- {% endif %} - {% assign photofile = photos | where_exp: "file", "file.path contains member.netid" | first %} -
-
-
-
{{ member.name }}
-
-
-
-
- {% if mods == '2' or forloop.last %} -
- {% endif %} - {% endfor %} -
-
-
-
- {% include footer.html %} - + {% include head.html %} + + {% include header.html %} +

+ Staff Hall of Fame +

+
+

+ These are all graduated TAs and CAs that have been on staff for multiple semesters and have contributed greatly to the course. +

+

+ If I have seen farther than others, it is by standing on the shoulders of giants -- Isaac Newton +

+
+ + {% assign team = site.data.staff-emeritus | sort: 'name' %} + {% assign photos = site.static_files | where_exp: "file", "file.path contains '/images/staffPhotos/retired/'" %} +
+ {% for member in team %} + {% assign photofile = photos | where_exp: "file", "file.path contains member.netid" | first %} + {% assign photo = photofile.path | default: "/images/staffPhotos/default.jpg" %} +
+ +
+
+
+ {{ member.name }} +
+ +
+ {% endfor %} +
+ {% include footer.html %} + diff --git a/css/main.css b/css/main.css index f864db1f7..a3289a899 100644 --- a/css/main.css +++ b/css/main.css @@ -1,7 +1,9 @@ :root { - --color-primary:#13bb36; - --color-secondary: #2f5fffdc; + --color-primary:#00b400; + --color-secondary: rgb(53, 144, 219); + --color-secondary-emphasis: rgb(28, 125, 204); --color-text: black; + --color-translucent: hsla(0, 0%, 0%, 0.5); } body { @@ -20,7 +22,7 @@ body { .navbar { background-color: var(--color-primary); - border-color: #2C72AD; + border-color: var(--color-secondary); border: 0px; border-top:none; box-shadow:none; @@ -78,33 +80,6 @@ h2 { } } -.staff { - width: 100%; -} - -.staff-div { - width: 30vh; - height: 30vh; - overflow: hidden; - background-size: cover; - padding:0px; - border-radius: 1vh; -} - -.staff-row { - margin-top: 40px; -} - -.staff-name { - position: absolute; - bottom: 0px; - background: rgba(0, 0, 0, 0.35); - color: white; - text-align: center; - font-size: 1.75em; - padding-top: 5px; -} - /* Popover */ .popover { background-color: black; @@ -302,7 +277,7 @@ img:not(.emoji) { .fancy-link { text-decoration: none !important; - color: #337ab7; + color: var(--color-secondary-emphasis); display: inline-block; position: relative; padding-bottom: 0px; @@ -320,14 +295,7 @@ img:not(.emoji) { .fancy-link:hover:after { width: 100%; - background: #337ab7; -} - -.container-fluid { - padding-right: 15px; - padding-left: 15px; - margin-right: auto; - margin-left: auto; + background: var(--color-secondary-emphasis); } .navbar-toggle { @@ -597,3 +565,51 @@ li.navbar-link:hover a, li.navbar-sublink:hover { text-align: center; font-family: 'Roboto', sans-serif; } + +.gallery { + display: flex; + justify-content: center; + margin: 0; + padding: 4vw; + flex-wrap: wrap; +} + +.staff { + width: 100%; +} + +.staff-container { + margin: 2vh; + border: solid var(--color-translucent) 0.5px; +} + +.staff-container div.staff-image { + width: 30vh; + height: 30vh; + overflow: hidden; + background-size: cover; + padding: 0; +} + +.staff-name { + bottom: 0px; + background-color: rgba(255, 255, 255, 0.397); + color: var(--color-secondary); + width: 100%; + text-align: center; + font-size: 1.5em; + font-weight: 100; + padding-top: 5px; +} + +.heading { + text-align: center; +} + +section.center { + text-align: center; + padding-left: 3vw; + padding-right: 3vw; + padding-bottom: 0; + padding-top: 0; +} \ No newline at end of file