Center vues that currently use column centering hack to center like SignUp.vue

[taoeffect]

Problem

Several views use my ugly columns-based centering, e.g.:

    <div class="columns">
      <div class="column is-1"></div>
      <div class="column is-10" >

This is ugly and unnecessary.

Solution

Go through all vues and center the ones that are using columns to SignUp.vue method, e.g. via:

<div class="box centered" style="max-width:400px">

[hubudibu]

using inline styles with a magic number 400px is far from reusable, I would suggest sticking to Bulma's columns for layout and using is-offset classes instead of empty elements, like in CreateGroup.vue:

   <div class="column is-half is-offset-one-quarter" >

what do you think @willstanley ?

[willstanley]

Can we use is-centered https://bulma.io/documentation/columns/options/#centering-columns ?

[taoeffect]

Can we use is-centered https://bulma.io/documentation/columns/options/#centering-columns ?

That seems like an elegant solution to me. I didn't see that before, maybe it's a new feature? Might require upgrading bulma.

Just keep in mind that if it does require upgrading bulma, you'll also need to check the rest of the UI and make sure the new bulma didn't break anything (as upgrading bulma, in our experience, often does break some little thing here or there).

[hubudibu]

neat! it is not a documented feature in our version http://versions.bulma.io/0.4.4/documentation/grid/columns/, but I checked and it seems to work! the following centers the page nicely:

<div class="columns is-centered">
    <div class="column is-half"> 
...

[taoeffect]

I'm guessing this is no longer an open issue.