Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-38081

META: Clashes between CSS names in Bootstrap and Moodle

    XMLWordPrintable

    Details

    • Type: Improvement
    • Status: Closed
    • Priority: Critical
    • Resolution: Done
    • Affects Version/s: 2.5
    • Fix Version/s: None
    • Component/s: Themes
    • Labels:
    • Affected Branches:
      MOODLE_25_STABLE

      Description

      If you import Bootstrap CSS into Moodle then you run into some problems where Moodle and Bootstrap have used the same classname for two different things e.g. Moodle may use .hidden for something that is grayed out, while Bootstrap might use the same classname to make things completely invisible (e.g. for things that are supposed to be only visible for Desktop but not for Mobile).

      In general the Bootstrap names are logical and widely used, whereas the Moodle names are sporadically used e.g. ".label" is used three or four different places in Moodle that are all intended to look and act different. Presumably each chosen by different people at different times for different reasons. In Bootstrap it's used once for one purpose.

      In general then, I would propose removing or renaming the Moodle classes, though this is easier in some cases than in others.

        Attachments

          Issue Links

            Activity

              People

              • Votes:
                1 Vote for this issue
                Watchers:
                6 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Time Tracking

                  Estimated:
                  Original Estimate - 0 minutes
                  0m
                  Remaining:
                  Remaining Estimate - 0 minutes
                  0m
                  Logged:
                  Time Spent - 42 minutes
                  42m