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

in sass @extend .btn generates a lot of CSS

XMLWordPrintable

    • MOODLE_32_STABLE

      There's a few of uses of "@extend .btn" to override the styles and make something look like a standard Bootstrap button.

      Particularly in this file:

      scss/moodle/grade.scss
      67:            @extend .btn;
      187:                        @extend .btn;
      198:            @extend .btn;

       

      This is fine except the .btn class gets used a lot in Bootstrap, for btns and big buttons and small buttons and buttons inside button groups and so on. And every time it's used, three extra lines of CSS get inserted for the three uses in the grading area, even though they'll probably never be used in those contexts.

      A better solution, which would remove possibly hundreds of lines of CSS, would be to amend the renderer for the grades to output the appropriate ".btn" class in the HTML, so that the standard Bootstrap CSS can style it and delete these extendsions from the Boost theme.

      Other uses of @extend might be worth looking at too, if the target selector is used repeatedly.

            Unassigned Unassigned
            bawjaws David Scotson
            Votes:
            0 Vote for this issue
            Watchers:
            4 Start watching this issue

              Created:
              Updated:
              Resolved:

                Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.