jekyll-v4-theme-primer 0.9.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/LICENSE.md +22 -0
- data/README.md +116 -0
- data/_includes/.gitkeep +1 -0
- data/_includes/head-custom-google-analytics.html +10 -0
- data/_includes/head-custom.html +9 -0
- data/_includes/theme.html +11 -0
- data/_layouts/default.html +29 -0
- data/_layouts/home.html +4 -0
- data/_layouts/page.html +4 -0
- data/_layouts/post.html +4 -0
- data/_sass/@primer/css/actionlist/action-list-item-divider.scss +48 -0
- data/_sass/@primer/css/actionlist/action-list-item.scss +593 -0
- data/_sass/@primer/css/actionlist/action-list-tree.scss +118 -0
- data/_sass/@primer/css/actionlist/action-list-variables.scss +8 -0
- data/_sass/@primer/css/actionlist/action-list.scss +67 -0
- data/_sass/@primer/css/actionlist/index.scss +6 -0
- data/_sass/@primer/css/alerts/flash.scss +1 -0
- data/_sass/@primer/css/alerts/index.scss +3 -0
- data/_sass/@primer/css/autocomplete/autocomplete.scss +1 -0
- data/_sass/@primer/css/autocomplete/index.scss +4 -0
- data/_sass/@primer/css/autocomplete/suggester.scss +92 -0
- data/_sass/@primer/css/avatars/avatar-parent-child.scss +17 -0
- data/_sass/@primer/css/avatars/avatar-stack.scss +1 -0
- data/_sass/@primer/css/avatars/avatar.scss +1 -0
- data/_sass/@primer/css/avatars/circle-badge.scss +55 -0
- data/_sass/@primer/css/avatars/index.scss +7 -0
- data/_sass/@primer/css/base/base.scss +160 -0
- data/_sass/@primer/css/base/index.scss +6 -0
- data/_sass/@primer/css/base/kbd.scss +19 -0
- data/_sass/@primer/css/base/normalize.scss +381 -0
- data/_sass/@primer/css/base/octicons.scss +6 -0
- data/_sass/@primer/css/base/typography-base.scss +89 -0
- data/_sass/@primer/css/blankslate/blankslate.scss +1 -0
- data/_sass/@primer/css/blankslate/index.scss +2 -0
- data/_sass/@primer/css/box/box-overlay.scss +42 -0
- data/_sass/@primer/css/box/box.scss +1 -0
- data/_sass/@primer/css/box/index.scss +3 -0
- data/_sass/@primer/css/branch-name/branch-name.scss +31 -0
- data/_sass/@primer/css/branch-name/index.scss +3 -0
- data/_sass/@primer/css/breadcrumb/breadcrumb.scss +1 -0
- data/_sass/@primer/css/breadcrumb/index.scss +3 -0
- data/_sass/@primer/css/buttons/button-group.scss +92 -0
- data/_sass/@primer/css/buttons/button.scss +340 -0
- data/_sass/@primer/css/buttons/index.scss +4 -0
- data/_sass/@primer/css/buttons/misc.scss +231 -0
- data/_sass/@primer/css/color-modes/index.scss +12 -0
- data/_sass/@primer/css/color-modes/native.scss +22 -0
- data/_sass/@primer/css/color-modes/themes/dark.scss +6 -0
- data/_sass/@primer/css/color-modes/themes/dark_colorblind.scss +6 -0
- data/_sass/@primer/css/color-modes/themes/dark_dimmed.scss +6 -0
- data/_sass/@primer/css/color-modes/themes/dark_high_contrast.scss +6 -0
- data/_sass/@primer/css/color-modes/themes/dark_tritanopia.scss +6 -0
- data/_sass/@primer/css/color-modes/themes/light.scss +6 -0
- data/_sass/@primer/css/color-modes/themes/light_colorblind.scss +6 -0
- data/_sass/@primer/css/color-modes/themes/light_high_contrast.scss +6 -0
- data/_sass/@primer/css/color-modes/themes/light_tritanopia.scss +6 -0
- data/_sass/@primer/css/core/index.scss +30 -0
- data/_sass/@primer/css/dropdown/dropdown.scss +1 -0
- data/_sass/@primer/css/dropdown/index.scss +2 -0
- data/_sass/@primer/css/forms/FormControl.scss +1 -0
- data/_sass/@primer/css/forms/form-control.scss +267 -0
- data/_sass/@primer/css/forms/form-group.scss +287 -0
- data/_sass/@primer/css/forms/form-select.scss +46 -0
- data/_sass/@primer/css/forms/form-validation.scss +369 -0
- data/_sass/@primer/css/forms/index.scss +9 -0
- data/_sass/@primer/css/forms/input-group.scss +71 -0
- data/_sass/@primer/css/forms/radio-group.scss +62 -0
- data/_sass/@primer/css/header/header.scss +47 -0
- data/_sass/@primer/css/header/index.scss +2 -0
- data/_sass/@primer/css/index.scss +19 -0
- data/_sass/@primer/css/labels/counters.scss +1 -0
- data/_sass/@primer/css/labels/diffstat.scss +37 -0
- data/_sass/@primer/css/labels/index.scss +7 -0
- data/_sass/@primer/css/labels/issue-labels.scss +23 -0
- data/_sass/@primer/css/labels/labels.scss +1 -0
- data/_sass/@primer/css/labels/mixins.scss +37 -0
- data/_sass/@primer/css/labels/states.scss +1 -0
- data/_sass/@primer/css/layout/app-frame.scss +156 -0
- data/_sass/@primer/css/layout/container.scss +30 -0
- data/_sass/@primer/css/layout/grid-offset.scss +20 -0
- data/_sass/@primer/css/layout/grid.scss +65 -0
- data/_sass/@primer/css/layout/index.scss +8 -0
- data/_sass/@primer/css/layout/layout.scss +1 -0
- data/_sass/@primer/css/layout/page-layout.scss +413 -0
- data/_sass/@primer/css/layout/stack.scss +220 -0
- data/_sass/@primer/css/links/index.scss +3 -0
- data/_sass/@primer/css/links/link.scss +60 -0
- data/_sass/@primer/css/loaders/index.scss +2 -0
- data/_sass/@primer/css/loaders/loaders.scss +19 -0
- data/_sass/@primer/css/markdown/blob-csv.scss +29 -0
- data/_sass/@primer/css/markdown/code.scss +77 -0
- data/_sass/@primer/css/markdown/footnotes.scss +55 -0
- data/_sass/@primer/css/markdown/headings.scss +96 -0
- data/_sass/@primer/css/markdown/images.scss +130 -0
- data/_sass/@primer/css/markdown/index.scss +9 -0
- data/_sass/@primer/css/markdown/lists.scss +98 -0
- data/_sass/@primer/css/markdown/markdown-body.scss +96 -0
- data/_sass/@primer/css/markdown/tables.scss +36 -0
- data/_sass/@primer/css/marketing/buttons/button.scss +164 -0
- data/_sass/@primer/css/marketing/buttons/index.scss +3 -0
- data/_sass/@primer/css/marketing/index.scss +15 -0
- data/_sass/@primer/css/marketing/links/index.scss +3 -0
- data/_sass/@primer/css/marketing/links/link.scss +50 -0
- data/_sass/@primer/css/marketing/support/index.scss +2 -0
- data/_sass/@primer/css/marketing/support/variables.scss +127 -0
- data/_sass/@primer/css/marketing/type/index.scss +3 -0
- data/_sass/@primer/css/marketing/type/typography.scss +118 -0
- data/_sass/@primer/css/marketing/utilities/animations.scss +51 -0
- data/_sass/@primer/css/marketing/utilities/borders.scss +4 -0
- data/_sass/@primer/css/marketing/utilities/filters.scss +3 -0
- data/_sass/@primer/css/marketing/utilities/index.scss +6 -0
- data/_sass/@primer/css/marketing/utilities/layout.scss +51 -0
- data/_sass/@primer/css/navigation/filter-list.scss +82 -0
- data/_sass/@primer/css/navigation/index.scss +8 -0
- data/_sass/@primer/css/navigation/menu.scss +1 -0
- data/_sass/@primer/css/navigation/sidenav.scss +99 -0
- data/_sass/@primer/css/navigation/subnav.scss +146 -0
- data/_sass/@primer/css/navigation/tabnav.scss +1 -0
- data/_sass/@primer/css/navigation/underline-nav.scss +1 -0
- data/_sass/@primer/css/overlay/index.scss +2 -0
- data/_sass/@primer/css/overlay/overlay.scss +1 -0
- data/_sass/@primer/css/pagination/index.scss +3 -0
- data/_sass/@primer/css/pagination/pagination.scss +156 -0
- data/_sass/@primer/css/popover/index.scss +3 -0
- data/_sass/@primer/css/popover/popover.scss +1 -0
- data/_sass/@primer/css/primitives/index.scss +10 -0
- data/_sass/@primer/css/primitives/temp-typography-tokens.scss +22 -0
- data/_sass/@primer/css/product/index.scss +28 -0
- data/_sass/@primer/css/progress/index.scss +3 -0
- data/_sass/@primer/css/progress/progress.scss +1 -0
- data/_sass/@primer/css/select-menu/index.scss +3 -0
- data/_sass/@primer/css/select-menu/select-menu.scss +463 -0
- data/_sass/@primer/css/subhead/index.scss +3 -0
- data/_sass/@primer/css/subhead/subhead.scss +1 -0
- data/_sass/@primer/css/support/index.scss +10 -0
- data/_sass/@primer/css/support/mixins/color-modes.scss +109 -0
- data/_sass/@primer/css/support/mixins/layout.scss +58 -0
- data/_sass/@primer/css/support/mixins/misc.scss +73 -0
- data/_sass/@primer/css/support/mixins/typography.scss +91 -0
- data/_sass/@primer/css/support/variables/layout.scss +230 -0
- data/_sass/@primer/css/support/variables/misc.scss +18 -0
- data/_sass/@primer/css/support/variables/typography.scss +43 -0
- data/_sass/@primer/css/table-object/index.scss +1 -0
- data/_sass/@primer/css/table-object/table-object.scss +23 -0
- data/_sass/@primer/css/timeline/index.scss +2 -0
- data/_sass/@primer/css/timeline/timeline-item.scss +1 -0
- data/_sass/@primer/css/toasts/index.scss +2 -0
- data/_sass/@primer/css/toasts/toasts.scss +127 -0
- data/_sass/@primer/css/toggle-switch/index.scss +2 -0
- data/_sass/@primer/css/toggle-switch/toggle-switch.scss +1 -0
- data/_sass/@primer/css/tooltips/index.scss +2 -0
- data/_sass/@primer/css/tooltips/tooltips.scss +281 -0
- data/_sass/@primer/css/truncate/index.scss +2 -0
- data/_sass/@primer/css/truncate/truncate.scss +2 -0
- data/_sass/@primer/css/utilities/animations.scss +196 -0
- data/_sass/@primer/css/utilities/borders.scss +74 -0
- data/_sass/@primer/css/utilities/box-shadow.scss +25 -0
- data/_sass/@primer/css/utilities/colors.scss +95 -0
- data/_sass/@primer/css/utilities/details.scss +105 -0
- data/_sass/@primer/css/utilities/flexbox.scss +52 -0
- data/_sass/@primer/css/utilities/index.scss +14 -0
- data/_sass/@primer/css/utilities/layout.scss +96 -0
- data/_sass/@primer/css/utilities/margin.scss +71 -0
- data/_sass/@primer/css/utilities/padding.scss +56 -0
- data/_sass/@primer/css/utilities/typography.scss +332 -0
- data/_sass/@primer/css/utilities/visibility-display.scss +123 -0
- data/_sass/@primer/primitives/dist/scss/colors/_dark.scss +443 -0
- data/_sass/@primer/primitives/dist/scss/colors/_dark_colorblind.scss +443 -0
- data/_sass/@primer/primitives/dist/scss/colors/_dark_dimmed.scss +443 -0
- data/_sass/@primer/primitives/dist/scss/colors/_dark_high_contrast.scss +443 -0
- data/_sass/@primer/primitives/dist/scss/colors/_dark_tritanopia.scss +443 -0
- data/_sass/@primer/primitives/dist/scss/colors/_light.scss +443 -0
- data/_sass/@primer/primitives/dist/scss/colors/_light_colorblind.scss +443 -0
- data/_sass/@primer/primitives/dist/scss/colors/_light_high_contrast.scss +443 -0
- data/_sass/@primer/primitives/dist/scss/colors/_light_tritanopia.scss +443 -0
- data/_sass/@primer/primitives/dist/scss/spacing/_normal.scss +11 -0
- data/_sass/@primer/primitives/dist/scss/typography/_normal.scss +15 -0
- data/_sass/@primer/primitives/tokens-v2-private/scss/tokens/base/size/size.scss +21 -0
- data/_sass/@primer/primitives/tokens-v2-private/scss/tokens/base/typography/typography.scss +8 -0
- data/_sass/@primer/primitives/tokens-v2-private/scss/tokens/functional/size/border.scss +14 -0
- data/_sass/@primer/primitives/tokens-v2-private/scss/tokens/functional/size/breakpoints.scss +10 -0
- data/_sass/@primer/primitives/tokens-v2-private/scss/tokens/functional/size/size-coarse.scss +7 -0
- data/_sass/@primer/primitives/tokens-v2-private/scss/tokens/functional/size/size-fine.scss +7 -0
- data/_sass/@primer/primitives/tokens-v2-private/scss/tokens/functional/size/size.scss +51 -0
- data/_sass/@primer/primitives/tokens-v2-private/scss/tokens/functional/size/viewport.scss +10 -0
- data/_sass/@primer/primitives/tokens-v2-private/scss/tokens/functional/typography/typography.scss +44 -0
- data/_sass/@primer/view-components/LICENSE.txt +21 -0
- data/_sass/@primer/view-components/README.md +17 -0
- data/_sass/@primer/view-components/app/assets/javascripts/primer_view_components.js +2 -0
- data/_sass/@primer/view-components/app/assets/javascripts/primer_view_components.js.map +1 -0
- data/_sass/@primer/view-components/app/assets/styles/primer_view_components.css +3 -0
- data/_sass/@primer/view-components/app/assets/styles/primer_view_components.css.map +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/action_list.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/action_list.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/auto_complete.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/auto_complete.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/banner.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/banner.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/button_marketing.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/button_marketing.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/dialog.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/dialog.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/dropdown/menu.d.ts +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/dropdown/menu.js +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/dropdown.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/dropdown.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/dropdown.d.ts +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/dropdown.js +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/image_crop.d.ts +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/image_crop.js +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/layout.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/layout.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/menu.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/menu.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/modal_dialog.d.ts +18 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/modal_dialog.js +150 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/nav_list.d.ts +25 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/nav_list.js +130 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/segmented_control.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/segmented_control.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/segmented_control.d.ts +12 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/segmented_control.js +47 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/tab_nav.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/tab_nav.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/text_field.css +3 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/text_field.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/toggle_switch.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/toggle_switch.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/toggle_switch.d.ts +29 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/toggle_switch.js +144 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/tool_tip.d.ts +25 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/tool_tip.js +389 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/underline_nav.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/underline_nav.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/x_banner.d.ts +11 -0
- data/_sass/@primer/view-components/app/components/primer/alpha/x_banner.js +35 -0
- data/_sass/@primer/view-components/app/components/primer/beta/auto_complete/auto_complete.d.ts +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/auto_complete/auto_complete.js +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/avatar.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/avatar.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/avatar_stack.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/avatar_stack.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/blankslate.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/blankslate.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/border_box.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/border_box.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/breadcrumbs.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/breadcrumbs.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/button.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/button.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/clipboard_copy.d.ts +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/clipboard_copy.js +43 -0
- data/_sass/@primer/view-components/app/components/primer/beta/counter.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/counter.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/flash.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/flash.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/label.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/label.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/link.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/link.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/popover.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/popover.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/progress_bar.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/progress_bar.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/truncate.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/beta/truncate.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/local_time.d.ts +1 -0
- data/_sass/@primer/view-components/app/components/primer/local_time.js +1 -0
- data/_sass/@primer/view-components/app/components/primer/primer.d.ts +15 -0
- data/_sass/@primer/view-components/app/components/primer/primer.js +15 -0
- data/_sass/@primer/view-components/app/components/primer/state_component.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/state_component.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/subhead_component.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/subhead_component.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/tab_container_component.d.ts +1 -0
- data/_sass/@primer/view-components/app/components/primer/tab_container_component.js +1 -0
- data/_sass/@primer/view-components/app/components/primer/time_ago_component.d.ts +1 -0
- data/_sass/@primer/view-components/app/components/primer/time_ago_component.js +1 -0
- data/_sass/@primer/view-components/app/components/primer/timeline_item_component.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/timeline_item_component.css.json +1 -0
- data/_sass/@primer/view-components/app/components/primer/truncate.css +1 -0
- data/_sass/@primer/view-components/app/components/primer/truncate.css.json +1 -0
- data/_sass/@primer/view-components/lib/primer/forms/primer_multi_input.d.ts +10 -0
- data/_sass/@primer/view-components/lib/primer/forms/primer_multi_input.js +45 -0
- data/_sass/@primer/view-components/lib/primer/forms/primer_text_field.d.ts +1 -0
- data/_sass/@primer/view-components/lib/primer/forms/primer_text_field.js +62 -0
- data/_sass/@primer/view-components/package.json +95 -0
- data/_sass/@primer/view-components/static/arguments.json +2586 -0
- data/_sass/@primer/view-components/static/audited_at.json +100 -0
- data/_sass/@primer/view-components/static/constants.json +1157 -0
- data/_sass/@primer/view-components/static/statuses.json +100 -0
- data/_sass/jekyll-theme-primer.scss +8 -0
- data/_sass/primer.scss +4 -0
- data/_sass/rouge.scss +213 -0
- data/assets/css/style.scss +4 -0
- metadata +444 -0
@@ -0,0 +1,332 @@
|
|
1
|
+
// stylelint-disable comment-empty-line-before, primer/typography
|
2
|
+
|
3
|
+
// Type scale variables found in ../support/lib/variables.scss
|
4
|
+
// $h00-size-mobile: 40px;
|
5
|
+
// $h0-size-mobile: 32px;
|
6
|
+
// $h1-size-mobile: 26px;
|
7
|
+
// $h2-size-mobile: 22px;
|
8
|
+
// $h3-size-mobile: 18px;
|
9
|
+
// $h00-size: 48px;
|
10
|
+
// $h0-size: 40px;
|
11
|
+
// $h1-size: 32px;
|
12
|
+
// $h2-size: 24px;
|
13
|
+
// $h3-size: 20px;
|
14
|
+
// $h4-size: 16px;
|
15
|
+
// $h5-size: 14px;
|
16
|
+
// $h6-size: 12px;
|
17
|
+
|
18
|
+
/* Set the font size to 26px */
|
19
|
+
.h1 {
|
20
|
+
font-size: var(--h1-size-mobile, $h1-size-mobile) !important;
|
21
|
+
|
22
|
+
@include breakpoint(md) {
|
23
|
+
font-size: var(--h1-size, $h1-size) !important;
|
24
|
+
}
|
25
|
+
}
|
26
|
+
|
27
|
+
/* Set the font size to 22px */
|
28
|
+
.h2 {
|
29
|
+
font-size: var(--h2-size-mobile, $h2-size-mobile) !important;
|
30
|
+
|
31
|
+
@include breakpoint(md) {
|
32
|
+
font-size: var(--h2-size, $h2-size) !important;
|
33
|
+
}
|
34
|
+
}
|
35
|
+
|
36
|
+
/* Set the font size to 18px */
|
37
|
+
.h3 {
|
38
|
+
font-size: var(--h3-size-mobile, $h3-size-mobile) !important;
|
39
|
+
|
40
|
+
@include breakpoint(md) {
|
41
|
+
font-size: var(--h3-size, $h3-size) !important;
|
42
|
+
}
|
43
|
+
}
|
44
|
+
|
45
|
+
/* Set the font size to #{$h4-size} */
|
46
|
+
.h4 {
|
47
|
+
font-size: var(--h4-size, $h4-size) !important;
|
48
|
+
}
|
49
|
+
|
50
|
+
/* Set the font size to #{$h5-size} */
|
51
|
+
.h5 {
|
52
|
+
font-size: var(--h5-size, $h5-size) !important;
|
53
|
+
}
|
54
|
+
|
55
|
+
// Does not include color property like typography base
|
56
|
+
// styles, color should be applied with color utilities.
|
57
|
+
/* Set the font size to #{$h6-size} */
|
58
|
+
.h6 {
|
59
|
+
font-size: var(--h6-size, $h6-size) !important;
|
60
|
+
}
|
61
|
+
|
62
|
+
// Heading utilities
|
63
|
+
.h1,
|
64
|
+
.h2,
|
65
|
+
.h3,
|
66
|
+
.h4,
|
67
|
+
.h5,
|
68
|
+
.h6 {
|
69
|
+
font-weight: var(--base-text-weight-semibold, $font-weight-bold) !important;
|
70
|
+
}
|
71
|
+
|
72
|
+
// Type utilities that match type sale
|
73
|
+
/* Set the font size to 26px */
|
74
|
+
.f1 {
|
75
|
+
font-size: var(--h1-size-mobile, $h1-size-mobile) !important;
|
76
|
+
|
77
|
+
@include breakpoint(md) {
|
78
|
+
font-size: var(--h1-size, $h1-size) !important;
|
79
|
+
}
|
80
|
+
}
|
81
|
+
|
82
|
+
/* Set the font size to 22px */
|
83
|
+
.f2 {
|
84
|
+
font-size: var(--h2-size-mobile, $h2-size-mobile) !important;
|
85
|
+
|
86
|
+
@include breakpoint(md) {
|
87
|
+
font-size: var(--h2-size, $h2-size) !important;
|
88
|
+
}
|
89
|
+
}
|
90
|
+
|
91
|
+
/* Set the font size to 18px */
|
92
|
+
.f3 {
|
93
|
+
font-size: var(--h3-size-mobile, $h3-size-mobile) !important;
|
94
|
+
|
95
|
+
@include breakpoint(md) {
|
96
|
+
font-size: var(--h3-size, $h3-size) !important;
|
97
|
+
}
|
98
|
+
}
|
99
|
+
|
100
|
+
/* Set the font size to #{$h4-size} */
|
101
|
+
.f4 {
|
102
|
+
font-size: var(--h4-size, $h4-size) !important;
|
103
|
+
|
104
|
+
@include breakpoint(md) {
|
105
|
+
font-size: var(--h4-size, $h4-size) !important;
|
106
|
+
}
|
107
|
+
}
|
108
|
+
|
109
|
+
/* Set the font size to #{$h5-size} */
|
110
|
+
.f5 {
|
111
|
+
font-size: var(--h5-size, $h5-size) !important;
|
112
|
+
}
|
113
|
+
|
114
|
+
/* Set the font size to #{$h6-size} */
|
115
|
+
.f6 {
|
116
|
+
font-size: var(--h6-size, $h6-size) !important;
|
117
|
+
}
|
118
|
+
|
119
|
+
// Type utils with light weight that match type scale
|
120
|
+
/* Set the font size to 40px and weight to light */
|
121
|
+
.f00-light {
|
122
|
+
font-size: var(--h00-size-mobile, $h00-size-mobile) !important;
|
123
|
+
font-weight: var(--base-text-weight-light, $font-weight-light) !important;
|
124
|
+
|
125
|
+
@include breakpoint(md) {
|
126
|
+
font-size: var(--h00-size, $h00-size) !important;
|
127
|
+
}
|
128
|
+
}
|
129
|
+
|
130
|
+
/* Set the font size to 32px and weight to light */
|
131
|
+
.f0-light {
|
132
|
+
font-size: var(--h0-size-mobile, $h0-size-mobile) !important;
|
133
|
+
font-weight: var(--base-text-weight-light, $font-weight-light) !important;
|
134
|
+
|
135
|
+
@include breakpoint(md) {
|
136
|
+
font-size: var(--h0-size, $h0-size) !important;
|
137
|
+
}
|
138
|
+
}
|
139
|
+
|
140
|
+
/* Set the font size to 26px and weight to light */
|
141
|
+
.f1-light {
|
142
|
+
font-size: var(--h1-size-mobile, $h1-size-mobile) !important;
|
143
|
+
font-weight: var(--base-text-weight-light, $font-weight-light) !important;
|
144
|
+
|
145
|
+
@include breakpoint(md) {
|
146
|
+
font-size: var(--h1-size, $h1-size) !important;
|
147
|
+
}
|
148
|
+
}
|
149
|
+
|
150
|
+
/* Set the font size to 22px and weight to light */
|
151
|
+
.f2-light {
|
152
|
+
font-size: var(--h2-size-mobile, $h2-size-mobile) !important;
|
153
|
+
font-weight: var(--base-text-weight-light, $font-weight-light) !important;
|
154
|
+
|
155
|
+
@include breakpoint(md) {
|
156
|
+
font-size: var(--h2-size, $h2-size) !important;
|
157
|
+
}
|
158
|
+
}
|
159
|
+
|
160
|
+
// Same size and weight as .lead but without color property
|
161
|
+
/* Set the font size to 18px and weight to light */
|
162
|
+
.f3-light {
|
163
|
+
font-size: var(--h3-size-mobile, $h3-size-mobile) !important;
|
164
|
+
font-weight: var(--base-text-weight-light, $font-weight-light) !important;
|
165
|
+
|
166
|
+
@include breakpoint(md) {
|
167
|
+
font-size: var(--h3-size, $h3-size) !important;
|
168
|
+
}
|
169
|
+
}
|
170
|
+
|
171
|
+
// Smallest text size
|
172
|
+
/* Set the font size to ${#h6-size} */
|
173
|
+
.text-small {
|
174
|
+
font-size: var(--h6-size, $h6-size) !important;
|
175
|
+
}
|
176
|
+
|
177
|
+
// 12px
|
178
|
+
|
179
|
+
/* Large leading paragraphs */
|
180
|
+
.lead {
|
181
|
+
// stylelint-disable-next-line primer/spacing
|
182
|
+
margin-bottom: 30px;
|
183
|
+
font-size: var(--h3-size, $h3-size);
|
184
|
+
font-weight: var(--base-text-weight-light, $font-weight-light);
|
185
|
+
}
|
186
|
+
|
187
|
+
// Line-height variations
|
188
|
+
// Close to commonly used line-heights. Most line-heights
|
189
|
+
// combined with type size equate to whole pixels.
|
190
|
+
// Will be improved with future typography scale updates.
|
191
|
+
// Responsive line-height
|
192
|
+
@each $breakpoint, $variant in $responsive-variants {
|
193
|
+
@include breakpoint($breakpoint) {
|
194
|
+
|
195
|
+
/* Set the line height to ultra condensed */
|
196
|
+
.lh#{$variant}-condensed-ultra {
|
197
|
+
line-height: $lh-condensed-ultra !important;
|
198
|
+
}
|
199
|
+
|
200
|
+
/* Set the line height to condensed */
|
201
|
+
.lh#{$variant}-condensed {
|
202
|
+
line-height: $lh-condensed !important;
|
203
|
+
}
|
204
|
+
|
205
|
+
/* Set the line height to default */
|
206
|
+
.lh#{$variant}-default {
|
207
|
+
line-height: $lh-default !important;
|
208
|
+
}
|
209
|
+
|
210
|
+
/* Set the line height to zero */
|
211
|
+
.lh#{$variant}-0 {
|
212
|
+
line-height: 0 !important;
|
213
|
+
}
|
214
|
+
}
|
215
|
+
}
|
216
|
+
|
217
|
+
// Text alignments
|
218
|
+
// Responsive text alignment
|
219
|
+
@each $breakpoint, $variant in $responsive-variants {
|
220
|
+
@include breakpoint($breakpoint) {
|
221
|
+
|
222
|
+
/* Text align to the right */
|
223
|
+
.text#{$variant}-right {
|
224
|
+
text-align: right !important;
|
225
|
+
}
|
226
|
+
|
227
|
+
/* Text align to the left */
|
228
|
+
.text#{$variant}-left {
|
229
|
+
text-align: left !important;
|
230
|
+
}
|
231
|
+
|
232
|
+
/* Text align to the center */
|
233
|
+
.text#{$variant}-center {
|
234
|
+
text-align: center !important;
|
235
|
+
}
|
236
|
+
}
|
237
|
+
}
|
238
|
+
|
239
|
+
// Text styles
|
240
|
+
/* Set the font weight to normal */
|
241
|
+
.text-normal {
|
242
|
+
font-weight: $font-weight-normal !important;
|
243
|
+
}
|
244
|
+
|
245
|
+
/* Set the font weight to bold */
|
246
|
+
.text-bold {
|
247
|
+
font-weight: $font-weight-bold !important;
|
248
|
+
}
|
249
|
+
|
250
|
+
.text-semibold {
|
251
|
+
font-weight: $font-weight-semibold !important;
|
252
|
+
}
|
253
|
+
|
254
|
+
.text-light {
|
255
|
+
font-weight: $font-weight-light !important;
|
256
|
+
}
|
257
|
+
|
258
|
+
/* Set the font to italic */
|
259
|
+
.text-italic {
|
260
|
+
font-style: italic !important;
|
261
|
+
}
|
262
|
+
|
263
|
+
/* Make text uppercase */
|
264
|
+
.text-uppercase {
|
265
|
+
text-transform: uppercase !important;
|
266
|
+
}
|
267
|
+
|
268
|
+
/* Underline text */
|
269
|
+
.text-underline {
|
270
|
+
text-decoration: underline !important;
|
271
|
+
}
|
272
|
+
|
273
|
+
/* Don't underline text */
|
274
|
+
.no-underline {
|
275
|
+
text-decoration: none !important;
|
276
|
+
}
|
277
|
+
|
278
|
+
/* Don't wrap white space */
|
279
|
+
.no-wrap {
|
280
|
+
white-space: nowrap !important;
|
281
|
+
}
|
282
|
+
|
283
|
+
/* Normal white space */
|
284
|
+
.ws-normal {
|
285
|
+
white-space: normal !important;
|
286
|
+
}
|
287
|
+
|
288
|
+
/* Force long "words" to wrap if they exceed the width of the container */
|
289
|
+
.wb-break-word {
|
290
|
+
word-break: break-word !important;
|
291
|
+
// this is for backwards compatibility with browsers that don't respect overflow-wrap
|
292
|
+
word-wrap: break-word !important;
|
293
|
+
overflow-wrap: break-word !important;
|
294
|
+
}
|
295
|
+
|
296
|
+
/*
|
297
|
+
* Specifically apply word-break: break-all; per MDN:
|
298
|
+
*
|
299
|
+
* > Note: In contrast to `word-break: break-word` and `overflow-wrap: break-word`,
|
300
|
+
* > `word-break: break-all` will create a break at the exact place where text would
|
301
|
+
* > otherwise overflow its container (even if putting an entire word on its own line
|
302
|
+
* > would negate the need for a break).
|
303
|
+
*
|
304
|
+
* see: https://developer.mozilla.org/en-US/docs/Web/CSS/word-break#Values
|
305
|
+
*/
|
306
|
+
.wb-break-all {
|
307
|
+
word-break: break-all !important;
|
308
|
+
}
|
309
|
+
|
310
|
+
.text-emphasized {
|
311
|
+
font-weight: var(--base-text-weight-semibold, $font-weight-bold);
|
312
|
+
}
|
313
|
+
|
314
|
+
// List styles
|
315
|
+
.list-style-none {
|
316
|
+
list-style: none !important;
|
317
|
+
}
|
318
|
+
|
319
|
+
/* Set to monospace font */
|
320
|
+
.text-mono {
|
321
|
+
font-family: $mono-font !important;
|
322
|
+
}
|
323
|
+
|
324
|
+
/* Disallow user from selecting text */
|
325
|
+
.user-select-none {
|
326
|
+
user-select: none !important;
|
327
|
+
}
|
328
|
+
|
329
|
+
/* Make text capitalized (transforms first character to uppercase) */
|
330
|
+
.text-capitalize {
|
331
|
+
text-transform: capitalize !important;
|
332
|
+
}
|
@@ -0,0 +1,123 @@
|
|
1
|
+
// Visibility and display utilities
|
2
|
+
|
3
|
+
// Responsive display utilities
|
4
|
+
@each $breakpoint, $variant in $responsive-variants {
|
5
|
+
@include breakpoint($breakpoint) {
|
6
|
+
@each $display in $display-values {
|
7
|
+
.d#{$variant}-#{$display} { display: $display !important; }
|
8
|
+
}
|
9
|
+
}
|
10
|
+
}
|
11
|
+
|
12
|
+
.v-hidden { visibility: hidden !important; }
|
13
|
+
.v-visible { visibility: visible !important; }
|
14
|
+
|
15
|
+
// Hide utilities for each breakpoint
|
16
|
+
// Each hide utility only applies to one breakpoint range.
|
17
|
+
@media (max-width: $width-sm - 0.02px) {
|
18
|
+
.hide-sm {
|
19
|
+
display: none !important;
|
20
|
+
}
|
21
|
+
}
|
22
|
+
|
23
|
+
@media (min-width: $width-sm) and (max-width: $width-md - 0.02px) {
|
24
|
+
.hide-md {
|
25
|
+
display: none !important;
|
26
|
+
}
|
27
|
+
}
|
28
|
+
|
29
|
+
@media (min-width: $width-md) and (max-width: $width-lg - 0.02px) {
|
30
|
+
.hide-lg {
|
31
|
+
display: none !important;
|
32
|
+
}
|
33
|
+
}
|
34
|
+
|
35
|
+
@media (min-width: $width-lg) {
|
36
|
+
.hide-xl {
|
37
|
+
display: none !important;
|
38
|
+
}
|
39
|
+
}
|
40
|
+
|
41
|
+
// Show/Hide Viewport range utilities
|
42
|
+
|
43
|
+
.show-whenNarrow,
|
44
|
+
.show-whenRegular,
|
45
|
+
.show-whenWide,
|
46
|
+
.show-whenRegular.hide-whenWide {
|
47
|
+
display: none !important;
|
48
|
+
}
|
49
|
+
|
50
|
+
.hide-whenNarrow,
|
51
|
+
.hide-whenRegular,
|
52
|
+
.hide-whenWide {
|
53
|
+
display: block !important;
|
54
|
+
}
|
55
|
+
|
56
|
+
@media (max-width: $width-md - 0.02px) {
|
57
|
+
.show-whenNarrow {
|
58
|
+
display: block !important;
|
59
|
+
}
|
60
|
+
|
61
|
+
.hide-whenNarrow {
|
62
|
+
display: none !important;
|
63
|
+
}
|
64
|
+
}
|
65
|
+
|
66
|
+
@media (min-width: $width-md) {
|
67
|
+
.show-whenRegular,
|
68
|
+
.show-whenRegular.hide-whenWide {
|
69
|
+
display: block !important;
|
70
|
+
}
|
71
|
+
|
72
|
+
.hide-whenRegular {
|
73
|
+
display: none !important;
|
74
|
+
}
|
75
|
+
}
|
76
|
+
|
77
|
+
// The width of a `wide` viewport range may change as we're finalizing
|
78
|
+
// the Primer primitives viewport ranges proposal
|
79
|
+
@media (min-width: $width-xl) {
|
80
|
+
.show-whenWide {
|
81
|
+
display: block !important;
|
82
|
+
}
|
83
|
+
|
84
|
+
.hide-whenWide,
|
85
|
+
.show-whenRegular.hide-whenWide {
|
86
|
+
display: none !important;
|
87
|
+
}
|
88
|
+
}
|
89
|
+
|
90
|
+
/* Set the table-layout to fixed */
|
91
|
+
.table-fixed { table-layout: fixed !important; }
|
92
|
+
|
93
|
+
// Only display content to screen readers
|
94
|
+
//
|
95
|
+
// See: http://a11yproject.com/posts/how-to-hide-content/
|
96
|
+
.sr-only {
|
97
|
+
position: absolute;
|
98
|
+
width: 1px;
|
99
|
+
height: 1px;
|
100
|
+
padding: 0;
|
101
|
+
overflow: hidden;
|
102
|
+
clip: rect(0, 0, 0, 0);
|
103
|
+
// Workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=1241631
|
104
|
+
word-wrap: normal;
|
105
|
+
border: 0;
|
106
|
+
}
|
107
|
+
|
108
|
+
// Only display content on focus
|
109
|
+
.show-on-focus {
|
110
|
+
position: absolute;
|
111
|
+
width: 1px;
|
112
|
+
height: 1px;
|
113
|
+
margin: 0;
|
114
|
+
overflow: hidden;
|
115
|
+
clip: rect(1px, 1px, 1px, 1px);
|
116
|
+
|
117
|
+
&:focus {
|
118
|
+
z-index: 999;
|
119
|
+
width: auto;
|
120
|
+
height: auto;
|
121
|
+
clip: auto;
|
122
|
+
}
|
123
|
+
}
|