CSS Helper Classes

Michael BourneUpdated:


X Theme comes with dozens of preset CSS classes that are sure to speed up your development. Have a look through to see how they work. The structure is set as follows: [table id=2 /] The structure is set as follows: [table id=1 /] Font weight classes are great for adding quick and easy variation toy our website’s text. Important to note that not all fonts have all the variations. [table id=3 /] Sometime you will need to hide elements from specific screen sizes. And although some elements have built … Read More

Flexbox Flip Card Grid

Michael BourneUpdated:


A few weeks back, an X user was asking about making his flip card grip responsive, as well as clearing up issues with text size forcing the flip cards to extend past their parent container. I took his layout and made it into a flexbox, allowing for full fluidity and responsiveness. The setup on this one is quite simple. Create a new section containing a single row and column, and give that column the custom class flexcards. Inside this column, place as many flip card elements as you need. The … Read More

Responsive Cornerstone Timeline

Michael BourneUpdated:


Time and time again I see X users asking about creating a timeline in Cornerstone. Truthfully, there are plenty of free and premium plugins that can do this. But what about users that prefer to not use a plugin? Well, how about a simple, clean, and responsive timeline using only Cornerstone and CSS. That’s what I have made here. Your first step is to create a new section in Cornerstone. For each row, split into two columns and disable marginless columns in the row settings. The setup is simple: in … Read More