Forum Discussion

iftomkins's avatar
11 years ago

Remove the word "version" from the mobile/desktop toggle

How can I remove the word "version" from the mobile/desktop toggle?

  • I found a solution, though it's not pretty. Lithium contacts have told me that in future versions they will make the code from components like the mobile toggle available so we can easily tweak them.

     

    Run on page load:

     

         //Remove text from mobile-desktop toggle, so div can be centered. outerHTML() function from CSS-tricks.com (http://css-tricks.com/snippets/jquery/outerhtml-jquery-plugin/)
         $.fn.outerHTML = function(){
            // IE, Chrome & Safari will comply with the non-standard outerHTML, all others (FF) will have a fall-back for cloning
            return (!this.length) ? this : (this[0].outerHTML || (
              function(el){
                  var div = document.createElement('div');
                  div.appendChild(el.cloneNode(true));
                  var contents = div.innerHTML;
                  div = null;
                  return contents;
            })(this[0]));
            }
            var switchMobile = $("body#lia-body .lia-content .lia-quilt-row-footer .lia-device-view-links .lia-component-users-action-switch-to-mobile-view").outerHTML();
            var switchDesktop = $("body#lia-body .lia-content .lia-quilt-row-footer .lia-device-view-links .lia-component-users-action-switch-to-desktop-view").outerHTML();
            $("body#lia-body .lia-content .lia-quilt-row-footer .lia-device-view-links").html(switchMobile + switchDesktop);

  • ChiaraS's avatar
    ChiaraS
    11 years ago

    Hi, it should be enough to adjust the text key for that (Studio -> Text Editor):

     

    mobile.DeviceView.format = {0} | {1}

  • I found a solution, though it's not pretty. Lithium contacts have told me that in future versions they will make the code from components like the mobile toggle available so we can easily tweak them.

     

    Run on page load:

     

         //Remove text from mobile-desktop toggle, so div can be centered. outerHTML() function from CSS-tricks.com (http://css-tricks.com/snippets/jquery/outerhtml-jquery-plugin/)
         $.fn.outerHTML = function(){
            // IE, Chrome & Safari will comply with the non-standard outerHTML, all others (FF) will have a fall-back for cloning
            return (!this.length) ? this : (this[0].outerHTML || (
              function(el){
                  var div = document.createElement('div');
                  div.appendChild(el.cloneNode(true));
                  var contents = div.innerHTML;
                  div = null;
                  return contents;
            })(this[0]));
            }
            var switchMobile = $("body#lia-body .lia-content .lia-quilt-row-footer .lia-device-view-links .lia-component-users-action-switch-to-mobile-view").outerHTML();
            var switchDesktop = $("body#lia-body .lia-content .lia-quilt-row-footer .lia-device-view-links .lia-component-users-action-switch-to-desktop-view").outerHTML();
            $("body#lia-body .lia-content .lia-quilt-row-footer .lia-device-view-links").html(switchMobile + switchDesktop);

    • ChiaraS's avatar
      ChiaraS
      Lithium Alumni (Retired)

      Hi, it should be enough to adjust the text key for that (Studio -> Text Editor):

       

      mobile.DeviceView.format = {0} | {1}