Skip to content

Update headings typography. #96

@betsydupuis

Description

@betsydupuis

Here are the properties that are needed. Some properties will need to be overridden, others can be stored in variables. Foundation uses em units instead of pixels, so be mindful to convert these units if the framework doesn't do it already.

.h1 {
	font-weight: bold;
	text-transform: uppercase;
	font-size: 48px;
	line-height: 48px;
	margin-bottom: 24px;
}
.h2 {
	font-weight: normal;
	font-size: 36px;
	line-height: 36px;
	margin-bottom: 12px;
}
.h3 {
	font-weight: bold;
	text-transform: uppercase;
	font-size: 30px;
	line-height: 36px;
	margin-bottom: 12px;
}
.h4 {
	font-weight: normal;
	font-size: 24px;
	line-height: 24px;
	margin-bottom: 12px;
}
.h5 {
	font-weight: normal;
	text-transform: uppercase;
	font-size: 18px;
	line-height: 24px;
	margin-bottom: 12px;
}
.h6 {
	font-weight: normal;
	text-transform: uppercase;
	font-size: 14px;
	line-height: 24px;
	margin-bottom: 12px;
}

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions