1
1
mirror of https://github.com/primer/css.git synced 2024-12-23 22:24:11 +03:00

Fix typos in docs/content (#1543)

This commit is contained in:
SaintMalik 2021-08-23 04:15:11 +01:00 committed by GitHub
parent 99df9c9f28
commit 95bc6951fe
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 7 additions and 7 deletions

View File

@ -92,7 +92,7 @@ Add an additional optional class to the `.blankslate` to change its appearance.
</div> </div>
``` ```
**Note**: It's possible to combine variations. Large and spacious (`blankslate blankslate-large blankslate-spacious`) is often used toghether. **Note**: It's possible to combine variations. Large and spacious (`blankslate blankslate-large blankslate-spacious`) is often used together.
### Add border ### Add border

View File

@ -131,7 +131,7 @@ Create a button that looks like a link with `.btn-link`. Rather than using an `<
### Invisible button ### Invisible button
When you want a link, but you want it padded and line heighted like a button best for "cancel" actions on forms. When you want a link, but you want it padded and line heightened like a button best for "cancel" actions on forms.
```html live ```html live
<button class="btn btn-invisible" type="button">Cancel</button> <button class="btn btn-invisible" type="button">Cancel</button>

View File

@ -40,7 +40,7 @@ of the sidebar position.
### Dividers ### Dividers
Use `Layout--divided` in conjuction with a `Layout-divider` to show a divider between the main content and the sidebar. Use `Layout--divided` in conjunction with a `Layout-divider` to show a divider between the main content and the sidebar.
Flowing as row: Flowing as row:
- default: shows a `1px` line between main and sidebar - default: shows a `1px` line between main and sidebar
- `Layout-divider--flowRow-shallow`: shows a filled `8px` divider. - `Layout-divider--flowRow-shallow`: shows a filled `8px` divider.

View File

@ -426,7 +426,7 @@ A vertical list of filters. Grey text on white background. Selecting a filter fr
`.subnav` is navigation that is typically used when on a dashboard type interface with another set of navigation above it. This helps distinguish navigation hierarchy. `.subnav` is navigation that is typically used when on a dashboard type interface with another set of navigation above it. This helps distinguish navigation hierarchy.
```html live title="subnav" ```html live title="subnav"
<nav class="subnav" aria-label="Respository"> <nav class="subnav" aria-label="Repository">
<a class="subnav-item" href="#url" aria-current="page">Item 1</a> <a class="subnav-item" href="#url" aria-current="page">Item 1</a>
<a class="subnav-item" href="#url">Item 2</a> <a class="subnav-item" href="#url">Item 2</a>
<a class="subnav-item" href="#url">Item 3</a> <a class="subnav-item" href="#url">Item 3</a>

View File

@ -156,7 +156,7 @@ The list of items is arguably the most important subcomponent within the menu. B
Enable live filtering of list items within a `.select-menu-list` with a search input. Only a handful of changes to your menu's markup are required: Enable live filtering of list items within a `.select-menu-list` with a search input. Only a handful of changes to your menu's markup are required:
- Add the text input, housed in `.select-menu-filters`, before the `.select-menu-list`. - Add the text input, housed in `.select-menu-filters`, before the `.select-menu-list`.
- Add two attritubes, `data-filterable-for` and `data-filterable-type`, to the `.select-menu-list` to scope the filter to the list. - Add two attributes, `data-filterable-for` and `data-filterable-type`, to the `.select-menu-list` to scope the filter to the list.
There are no required changes for the `.select-menu-item`s. There are no required changes for the `.select-menu-item`s.

View File

@ -10,7 +10,7 @@ When text reaches lengths larger than existing container, shorten with ellipses.
## Truncate ## Truncate
Adding the `.Truncate` class and wrapping the inner text with `.Truncate-text` will truncate the text. `.Truncate-text` must be a direct decendent of `.Truncate`. Adding the `.Truncate` class and wrapping the inner text with `.Truncate-text` will truncate the text. `.Truncate-text` must be a direct descendant of `.Truncate`.
```html live ```html live
<div class="Box p-2" style="resize: horizontal;overflow: scroll;"> <div class="Box p-2" style="resize: horizontal;overflow: scroll;">

View File

@ -75,7 +75,7 @@ Change the color mode of your OS to see the switch between the `data-light-theme
## Custom color variables ## Custom color variables
It's recommended to use the [functional variables](/support/color-system#functional-variables) as much as possible. It will guarantee that the variables will work as expected with any new theme that might get added in the future. Somtimes you might still need a custom variable that changes based on the color mode. You can create a custom variable with the `color-variables` mixin. It's recommended to use the [functional variables](/support/color-system#functional-variables) as much as possible. It will guarantee that the variables will work as expected with any new theme that might get added in the future. Sometimes you might still need a custom variable that changes based on the color mode. You can create a custom variable with the `color-variables` mixin.
```css ```css
@include color-variables( @include color-variables(