Skip to content
This repository was archived by the owner on Sep 25, 2020. It is now read-only.

Added the option to span some lines with CSS grid… #4

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
9 changes: 5 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ module.exports = {


// Specify the button colors you'd like to generate.
//
//
// By default, buttons are generated for all of Tailwind's
// default base colors.
colors: {
Expand All @@ -91,7 +91,7 @@ module.exports = {


// Specify additional button sizes you'd like to generate.
//
//
// You can override any of the default styles from above
// at any given button size.
sizes: {
Expand Down Expand Up @@ -132,7 +132,7 @@ module.exports = {
}
})

return options
return options
}),
],
}
Expand Down Expand Up @@ -181,6 +181,7 @@ The plugin generates the following sets of classes:
- `.grid-columns-{size}`, for specifying the number of columns in the grid
- `.grid-gap-{size}`, for specifying the size of the gap between columns/rows
- `.col-span-{columns}`, for specifying how wide a column should be
- `.col-start-{line}` and `.col-end-{line}`, for specifying a column's start and end points explicitly (useful for reordering columns or leaving gaps)
- `.col-start-{column}` and `.col-end-{column}`, for specifying a column's start and end points explicitly (useful for reordering columns or leaving gaps)
- `.row-span-{lines}`, for specifying how wide a column should be

It's not really practical to expose all of the power of CSS Grid through utilities, but this plugin is a good example of using CSS Grid to replace a column-only float or Flexbox grid.
Loading