engineering/www.remarkbox.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add multi-column footer adapted from unsandbox.com

Browse source 
Replaces the single-line copyright footer with a structured 4-column
footer (brand, product, resources, company) with CTA buttons, quote,
and copyright. Responsive: 4 cols desktop, 2 tablet, 1 phone. Also
fixes stale copyright years and dead Twitter links on two pages.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
russell@unturf.com 2026-02-08 11:36:09 -05:00
parent 420c0df7c1
commit 5761076d75
6 changed files with 320 additions and 58 deletions
Download patch file Download diff file Expand all files Collapse all files

104
custom.css
View file

@ -174,7 +174,103 @@ span.avoidwrap {
}
@media screen and (max-width:750px) {
.navbar.hidden-on-tablet {display: none}
.hidden-on-tablet {display: none}
.shown-on-tablet {display: block}
}
.navbar.hidden-on-tablet {display: none}
.hidden-on-tablet {display: none}
.shown-on-tablet {display: block}
}
/* Footer */
.rb-footer {
background-color: #ffffff;
border-top: solid 4px #AA0000;
padding: 60px 0 30px;
}
.rb-footer-grid {
display: grid;
grid-template-columns: 2fr 1fr 1fr 1fr;
gap: 40px;
}
.rb-footer-logo {
font-size: 1.4em;
font-weight: bold;
color: #AA0000 !important;
}
.rb-footer-tagline {
font-size: 0.85em;
color: #888;
margin-top: 10px;
line-height: 1.5;
}
.rb-footer-group-title {
font-weight: bold;
font-size: 0.85em;
display: block;
margin-bottom: 15px;
}
.rb-footer-links {
display: flex;
flex-direction: column;
gap: 8px;
}
.rb-footer-links a {
font-size: 0.85em;
color: #888;
}
.rb-footer-links a:hover {
color: #AA0000;
}
.rb-footer-ctas {
margin-top: 40px;
display: flex;
gap: 12px;
flex-wrap: wrap;
}
.rb-footer-quote {
margin-top: 30px;
font-style: italic;
font-size: 0.85em;
color: #888;
border-left: 4px solid #AA0000;
padding-left: 20px;
}
.rb-footer-quote p {
margin: 0;
}
.rb-footer-bottom {
margin-top: 40px;
padding-top: 20px;
border-top: 1px solid #eee;
font-size: 0.8em;
color: #888;
text-align: center;
}
@media screen and (max-width:750px) {
.rb-footer-grid {
grid-template-columns: 1fr 1fr;
}
}
@media screen and (max-width:568px) {
.rb-footer-grid {
grid-template-columns: 1fr;
}
.rb-footer-ctas {
flex-direction: column;
}
.rb-footer-ctas .button {
text-align: center;
}
}