TravelAmore / TravelAmore.github.io

Company Website for school project.
MIT License
0 stars 1 forks source link

Fix footer #7

Closed Claire-Crawford closed 6 years ago

Claire-Crawford commented 6 years ago

Shorten height of footer and fix privacy, terms, disclaimer links, copyright, and nwacc logo. Make links fit within footer well and have appropriate space between

comaldave commented 6 years ago

I think these corrections will take care of the footer.

/*------------------------------------*\ 
  #FOOTER SECTION
\*------------------------------------*/

footer {
  display: flex;
  flex-direction: row-reverse;
  flex-wrap: nowrap;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1rem;
  background: var(--primary-color);
  max-height: 10rem;
  max-width: 1200px;
  margin: auto;
}

footer > nav {
  flex-direction: row;
  background-color: cyan;
}

#legal > nav {
  flex-direction: row;
  order: 2;padding: 0;
}

#legal > nav > a {
  font-size: .8em;
  margin: 1 1 1 1;
}

#legal {
  display: flex;
  flex-direction: row;
  background-color: var(--p-dark-color);
  flex-wrap: wrap;
  padding-left: 10px;
  max-width: 150px;
}

#school img {
  height: auto;
  width: 80px;
  padding-left: 10px;
  margin-right: 10px;
}

#license {
  font-size: .61em;
  max-width: 170px;
  padding-left: 10px
}

#license a {
  font-size: .7em;
}

#copyright {
  padding-left: 10px;
  color: white;
  margin: 0;
  order: 1;
  font-size: .8em;
}

#webmaster {
  padding-left: 7px;
}

#tech img {
  height: auto;
  width: 120px;
  padding-left: 10px;
}
Claire-Crawford commented 6 years ago

thank you! This definitely makes it look much better. The only issue I'm having now is that there is about 10-15px breaking the main from the footer. (there is a thin sliver of grey showing between these two elements .. if that makes sense)

thank you!!!

On Sat, May 5, 2018 at 7:54 PM, David Skinner notifications@github.com wrote:

I think these corrections will take care of the footer.

/------------------------------------\

FOOTER SECTION

*------------------------------------*/

footer { display: flex; flex-direction: row-reverse; flex-wrap: nowrap; position: absolute; right: 0; bottom: 0; left: 0; padding: 1rem; background: var(--primary-color); max-height: 10rem; max-width: 1200px; margin: auto; }

footer > nav { flex-direction: row; background-color: cyan; }

legal > nav {

flex-direction: row; order: 2;padding: 0; }

legal > nav > a {

font-size: .8em; margin: 1 1 1 1; }

legal {

display: flex; flex-direction: row; background-color: var(--p-dark-color); flex-wrap: wrap; padding-left: 10px; max-width: 150px; }

school img {

height: auto; width: 80px; padding-left: 10px; margin-right: 10px; }

license {

font-size: .61em; max-width: 170px; padding-left: 10px }

license a {

font-size: .7em; }

copyright {

padding-left: 10px; color: white; margin: 0; order: 1; font-size: .8em; }

webmaster {

padding-left: 7px; }

tech img {

height: auto; width: 120px; padding-left: 10px; }

— You are receiving this because you were assigned. Reply to this email directly, view it on GitHub https://github.com/TravelAmore/TravelAmore.github.io/issues/7#issuecomment-386845629, or mute the thread https://github.com/notifications/unsubscribe-auth/AXcNKu4q2FQNdIByh7AkZme7kxwhoG6jks5tvknEgaJpZM4TzOxs .

-- Warmly Sherrie

comaldave commented 6 years ago

I cannot work on it until you commit changes and sync. Just need to change calc of height of center and main.

On Sat, May 5, 2018 at 8:24 PM CherylCrawford notifications@github.com wrote:

thank you! This definitely makes it look much better. The only issue I'm having now is that there is about 10-15px breaking the main from the footer. (there is a thin sliver of grey showing between these two elements .. if that makes sense)

thank you!!!

On Sat, May 5, 2018 at 7:54 PM, David Skinner notifications@github.com wrote:

I think these corrections will take care of the footer.

/------------------------------------\

FOOTER SECTION

*------------------------------------*/

footer { display: flex; flex-direction: row-reverse; flex-wrap: nowrap; position: absolute; right: 0; bottom: 0; left: 0; padding: 1rem; background: var(--primary-color); max-height: 10rem; max-width: 1200px; margin: auto; }

footer > nav { flex-direction: row; background-color: cyan; }

legal > nav {

flex-direction: row; order: 2;padding: 0; }

legal > nav > a {

font-size: .8em; margin: 1 1 1 1; }

legal {

display: flex; flex-direction: row; background-color: var(--p-dark-color); flex-wrap: wrap; padding-left: 10px; max-width: 150px; }

school img {

height: auto; width: 80px; padding-left: 10px; margin-right: 10px; }

license {

font-size: .61em; max-width: 170px; padding-left: 10px }

license a {

font-size: .7em; }

copyright {

padding-left: 10px; color: white; margin: 0; order: 1; font-size: .8em; }

webmaster {

padding-left: 7px; }

tech img {

height: auto; width: 120px; padding-left: 10px; }

— You are receiving this because you were assigned. Reply to this email directly, view it on GitHub < https://github.com/TravelAmore/TravelAmore.github.io/issues/7#issuecomment-386845629 , or mute the thread < https://github.com/notifications/unsubscribe-auth/AXcNKu4q2FQNdIByh7AkZme7kxwhoG6jks5tvknEgaJpZM4TzOxs

.

-- Warmly Sherrie

— You are receiving this because you were assigned. Reply to this email directly, view it on GitHub https://github.com/TravelAmore/TravelAmore.github.io/issues/7#issuecomment-386846666, or mute the thread https://github.com/notifications/unsubscribe-auth/AAGBWMvtrwEWncVOSFCTu41_aup1R17Rks5tvlDQgaJpZM4TzOxs .

comaldave commented 6 years ago

Made more corrections to footer.

footer {
  display: flex;
  flex-direction: row-reverse;
  flex-wrap: nowrap;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1 rem;
  background: var(--primary-color);
  max-height: 5rem;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

Fixed size of body.

padding-bottom: 5rem;

Claire-Crawford commented 6 years ago

completed