Skip to content

Commit f513b85

Browse files
committed
Revert homepage that Decap CMS butchered
1 parent 7623a1d commit f513b85

File tree

1 file changed

+72
-35
lines changed

1 file changed

+72
-35
lines changed

docs/special-pages/home.md

Lines changed: 72 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,144 +1,181 @@
11
---
22
title: Welcome to the CFPB Design System
3-
layout: homepage
3+
layout: variation
44
collection_name: special-pages
55
is_homepage: true
6-
---
6+
description: >-
7+
<div class="content-75 content-last" markdown="1">
8+
79
8-
<div class="content-75 content-last" markdown="1">
10+
<p class="lead-paragraph">The Design System is an open-source resource for teams at the Consumer Financial Protection Bureau (CFPB). It's intended to help teams produce consistent, effective, and accessible products for the American public.</p>
911
10-
<p class="lead-paragraph">The Design System is an open-source resource for teams at the Consumer Financial Protection Bureau (CFPB). It's intended to help teams produce consistent, effective, and accessible products for the American public.</p>
1112
12-
</div>
13+
</div>
14+
1315
1416
<div class="content-25 content-last" markdown="1">
1517
16-
![Homepage image](/design-system/images/uploads/cfpb_ds_home.png)
18+
19+
![Homepage image](/design-system/images/uploads/cfpb_ds_home.png)
20+
1721
1822
</div>
1923
20-
## Getting started
2124
22-
Start with our [general principles](https://cfpb.github.io/design-system/general-principles), which form the strategic underpinnings for the CFPB’s design and development standards. Also check out our [accessibility principles](https://cfpb.github.io/design-system/guidelines/accessibility-principles), which lay the foundation for ensuring that our web content is available for all users.
25+
## Getting started
26+
27+
28+
Start with our [general principles](https://cfpb.github.io/design-system/general-principles), which form the strategic underpinnings for the CFPB’s design and development standards. Also check out our [accessibility principles](https://cfpb.github.io/design-system/guidelines/accessibility-principles), which lay the foundation for ensuring that our web content is available for all users.
29+
30+
31+
### For developers
2332
24-
### For developers
2533
2634
<div class="content-50 content-last" markdown="1">
2735
28-
#### Setup and contribution
36+
37+
#### Setup and contribution
2938
3039
<p>The Design System provides a set of modular HTML, CSS, and JavaScript patterns that can be integrated into your project. <a href="https://cfpb.github.io/design-system/development/integrating-the-design-system-into-your-project">Integrate the Design System into your project</a>.</p>
3140
3241
<p>
3342
34-
Learn how to contribute to the Design System code base and update the documentation. <a href="https://github.com/cfpb/design-system/blob/main/CONTRIBUTING.md">Get started</a>.
43+
Learn how to contribute to the Design System code base and update the documentation. <a href="https://github.com/cfpb/design-system/blob/main/CONTRIBUTING.md">Get started</a>.
3544
3645
</p>
3746
3847
</div>
3948
49+
4050
<div class="content-50 content-last" markdown="1">
4151
42-
#### Using source code
4352
44-
The Design System also includes the source code for the common components that power the design of [consumerfinance.gov](https://www.consumerfinance.gov).
53+
#### Using source code
54+
55+
56+
The Design System also includes the source code for the common components that power the design of [consumerfinance.gov](https://www.consumerfinance.gov).
4557
4658
<p>
4759
48-
<a href="https://github.com/cfpb/design-system">View source code on GitHub</a></p></div>
60+
<a href="https://github.com/cfpb/design-system">View source code on GitHub</a></p></div>
61+
4962
5063
<br>
5164
52-
### For designers
5365
54-
Check out <a href="https://www.figma.com/community/file/1487539003249310850">CFPB Design System</a> in the Figma Community.
66+
### For designers
67+
68+
69+
Check out <a href="https://www.figma.com/community/file/1487539003249310850">CFPB Design System</a> in the Figma Community.
70+
5571
5672
<br>
5773
58-
## Browse the Design System
74+
75+
## Browse the Design System
76+
5977
6078
<div class="content-33 content-last" markdown="1">
6179
62-
### Foundation
6380
64-
This section includes our visual identity standards, such as color, grid, and typography. It forms the foundation for the CFPB’s website and external-facing materials.
81+
### Foundation
82+
83+
This section includes our visual identity standards, such as color, grid, and typography. It forms the foundation for the CFPB’s website and external-facing materials.
6584
6685
<p><a href="https://cfpb.github.io/design-system/foundation/">Browse foundation</a></p></div>
6786
87+
6888
<div class="content-33 content-last" markdown="1">
6989
70-
### Components
7190
72-
Components contain the key building blocks of the design system that, when combined, can be used to create a website. Examples of components include buttons, text inputs, tables, and alerts.
91+
### Components
92+
93+
Components contain the key building blocks of the design system that, when combined, can be used to create a website. Examples of components include buttons, text inputs, tables, and alerts.
7394
7495
<p><a href="https://cfpb.github.io/design-system/components/">Browse components</a></p>
7596
7697
</div>
7798
99+
78100
<div class="content-33 content-last" markdown="1">
79101
80-
### Patterns
81102
82-
Patterns are combinations of components used in conjunction to achieve a goal. Interaction patterns are best practice design solutions to common user tasks. Layout patterns are used by designers to organize content into clear, accessible web pages.
103+
### Patterns
104+
105+
Patterns are combinations of components used in conjunction to achieve a goal. Interaction patterns are best practice design solutions to common user tasks. Layout patterns are used by designers to organize content into clear, accessible web pages.
83106
84107
<p><a href="https://cfpb.github.io/design-system/patterns/">Browse patterns</a></p>
85108
86109
</div>
87110
111+
88112
<div class="content-33 content-last" markdown="1">
89113
90-
### Pages
91114
92-
Find out more about the common page types that we use within our content management system, which are documented for easy reference.
115+
### Pages
116+
117+
Find out more about the common page types that we use within our content management system, which are documented for easy reference.
93118
94119
<p><a href="https://cfpb.github.io/design-system/pages/">Browse pages</a></p>
95120
96121
</div>
97122
123+
98124
<div class="content-33 content-last" markdown="1">
99125
100-
### Development
101126
102-
The development section includes utilities, such as variables, helper classes, and mixins, and layout options, such as blocks.
127+
### Development
128+
129+
The development section includes utilities, such as variables, helper classes, and mixins, and layout options, such as blocks.
103130
104131
<p><a href="https://cfpb.github.io/design-system/development/">Browse development</a></p>
105132
106133
</div>
107134
135+
108136
<div class="content-33 content-last" markdown="1">
109137
110-
### Guidelines
111138
112-
This section includes guidelines for creating specific product experiences not covered in other sections.
139+
### Guidelines
140+
141+
This section includes guidelines for creating specific product experiences not covered in other sections.
113142
114143
<p><a href="https://cfpb.github.io/design-system/guidelines/">Browse guidelines</a></p>
115144
116145
</div>
117146
147+
118148
<br>
119149
120150
<br>
121151
122-
## Contribute to the Design System
123152
124-
We strongly encourage you to participate in the growth and maintenance of the Design System. To make contribution easier, the Design System is built on a tool called Decap CMS, which allows for editing of pages in a web browser, without needing to use git or other command-line tools.
153+
## Contribute to the Design System
154+
155+
156+
We strongly encourage you to participate in the growth and maintenance of the Design System. To make contribution easier, the Design System is built on a tool called Decap CMS, which allows for editing of pages in a web browser, without needing to use git or other command-line tools.
125157
126158
<p><a href="https://cfpb.github.io/design-system/updating-this-website/">View instructions for contributing to the Design System</a></p>
127159
128160
<br>
129161
162+
130163
<hr>
131164
165+
132166
<h3 class="h4">About the CFPB Design System</h3>
133167
134-
Our design system has been created to work with a wide range of devices and browsers. Following a modern, mobile first responsive approach, sites built with our Design System easily adapt to a wide range of screen sizes, all while carefully following accessibility best practices.
135168
136-
As a work of the United States government, all code is open source and in the public domain. We encourage you to use this framework in your own projects and to contribute back.
169+
Our design system has been created to work with a wide range of devices and browsers. Following a modern, mobile first responsive approach, sites built with our Design System easily adapt to a wide range of screen sizes, all while carefully following accessibility best practices.
170+
171+
As a work of the United States government, all code is open source and in the public domain. We encourage you to use this framework in your own projects and to contribute back.
172+
137173
138174
<h3 class="h4">License</h3>
139175
140-
All content, apart from CFPB trademarked properties, has been released as open source under the CC0 1.0 Universal Public Domain Dedication, and we’d love for other agencies, developers, or groups to adapt it for their own use.
176+
All content, apart from CFPB trademarked properties, has been released as open source under the CC0 1.0 Universal Public Domain Dedication, and we’d love for other agencies, developers, or groups to adapt it for their own use.
141177
142178
<h4 class="h5">Trademark notice</h4>
143179
144-
<p>The CFPB’s logo and the standard characters Consumer Financial Protection Bureau, CFPB, Know Before You Owe, and Money as You Grow are registered trademarks owned by the CFPB. Nothing on this website shall be construed as granting any license to use any trademark displayed on the website without the express written permission of the CFPB. Your use of these registered trademarks must comply with intellectual property laws. You may not use the CFPB trademarks to state or imply an association with or endorsement of your goods, services, or activities, nor in any manner that infringes upon the CFPB trademarks. Requests to use the CFPB trademarks should be made to the Office of the General Counsel, <a href="mailto:cfpb_ip@cfpb.gov">cfpb_ip@cfpb.gov</a>.</p>
180+
<p>The CFPB’s logo and the standard characters Consumer Financial Protection Bureau, CFPB, Know Before You Owe, and Money as You Grow are registered trademarks owned by the CFPB. Nothing on this website shall be construed as granting any license to use any trademark displayed on the website without the express written permission of the CFPB. Your use of these registered trademarks must comply with intellectual property laws. You may not use the CFPB trademarks to state or imply an association with or endorsement of your goods, services, or activities, nor in any manner that infringes upon the CFPB trademarks. Requests to use the CFPB trademarks should be made to the Office of the General Counsel, <a href="mailto:cfpb_ip@cfpb.gov">cfpb_ip@cfpb.gov</a>.</p>
181+
---

0 commit comments

Comments
 (0)