Skip to content
Grav 2.0 is officially stable. Read the announcement →
Archive

Is there a built in offset class for the nucleus framework in Antimatter?

Started by Muut Archive 10 years ago · 3 replies · 458 views
10 years ago

I've been able to get around it by entering an empty grid item, but it seems like a hack to enter empty space to push over other grid items. The idea is to use the middle four grid items so the data is centered (in a 12 column setup.)

This works, is it the right way to go?

<div class="grid">
<div class="size-1-4"></div>
<div class="size-1-8>A</div>
<div class="size-1-8>B</div>
<div class="size-1-8>C</div>
<div class="size-1-8>D</div>
</div>

The output accomplishes what I'm trying for but I'm wondering if it's the right way to go about it. I'm used to bootstrap which has convenient "offset" classes for grid columns.

Related, how do I get two columns in the mobile breakpoint instead everything in the grid dropping to one column?

10 years ago

In lieu of an explicit class for offset, empty grids are perfectly acceptable. Even in Bootstrap, the offset-classes can be a hassle (especially between v3 and v4), and other than a tiny superfluous piece of HTML there is no difference between using them or not.

Unless you declare extra attributes to the empty columns, such as for ARIA or screenreaders, then it will never be a nuisance to anyone, and semantically it is more declarative than the offset ("These five lego blocks form the structure", rather than "these four lego blocks and the empty space at the end form the structure").

I'm not familiar enough Nucleus in regards to mobile breakpoints, but I would assume that setting a higher-level breakpoint for the columns would cause the folding to fial on lower-level breakpoints.

10 years ago

I'm actually thinking of developing a new default theme that will have more useful utility classes and it would be much better documented. I already have ported the lovely Spectre.css CSS framework to SCSS. Now I just need to covert antimatter (or something similar) to use it.

10 years ago

Sounds interesting, I'd be curious to see what you come up with. I'd be happy to mess with it as soon as you're ready for testing.

Suggested topics

Topic Participants Replies Views Activity
Archive · by Deleted User, 9 years ago
0 1349 9 years ago
Archive · by Muut Archive, 9 years ago
2 934 9 years ago
Archive · by Muut Archive, 9 years ago
2 4060 9 years ago
Archive · by Muut Archive, 9 years ago
1 2946 9 years ago
Archive · by Muut Archive, 9 years ago
3 1118 9 years ago