YellowGrass

Upgrade to bootstrap 3.0

Let’s upgrade to bootstrap 3.0.2 with improved support for responsive design (responsive by default) and using a mobile-first approach.
See bootstrap 3 grids explained

Migration notes:

  • Note that classes grid-fluid and row-fluid are dropped.
  • Furthermore the classes spanXX are replaced by a range of new col-SS-XX classes where SS denotes the target-device, and XX the number of columns.
  • btn classes now require a button-style class, e.g., class="btn btn-default" for the default button
    • I’ve constructed a regex for replacing existing btn-classes that miss the button-style class. Eclipse replace on *.app files:
      Containing text (case sensitive, regular expressions):
      "btn((\s+[^"]*(?<!.{0,30}btn-(default|primary|success|info|warning|danger|link).{0,30}))?")
      click Replace… and use this as replacement:
      "btn btn-default$1
      Be sure to check the changes in the Preview window.
  • alert-error -> alert-danger
  • btn-error -> btn-danger
  • To get bootstrap-style input fields on webdsl built-in input templates without adding form-control class to each input, add this to the input style:
input {
  padding: 2px 12px;
  font-size: 14px;
  line-height: 1.428571429;
  color: #555555;
  vertical-align: middle;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #cccccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

Elib changes

E-Lib TODOs:

E-Lib DONES:

  • isolate into own repo elib-bootrap3
  • upgrade icons to glyphicons
  • Fix btn classes
  • navbar style-classes
  • add gridCol templates and let gridSpan use these new templates
Submitted by Elmer van Chastelet on 17 November 2013 at 15:24

Issue Log

On 17 November 2013 at 15:42 Eelco Visser removed tag @eelcovisser
On 17 November 2013 at 15:48 Eelco Visser commented:

I think we should factor out the bootstrap library from elib. Also we should make keep the current version of elib-bootstrap. So we would get:

  • elib-legacy: the current version of elib with boostrap 2 included
  • elib-utils: the WebDSL utility functions
  • elib-bootstrap2: the current version of the bootstrap library
  • elib-bootstrap3: the new bootstrap library

That will make it easier to migrate individual projects and maintain them until the migration is done. This will also make it easier to combine the utilities with another UI library.

On 17 November 2013 at 16:10 Eelco Visser commented:

Bootstrap 3 looks good. Would be nice if we can keep the elib abstractions unchanged where possible, just changing the template definitions.

On 17 November 2013 at 16:12 Elmer van Chastelet commented:

I’ll start with creating a new repo elib-bootstrap3 when I’m finished. We can then break up the current elib into elib-utils and elib-bootstrap2 and rename elib to elib-legacy

On 18 November 2013 at 12:31 Elmer van Chastelet closed this issue.
On 18 November 2013 at 12:51 Danny Groenewegen commented:

At some point we should integrate general utilities back into the standard library to avoid fragmentation, that way they will also be precompiled.

On 18 November 2013 at 12:53 Elmer van Chastelet commented:

Changed it to keep bootstrap versions in a single repo. V2 can be found in branch.

Log in to post comments