From c69fe74067e7d466791643282ef61234a77a2ba9 Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 30 Oct 2020 21:12:15 +0100 Subject: [PATCH 1/2] move clear:both to collection_container --- css/projects.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/css/projects.css b/css/projects.css index cfbf850..d253339 100644 --- a/css/projects.css +++ b/css/projects.css @@ -120,7 +120,6 @@ header { @media only screen and (min-width: 1000px) { div#project_margin { margin-top: 250px; - clear: both; } video { margin-top: 230px; @@ -172,6 +171,7 @@ header { ================*/ div.collection_container { + clear: both; display: flex; flex-wrap: wrap; } From 0f3d3db46ed128fc23ddaf22cc75fcf095883d24 Mon Sep 17 00:00:00 2001 From: Chris Date: Fri, 30 Oct 2020 22:27:38 +0100 Subject: [PATCH 2/2] update collection page design --- about.php | 4 ++-- collections.php | 10 +++------- css/projects.css | 37 +++++++++++++++++++++---------------- 3 files changed, 26 insertions(+), 25 deletions(-) diff --git a/about.php b/about.php index 02dbc73..8b0b6ad 100644 --- a/about.php +++ b/about.php @@ -1,5 +1,5 @@ - +
@@ -16,5 +16,5 @@ Order
--> - +
\ No newline at end of file diff --git a/collections.php b/collections.php index f423a57..414ccf8 100644 --- a/collections.php +++ b/collections.php @@ -1,5 +1,5 @@ -
+
example image for ' . $c['name'] .' -
-
-

' . $c['name'] . '

- Details -
-
+ +
' . $c['collection_description'] . ' diff --git a/css/projects.css b/css/projects.css index d253339..4ce69e4 100644 --- a/css/projects.css +++ b/css/projects.css @@ -114,15 +114,13 @@ h1, h2, h3, h4, h5 { header { background: rgba(0,0,0,0.4); font-family: 'IM Fell English SC'; - margin: 0px; + margin: 0px; + border-bottom: 2px solid #f9f9ed; } @media only screen and (min-width: 1000px) { - div#project_margin { - margin-top: 250px; - } - video { - margin-top: 230px; + div#content_padding { + padding-top: 120px; } } @@ -178,12 +176,18 @@ div.collection_container { div.collection { margin: 4px; - margin-bottom: 30px; + margin-bottom: 50px; } div.collection h1 { - margin: 10px; + margin-top: 40px; + margin-bottom: 30px; + margin-left: auto; + margin-right: auto; text-align: center; + display: block; + width: 350px; + font-size: 36pt; } div.collection div.col-desc { @@ -202,27 +206,28 @@ div.collection div.col-desc { .col-img-container { position: relative; - width: 350px; - height: 350px; + width: 220px; + height: 220px; } .col-image { display: block; - width: 350px; - height: 350px; + width: 220px; + height: 220px; border-radius: 50%; - border: 3px solid #f9f9ed; + /*border: 2px solid #f9f9ed; */ } - + .col-img-desc { + display: block; position: absolute; bottom: 0; left: 0; right: 0; background-color: rgba(51, 51, 51, 0.4); overflow: hidden; - width: 350px; - height: 350px; + width: 220px; + height: 220px; opacity: 0; border-radius: 50%; transition: .5s ease;