We strive to bring people interesting and unique art that inspires them to be more creative and enjoy their homes. We know art can be expensive, so we work with a rotating set of artists and photographers to being you fantastic prints - all for free. We just ask that you donate what you think is fair, or share the site with someone who might like great art as much as you do.
Our Mission
+
Collections
-
From 2cb92b1efc744abf50bd44ca416b8af7841c3cd6 Mon Sep 17 00:00:00 2001
From: TomF-K <111983192+TomF-K@users.noreply.github.com>
Date: Wed, 14 Jun 2023 12:16:48 +0100
Subject: [PATCH 03/14] improved img sizing, can't resolve order issues at
<800px
---
.../4b-mission/begin/css/style.css | 27 ++++++++++++++++---
1 file changed, 23 insertions(+), 4 deletions(-)
diff --git a/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/css/style.css b/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/css/style.css
index d8af2aa..044acd1 100644
--- a/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/css/style.css
+++ b/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/css/style.css
@@ -44,6 +44,10 @@ section h2 {
font-size: 2.5rem;
}
+p {
+ padding: 1rem;
+}
+
/*****************
New styles begin here and continue to the end of the page
@@ -149,6 +153,23 @@ figcaption a {
/* turn on flexbox here - prior to this, elements stacked individually as blocks */
@media (min-width: 550px) {
+ header {
+ display: flex;
+ flex-flow: row wrap;
+ justify-content: space-between;
+ }
+ .logo {
+ flex-basis: 32.5%;
+ order: 1;
+
+ }
+ .logo-img {
+ width: 100%;
+ }
+ .mission-statement {
+ flex-basis: 65%;
+ order: 2;
+ }
section ul {
display: flex;
flex-flow: row wrap;
@@ -166,16 +187,14 @@ figcaption a {
@media (min-width: 800px) {
header {
display: flex;
- flex-flow: column-wrap;
+ flex-flow: row wrap;
justify-content: space-evenly;
}
.logo-img{
flex-basis: 35%;
}
- .mission-statement {
- flex-basis: 65%;
- }
+
section h2 {
margin-left: 100px;
}
From 4d64a9aefe5a2600c3c1af98ad1e202a6914f59a Mon Sep 17 00:00:00 2001
From: TomF-K <111983192+TomF-K@users.noreply.github.com>
Date: Thu, 15 Jun 2023 10:55:19 +0100
Subject: [PATCH 04/14] initial commit for floated text layout
---
.../4b-mission/begin/css/style.css | 23 +++++++++++--------
.../4b-mission/begin/index.html | 2 +-
2 files changed, 15 insertions(+), 10 deletions(-)
diff --git a/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/css/style.css b/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/css/style.css
index 044acd1..67cd8a0 100644
--- a/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/css/style.css
+++ b/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/css/style.css
@@ -158,18 +158,23 @@ figcaption a {
flex-flow: row wrap;
justify-content: space-between;
}
- .logo {
- flex-basis: 32.5%;
- order: 1;
+
+ .logo {
+ /* flex-basis: 32.5%; */
+ margin: 0;
+ padding: 0;
+
- }
+ }
+
.logo-img {
- width: 100%;
- }
- .mission-statement {
- flex-basis: 65%;
- order: 2;
+ width: 250px;
+ float: left;
+ shape-outside: polygon(0 0, 50% 100%, 100% 0);
}
+ .mission-statement {
+ /* flex-basis: 65%; */
+ }
section ul {
display: flex;
flex-flow: row wrap;
diff --git a/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/index.html b/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/index.html
index 5e58210..943d4ec 100644
--- a/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/index.html
+++ b/day-1-flexbox/4-flexbox-exercises/4b-mission/begin/index.html
@@ -13,7 +13,7 @@
Our Mission
We strive to bring people interesting and unique art that inspires them to be more creative and enjoy their homes. We know art can be expensive, so we work with a rotating set of artists and photographers to being you fantastic prints - all for free. We just ask that you donate what you think is fair, or share the site with someone who might like great art as much as you do.
Our Mission
We strive to bring people interesting and unique art that inspires them to be more creative and enjoy their homes. We know art can be expensive, so we work with a rotating set of artists and photographers to being you fantastic prints - all for free. We just ask that you donate what you think is fair, or share the site with someone who might like great art as much as you do.
We strive to bring people interesting and unique art that inspires them to be more creative and enjoy their homes. We know art can be expensive, so we work with a rotating set of artists and photographers to being you fantastic prints - all for free. We just ask that you donate what you think is fair, or share the site with someone who might like great art as much as you do.
