Modernizing the Foundation theme

jordan.vidrine
Fri, 06 Feb 2026 17:52:14 +0000
Announcements

The design team are in the process of making small but powerful changes/tweaks to the foundation theme to align a bit closer to modern web standards. To view these changes live on meta, join this group:

https://meta.discourse.org/g/modernized-foundation

We will be making this change live through the new Upcoming Changes feature available in Discourse. This will allow site owners to enable the changes for any group they specify, in order to test the roll out of the changes without the fear of possibly breaking themes or current customizations.

What will change?

Header shrinks in height

We have decreased the site of the header along with some of the icons & avatar slightly to utilize onscreen real estate.

Default buttons

We are moving from a grey default button background to a transparent / “secondary” background with a border.

removal of grey background

addition of borders

icon color matches text color

buttons now have a set height

Create new topic button on topic list page

Matching Horizon and giving this a “CTA” background color of tertiary

Lots of gray background removal

Topic list

removal of 3 px thicc top border

decrease font size of table header data

consistent color for table data items

color value changes to read/unread

slight increase in font weight to unread

Category boxes

left alignment of text

removal of thicc left colored border

slightly rounded badges

thinner border on box

Nav bar

The nav pills on topic list pages will be the same height as buttons in this zone

darker color text & icon on select kit

Sidebar

icon & text match color

darker text & icons

lighter “active” background

heavier active font weight

Welcome banner

balanced spacing

added variables for easier left/right/center alignment via customization

header font weight decreased

sub title font size decrease

Calendar

removed grey background from “buttons”

use grey only to signify “active”

switch to “bordered transparent” button styling

Drop downs

padding added to drop down container

height, padding, gap now matches sidebar items

unification of “clickable lists”

border inherits --d-border-radius variable

New Variables

Some of the changes here will be introduced via additional variables added into core.

Welcome banner alignment

The alignment of the welcome banner will now be able to be changed via:

// default
  --welcome-banner-text-align: center;
  --welcome-banner-search-menu-margin-inline: auto;

// custom
  --welcome-banner-text-align: left;
  --welcome-banner-search-menu-margin-inline: 0 auto;

Button height

We will now have a set button height via:

// default
  --button-height: var(--space-8);

Font smoothing

We are already doing this in Horizon, it makes sense to bring to foundation.

// new default
--webkit-font-smoothing: antialiased;

55 сообщений - 15 участников