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

action_menu: selector, RTL, consistency fixes

    XMLWordPrintable

    Details

    • Type: Bug
    • Status: Closed
    • Priority: Minor
    • Resolution: Fixed
    • Affects Version/s: 2.6.5, 2.7.2, 2.8
    • Fix Version/s: 2.6.6, 2.7.3, 2.8
    • Component/s: HTML and CSS
    • Labels:
    • Testing Instructions:
      Hide

      On Base and Bootstrapbase, on both English (LTR) and Hebrew (RTL):

      1. Add the following code, building an action_menu, to a theme layout file.

            $am = new action_menu();
            $am->initialise_js($PAGE);
            $am->set_menu_trigger("trigger");
            $am->set_alignment(action_menu::TR, action_menu::BR);
         
            $items = array(
                'apples',
                'bananas',
                'cucumbers'
            );
            foreach ($items as $value) {
                $al = new action_menu_link_secondary(
                    new moodle_url('http://www.google.com/'),
                    new pix_icon('a/setting', $value),
                    $value
                );
                $am->add($al);
            }
         
            echo html_writer::tag(
                'div',
                $OUTPUT->render($am),
                array('style' => 'position:relative; display:inline-block; width: 120px;')
            );
        

        • Verify that the action menu looks good (i.e. no icons out of place).
      2. Create a course, then navigate to its index and turn editing on.
        • Verify that the activity editing dropdowns look good (and that a piece of extraneous padding on RTL is gone).
        • Verify that the block editing dropdowns also look good.
      3. Go to the course and category management page (/course/management.php)
        • Verify that the course category editing dropdown looks good.
        • Verify that the icons outside of the dropdowns (i.e. the horizontal lists) still look good.
      4. Open the user menu.
        • Verify that it looks good and not out of place.
      Show
      On Base and Bootstrapbase, on both English (LTR) and Hebrew (RTL): Add the following code, building an action_menu, to a theme layout file. $am = new action_menu(); $am->initialise_js($PAGE); $am->set_menu_trigger("trigger"); $am->set_alignment(action_menu::TR, action_menu::BR);   $items = array( 'apples', 'bananas', 'cucumbers' ); foreach ($items as $value) { $al = new action_menu_link_secondary( new moodle_url('http://www.google.com/'), new pix_icon('a/setting', $value), $value ); $am->add($al); }   echo html_writer::tag( 'div', $OUTPUT->render($am), array('style' => 'position:relative; display:inline-block; width: 120px;') ); Verify that the action menu looks good (i.e. no icons out of place). Create a course, then navigate to its index and turn editing on. Verify that the activity editing dropdowns look good (and that a piece of extraneous padding on RTL is gone). Verify that the block editing dropdowns also look good. Go to the course and category management page ( /course/management.php ) Verify that the course category editing dropdown looks good. Verify that the icons outside of the dropdowns (i.e. the horizontal lists) still look good. Open the user menu. Verify that it looks good and not out of place.
    • Affected Branches:
      MOODLE_26_STABLE, MOODLE_27_STABLE, MOODLE_28_STABLE
    • Fixed Branches:
      MOODLE_26_STABLE, MOODLE_27_STABLE, MOODLE_28_STABLE
    • Pull from Repository:
    • Pull Master Branch:
      MDL-47340-master

      Description

      action_menu exhibits poor alignment under Base and Bootstrapbase, particularly under RTL languages. On both themes, the indentation applied to allow for icon placement is only correct for LTR languages; on Bootstrapbase, a CSS selector is actually incorrect (.iconsmall instead of .smallicon).

      This will fix styling issues with MDL-45893.

        Attachments

        1. beforeafterltr.png
          beforeafterltr.png
          13 kB
        2. beforeafterrtl.png
          beforeafterrtl.png
          16 kB
        3. limited1.png
          limited1.png
          7 kB
        4. limited2.png
          limited2.png
          6 kB
        5. login1.png
          login1.png
          2 kB
        6. login2.png
          login2.png
          2 kB

          Issue Links

            Activity

              People

              • Assignee:
                jethac Jetha Chan
                Reporter:
                jethac Jetha Chan
                Peer reviewer:
                Sam Hemelryk
                Integrator:
                Marina Glancy
                Tester:
                Marina Glancy
                Participants:
                Component watchers:
                Amy Groshek, David Scotson, Amaia Anabitarte, Bas Brands, Carlos Escobedo, Sara Arjona (@sarjona), Víctor Déniz Falcón
              • Votes:
                0 Vote for this issue
                Watchers:
                5 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:
                  Fix Release Date:
                  10/Nov/14