From 320539fae9dba0cb4233737dd2e32416c88a736b Mon Sep 17 00:00:00 2001 From: SG101 Date: Sun, 9 Oct 2022 22:46:45 +0200 Subject: [PATCH] general tweaks and added hover-over effects for project grid --- shared/projects.css | 61 ++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 60 insertions(+), 1 deletion(-) diff --git a/shared/projects.css b/shared/projects.css index 6c1152e..157b0c1 100644 --- a/shared/projects.css +++ b/shared/projects.css @@ -1,6 +1,6 @@ .project-card { padding: 10px; - height: 500px; + height: 400px; background-color: #333F; background-repeat: no-repeat; background-size: cover; @@ -14,6 +14,35 @@ font-size: 125%; } +.project-grid { + display: grid; + grid-gap: 50px 10px; + grid-template-columns: 50% 50%; + margin-top: 50px; +} + +.project-grid > a { + padding: 20px; + border-radius: 7px; +} + +.project-grid > a:hover { + border-width: 5px; + background: #9993; + padding-top: 39px; + padding-bottom: 1px; + color: #117F; +} + +.project-grid > a:visited { + color: #444F; +} + +.project-grid > a:active { + background: #44F3; + padding-top: 40px; + padding-bottom: 0px; +} .project-card[ruins-of-edis] { @@ -31,3 +60,33 @@ .project-card[boids] { background-image: url('../assets/boids-cover.jpg'); } + +.project-card[gml-tile-movement] { + background-image: url('../assets/gml-tile-movement-cover.jpg'); +} + +.project-labels { + margin-top: 20px; +} + +.project-labels > p { + display: inline; + color: white; + background-color: #5C5F; + border-color: black; + margin-top: 20px; + margin-bottom: 20px; + padding-left: 6px; + padding-right: 6px; + padding-top: 2px; + padding-bottom: 2px; + border-radius: 4px; + width: fit-content; + margin-bottom: 0px; + line-height: 2em; +} + +h2.project-title { + margin-top: 20px; + margin-bottom: 10px; +} \ No newline at end of file