This repository has been archived by the owner on Nov 18, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 3
Replace mega hack with mini hack. #66
Merged
Merged
Changes from all commits
Commits
Show all changes
6 commits
Select commit
Hold shift + click to select a range
File filter
Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,21 +1,23 @@ | ||
<footer class="o-layout__footer o-footer-services"> | ||
<div class="o-layout__footer"> | ||
<!-- start o-footer-services markup: included as a seperate dependancy, see https://registry.origami.ft.com/components/o-footer-services --> | ||
<div class="o-footer-services__container"> | ||
<div class="o-footer-services__wrapper o-footer-services__wrapper--top"> | ||
<a class="o-footer-services__icon-link o-footer-services__icon-link--github" href="http://github.com/financial-times/o-footer-services">View project on GitHub</a> | ||
<a class="o-footer-services__icon-link o-footer-services__icon-link--slack" href="https://slack.com/messages/[id]/">#slack-channel</a> | ||
<p class="o-footer-services__content">Help or advice can be found here <a href="mailto:an.email@someplace.com">an.email@someplace.com</a> and there are other places, <a class="o-footer-services__content--external" href='/somewhere'>like this one</a>.</p> | ||
<footer class=" o-footer-services"> | ||
<div class="o-footer-services__container"> | ||
<div class="o-footer-services__wrapper o-footer-services__wrapper--top"> | ||
<a class="o-footer-services__icon-link o-footer-services__icon-link--github" href="http://github.com/financial-times/o-footer-services">View project on GitHub</a> | ||
<a class="o-footer-services__icon-link o-footer-services__icon-link--slack" href="https://slack.com/messages/[id]/">#slack-channel</a> | ||
<p class="o-footer-services__content">Help or advice can be found here <a href="mailto:an.email@someplace.com">an.email@someplace.com</a> and there are other places, <a class="o-footer-services__content--external" href='/somewhere'>like this one</a>.</p> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="o-footer-services__container"> | ||
<div class="o-footer-services__wrapper o-footer-services__wrapper--legal"> | ||
<div class="o-footer-services__links"> | ||
<a href="http://help.ft.com/help/legal-privacy/cookies/">Cookies</a> | ||
<a href="http://help.ft.com/help/legal-privacy/copyright/copyright-policy/">Copyright</a> | ||
<a href="http://help.ft.com/help/legal-privacy/privacy/" class="o-footer-services__bulletted-link">Privacy</a> | ||
<a href="http://help.ft.com/help/legal-privacy/terms-conditions">Terms & Conditions</a> | ||
<div class="o-footer-services__container"> | ||
<div class="o-footer-services__wrapper o-footer-services__wrapper--legal"> | ||
<div class="o-footer-services__links"> | ||
<a href="http://help.ft.com/help/legal-privacy/cookies/">Cookies</a> | ||
<a href="http://help.ft.com/help/legal-privacy/copyright/copyright-policy/">Copyright</a> | ||
<a href="http://help.ft.com/help/legal-privacy/privacy/" class="o-footer-services__bulletted-link">Privacy</a> | ||
<a href="http://help.ft.com/help/legal-privacy/terms-conditions">Terms & Conditions</a> | ||
</div> | ||
<p><span>© THE FINANCIAL TIMES LTD 2018.</span> FT and 'Financial Times' are trademarks of The Financial Times Ltd.</p> | ||
</div> | ||
<p><span>© THE FINANCIAL TIMES LTD 2018.</span> FT and 'Financial Times' are trademarks of The Financial Times Ltd.</p> | ||
</div> | ||
</footer> | ||
<!-- end o-footer-services markup --> | ||
</footer> | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,16 +0,0 @@ | ||
/// So o-layout matches the container width of o-grid, | ||
/// and thus aligns with our header components, we set | ||
/// the max width of the main content area to the | ||
/// grid container minus the width of other columns (such as the sidebar). | ||
/// @param {String} $other-column-widths - Widths of other columns in the layout. | ||
/// @example Here we get the max width of the main content area where there are two sidebars, one to the right and one to the left. | ||
/// _getMainMaxWidth($_o-layout-sidebar-max-width, $_o-layout-sidebar-max-width); | ||
/// @access private | ||
@function _getMainMaxWidth($other-column-widths...) { | ||
$taken-width: length($other-column-widths) * $_o-layout-gutter; | ||
@each $width in $other-column-widths { | ||
$taken-width: $taken-width #{' - '} $width; | ||
} | ||
|
||
@return calc(#{$_o-layout-container-max-width} - #{$taken-width}); | ||
} | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
So this is happening because the grid doesn't span the whole page, right? Why did we remove the five columns again?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, it's to remove the mega hack which calculated in SCSS a px value for the main content area. We either need a wrapper around the main content and sidebar, or we set the whole of
.o-layout
to the max width of the container and then make the header and footer "break out" of the container (which is what this is).There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ah, and the mega hack is bad because if the main content area is set in px it can't expand when the sidebar is deleted.