Today, we are going to look at three ways to add a modal dialog to your app. The first option just uses CSS and JavaScript (no special libraries). The second option uses Bootstrap (a topic that I haven’t touched in a few years). The third and final option uses Bulma. I looked back at my …
Continue reading "Three ways to create a modal dialog"
I found myself trying to figure out how to do an interface consisting of a series of cards that slide off to the side as you finish them. Let’s start by looking at the sample app before the addition of the sliding magic.
Continue reading "Sliding transitions, using Vue and Bulma"
Back in July, we looked at how Vue CLI and webpack work and I figured that it was time to look at Vue Router, as a follow-up. Vue Router is going to be pretty necessary for the state parks app, moving forward. Like I did last time, I used VueCLI and Bulma. I also put …
Continue reading "Playing with Vue Router"
At work, I use webpack all the time but it is with laravel. On this blog, I haven’t written much about laravel (something that I eventually want to correct). I do want to address the deficit of webpack content today, though.
Continue reading "Playing with the Vue CLI and Webpack"
One of the goals for JWS.app was for it to pull in activity from a bunch of sources and update itself. That is the reason why I created the “superfeed”. Let’s start by looking at its current state. See the Pen JWS.app – Superfeed (Before) by Joe Steinbring (@steinbring) on CodePen. Getting the content from …
Continue reading "Fixing JWS.app: The “Superfeed” (Part 1)"
I have never been fond of the footer on JWS.app but I’ve been unsure what to use, there. After addressing the elements at the top of the page, it makes sense to turn our attention to the very bottom of the page. Considering how much we have leveraged Bulma so far, it also makes sense …
Continue reading "Fixing JWS.app: Turning our attention to the footer"
Previously, we have looked at the navigation bar, the hero image, and the combination of the two. I figured that next natural step is to look at how to style the content on the page. I want to add some sort of visually pleasing container and Bulma‘s box class seems to be a good option. …
Continue reading "Fixing JWS.app: Styling the content on the page"
Previously, we looked at using Bulma to improve the nav bar and we looked at ways we could improve the hero image. I figured that this week, we would combine the two. See the Pen JWS.app – Hero with Nav by Joe Steinbring (@steinbring) on CodePen. I kind of like this look but the nav …
Continue reading "Fixing JWS.app: What if we merged the nav bar with the hero image?"
Last week, we looked at two ways to fix the nav on JWS.app. For the first option, we simply added an additional header that displays when the screen width gets narrow enough. For the second option, we introduced a hamburger menu. This week, let’s look at two new options. The first of this week’s options …
Continue reading "Fixing JWS.app: The Nav Bar (Part 2)"
Three years ago, I posted something on Bulma while trying to figure out how navigation works with it. After my post on CSS Grid, I figured that I would show how to do a grid-based layout with Bulma. See the Pen Bulma 101: Layout by Joe Steinbring (@steinbring) on CodePen. By default, the column spacing …
Continue reading "Bulma 101: Grid Layout"