Uploaded image for project: 'XWiki Platform'
  1. XWiki Platform
  2. XWIKI-10094

Integrate Bootstrap front-end framework in platform

    Details

    • Difficulty:
      Unknown
    • Similar issues:

      Description

      I will ask you to help me find the best solution for this integration: http://getbootstrap.com/
      [VOTE] mail at http://markmail.org/thread/wmfmmhdhpsxuth5y

      A. Bootstrap sources

      Bootstrap offers the ability to download:

      • the distribution version (precompiled and minified CSS, JS and fonts) or
      • the source code (LESS files, JS, font, documentation).

      While it might be logical that we need only the distribution, the Junco skin uses the LESS files and if we want also for Flamingo to have any king of mapping we will need the LESS sources. Please consider this when thinking about point B.

      B. Bootstrap location

      Downloading the precompiled version the structure is like this http://getbootstrap.com/getting-started/#whats-included-precompiled
      From this version the minimum we need is:

      bootstrap/
      ├── css/
      │   ├── bootstrap.min.css
      ├── js/
      │   └── bootstrap.min.js
      └── fonts/
          └── glyphicons-halflings-regular.woff
      

      My question is where and how we should better integrate Bootstrap.

      B1. Only in Flamingo skin

      Dependent of Flamingo skin, hard to use in other skins developed by the community

      skins/
      └── flamingo/
      	├── style.css
      	├── css/
      	│   ├── bootstrap.min.css
      	│   ├── flamingo.css
      	├── js/
      	│   └── bootstrap.min.js
      	└── fonts/
      	    └── glyphicons-halflings-regular.woff
      
      B2. In a dedicated Bootstrap folder

      Easier to upgrade Bootstrap
      JS/CSS files are separated by framework, not by type

      resources/
      └── bootstrap/
      	├── css/
      	│   ├── bootstrap.min.css
      	├── js/
      	│   └── bootstrap.min.js
      	└── fonts/
      	    └── glyphicons-halflings-regular.woff
      
      B3. In separated / specialised folders

      Harder to upgrade Bootstrap
      JS/CSS/fonts/Icons files are separated by type

      resources/
      ├── css/
      │	├── bootstrap/
      │	│   ├── bootstrap.min.css
      ├── js/
      │	├── bootstrap/
      │	│   ├── bootstrap.min.js
      └── fonts/
      	└── bootstrap/
      	    └── glyphicons-halflings-regular.woff
      
      B4. Other location ...

        Attachments

          Issue Links

            Activity

              People

              • Assignee:
                gdelhumeau Guillaume Delhumeau
                Reporter:
                evalica Ecaterina Moraru (Valica)
              • Votes:
                0 Vote for this issue
                Watchers:
                4 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:
                  Date of First Response: