privacyguides/discourse-brand
1
0
Fork 0
mirror of https://github.com/privacyguides/discourse-brand.git synced 2025-06-19 11:24:24 +00:00
Code Activity

Add page footer

Browse Source
This commit is contained in:
Jonah Aragon
2023-05-27 22:40:36 -05:00
parent 96ac333938
commit 4092558872
2 changed files with 391 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

161
common/common.scss
View File

@ -88,3 +88,164 @@ body:not(.category-announcements-blog) .forum-custom-header-links > a {
.category-team .topic-post.group-team {
border-top: none;
}
// From discourse-easy-footer component:
.custom-footer {
display: flex;
flex-wrap: wrap;
background: var(--primary);
.wrap {
box-sizing: border-box;
}
.flexbox {
width: 100%;
display: flex;
flex-wrap: wrap;
color: var(--secondary);
padding: 2em 0 1em 0;
}
.first-box {
max-width: 20%;
.heading {
font-size: $font-up-2;
font-weight: bold;
margin-bottom: 0.5em;
display: block;
}
.blurb {
color: var(--secondary-high);
}
}
.second-box {
flex: 1;
.links {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
ul {
list-style: none;
margin: 0;
min-width: 100px;
}
li {
margin: 0.5em 0;
}
}
}
.third-box {
width: 100%;
display: flex;
align-items: center;
border-top: 1px solid rgba(var(--primary-low-rgb), 0.05);
.social {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-end;
.social-link {
margin: 20px 10px;
display: flex;
align-items: center;
justify-content: center;
.d-icon {
color: var(--secondary);
min-width: unset;
margin: 0;
font-size: $font-up-2;
opacity: 1;
}
}
}
.small-link {
color: var(--secondary-high);
margin: 0 0.25em;
font-size: $font-down-2;
}
}
.footer-links {
flex: 1;
}
.list span {
font-weight: bold;
}
.footer-section-link-wrapper a {
color: var(--secondary-high);
}
.list {
margin: 1em;
margin-top: 0;
}
.d-icon {
margin-right: 5px;
opacity: 0.7;
min-width: 16px;
text-align: center;
&.fa-none {
min-width: unset;
}
.rtl & {
margin-right: 0;
margin-left: 5px;
}
}
}
#main-outlet {
// stick footer to bottom of short pages
min-height: 85vh;
}
@media screen and (max-width: $large-width) {
.custom-footer {
.first-box {
max-width: 100%;
border-bottom: 1px solid rgba(var(--primary-low-rgb), 0.05);
margin-bottom: 1em;
padding-bottom: 1em;
.blurb {
display: flex;
align-items: center;
}
}
.third-box {
margin-top: 0.5em;
}
.second-box .links {
justify-content: space-between;
}
.list {
margin: 0;
margin-top: 1em;
}
.first-box,
.second-box,
.third-box {
flex: 1 1 100%;
}
}
}
@media screen and (max-width: 700px) {
.custom-footer {
.first-box {
width: 100%;
}
.list {
margin-top: 1em;
display: inline-block;
vertical-align: top;
min-width: 50%;
font-size: $font-up-1;
}
.links {
display: inline-block;
}
}
}
.static-login .custom-footer {
margin-top: 3em;
}