Skip to content
This repository has been archived by the owner on Dec 4, 2018. It is now read-only.

Use self-hosted fonts from cf.gov #841

Merged
merged 3 commits into from
Dec 6, 2017
Merged

Use self-hosted fonts from cf.gov #841

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3248281
use self-hosted fonts from cf.gov
chosak Dec 5, 2017
0d49600
update fonts to use woff and woff2 only
chosak Dec 6, 2017
35970c5
clarify instructions re: static.in directory.
chosak Dec 6, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,3 +86,7 @@ eregsip/

# docs output
docs/_build

# Static assets #
#################
static.in/*/
13 changes: 13 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -207,3 +207,16 @@ After you create a [Sauce Labs](https://saucelabs.com) account:
- Unit tests do not require running the dummy API.
- To run the unit tests along with the functional tests: ```grunt test``` from the root of the repo.
- To run unit tests individually: ```grunt mocha_istanbul``` from the root of the repo.

### Font files

The CSS styles for this project refer to some font files which cannot be distributed publicly (see definitions in `regulations/static/regulations/css/less/fonts.less`). These fonts need to live under a `fonts` subdirectory of wherever static assets are served from, e.g. `/static/fonts`. There are fallback fonts defined which will be used if the desired fonts are not available.

If you want to install self-hosted fonts locally for use in development, you can place the font files in `/static.in/cfgov-fonts/fonts/` and restart the local web server. If you are a CFPB employee, you can perform this step with:

```
cd /static.in/ && git clone https://[GHE]/CFGOV/cfgov-fonts/
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This might just be me, but I had to drop the leading / in /static.in/ to switch to the right directory (I was in the root of regulations-site at the time):

cd static.in/ && git clone https://[GHE]/CFGOV/cfgov-fonts/

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, you're right, it should be without a leading /. Change made in 35970c5.

```
where `[GHE]` is our GitHub Enterprise URL.

See the [cfgov-refresh Webfonts documentation](https://cfpb.github.io/cfgov-refresh/installation/#webfonts) for a similar setup.
8 changes: 6 additions & 2 deletions regulations/settings/dev.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,12 @@
DEBUG = True
TEMPLATE_DEBUG = DEBUG

STATICFILES_DIRS = (
root('static'),
# Add static file directories that live in subdirectories under static.in.
STATIC_IN = root('static.in')
STATICFILES_DIRS += tuple(
os.path.join(STATIC_IN, d)
for d in os.listdir(STATIC_IN)
if os.path.isdir(os.path.join(STATIC_IN, d))
)


Expand Down
30 changes: 15 additions & 15 deletions regulations/static/regulations/css/less/fonts.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,45 +6,45 @@

@font-face{
font-family: "Avenir Next";
src: url("../../eregsip/font/e9167238-3b3f-4813-a04a-a384394eed42.eot");
src: url("../../eregsip/font/e9167238-3b3f-4813-a04a-a384394eed42.eot?iefix") format("embedded-opentype"),
url("../../eregsip/font/1e9892c0-6927-4412-9874-1b82801ba47a.woff") format("woff");
src: url("../../fonts/e9167238-3b3f-4813-a04a-a384394eed42.eot");
src: url("../../fonts/e9167238-3b3f-4813-a04a-a384394eed42.eot?iefix") format("embedded-opentype"),
Copy link
Member

@anselmbradford anselmbradford Dec 5, 2017 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can drop everything but woff and woff2 files. See https://[GHE]/CFPB/hubcap/issues/66

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

See cfpb/capital-framework#697 for example.

url("../../fonts/1e9892c0-6927-4412-9874-1b82801ba47a.woff") format("woff");
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add woff2 format from https://[GHE]/CFGOV/cfgov-fonts

font-weight: 400;
font-style: normal;
}

@font-face{
font-family: "Avenir Next Italic";
src: url("../../eregsip/font/d1fddef1-d940-4904-8f6c-17e809462301.eot");
src: url("../../eregsip/font/d1fddef1-d940-4904-8f6c-17e809462301.eot?iefix") format("embedded-opentype"),
url("../../eregsip/font/92b66dbd-4201-4ac2-a605-4d4ffc8705cc.woff") format("woff");
src: url("../../fonts/d1fddef1-d940-4904-8f6c-17e809462301.eot");
src: url("../../fonts/d1fddef1-d940-4904-8f6c-17e809462301.eot?iefix") format("embedded-opentype"),
url("../../fonts/92b66dbd-4201-4ac2-a605-4d4ffc8705cc.woff") format("woff");
font-weight: 400;
font-style: italic;
}

@font-face{
font-family: "Avenir Next Demi";
src: url("../../eregsip/font/12d643f2-3899-49d5-a85b-ff430f5fad15.eot");
src: url("../../eregsip/font/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?iefix") format("embedded-opentype"),
url("../../eregsip/font/91b50bbb-9aa1-4d54-9159-ec6f19d14a7c.woff") format("woff");
src: url("../../fonts/12d643f2-3899-49d5-a85b-ff430f5fad15.eot");
src: url("../../fonts/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?iefix") format("embedded-opentype"),
url("../../fonts/91b50bbb-9aa1-4d54-9159-ec6f19d14a7c.woff") format("woff");
font-weight: 600;
font-style: normal;
}

@font-face{
font-family: "Avenir Next Bold";
src: url("../../eregsip/font/dccb10af-07a2-404c-bfc7-7750e2716bc1.eot");
src: url("../../eregsip/font/dccb10af-07a2-404c-bfc7-7750e2716bc1.eot?iefix") format("embedded-opentype"),
url("../../eregsip/font/b8e906a1-f5e8-4bf1-8e80-82c646ca4d5f.woff") format("woff");
src: url("../../fonts/dccb10af-07a2-404c-bfc7-7750e2716bc1.eot");
src: url("../../fonts/dccb10af-07a2-404c-bfc7-7750e2716bc1.eot?iefix") format("embedded-opentype"),
url("../../fonts/b8e906a1-f5e8-4bf1-8e80-82c646ca4d5f.woff") format("woff");
font-weight: 700;
font-style: normal;
}

@font-face{
font-family: "Avenir Next Demi Italic";
src: url("../../eregsip/font/770d9a7e-8842-4376-9319-8f2c8b8e880d.eot");
src: url("../../eregsip/font/770d9a7e-8842-4376-9319-8f2c8b8e880d.eot?#iefix") format("embedded-opentype"),
url("../../eregsip/font/bc350df4-3100-4ce1-84ce-4a5363dbccfa.woff") format("woff");
src: url("../../fonts/770d9a7e-8842-4376-9319-8f2c8b8e880d.eot");
src: url("../../fonts/770d9a7e-8842-4376-9319-8f2c8b8e880d.eot?#iefix") format("embedded-opentype"),
url("../../fonts/bc350df4-3100-4ce1-84ce-4a5363dbccfa.woff") format("woff");
font-weight: 600;
font-style: italic;
}
Empty file added static.in/.gitkeep
View file
Open in desktop
Empty file.