tmayo

Active Member
Hi Russ,

Sorry I have yet another question.

Since going live with XenBase a few users have mentioned that they keep hitting the light/dark style toggle button when they intended to check their notifications.

Is it possible to move the toggle to the right of the search button instead? This would help to prevent any accidental clicks.

Many thanks,
Tim
 
Solution
You'll need to edit PAGE_CONTAINER. I've heard this issue a few times in the past so it might be worth adding an option to show it on the far right.

For now, template: PAGE_CONTAINER

Around lime 343 (depending on your custom code)

Find:
Code:
                    <xf:if is="property('xbStyleSwitch') != '0'">
                        <xf:set var="$StyleSwitchID">{{ property('xbStyleSwitch') }}</xf:set>
                        <a href="{{ link('misc/style', null, { 'style_id': $StyleSwitchID, '_xfRedirect': $redirect, 't': csrf_token() }) }}" class="p-navgroup-link p-navgroup-link--iconic p-navgroup-link--switch" data-xf-init="tooltip" aria-label="{{ property('xbStyleSwitchPhrase') }}" title="{{ property('xbStyleSwitchPhrase') }}">...
You'll need to edit PAGE_CONTAINER. I've heard this issue a few times in the past so it might be worth adding an option to show it on the far right.

For now, template: PAGE_CONTAINER

Around lime 343 (depending on your custom code)

Find:
Code:
                    <xf:if is="property('xbStyleSwitch') != '0'">
                        <xf:set var="$StyleSwitchID">{{ property('xbStyleSwitch') }}</xf:set>
                        <a href="{{ link('misc/style', null, { 'style_id': $StyleSwitchID, '_xfRedirect': $redirect, 't': csrf_token() }) }}" class="p-navgroup-link p-navgroup-link--iconic p-navgroup-link--switch" data-xf-init="tooltip" aria-label="{{ property('xbStyleSwitchPhrase') }}" title="{{ property('xbStyleSwitchPhrase') }}">
                            <i aria-hidden="true"></i>
                        </a>
                    </xf:if>

Wrap it with xf:comments like so:
Code:
                    <xf:comment>
                    <xf:if is="property('xbStyleSwitch') != '0'">
                        <xf:set var="$StyleSwitchID">{{ property('xbStyleSwitch') }}</xf:set>
                        <a href="{{ link('misc/style', null, { 'style_id': $StyleSwitchID, '_xfRedirect': $redirect, 't': csrf_token() }) }}" class="p-navgroup-link p-navgroup-link--iconic p-navgroup-link--switch" data-xf-init="tooltip" aria-label="{{ property('xbStyleSwitchPhrase') }}" title="{{ property('xbStyleSwitchPhrase') }}">
                            <i aria-hidden="true"></i>
                        </a>
                    </xf:if>
                    </xf:comment>

Then go down to line 446. You'll see:
Code:
                                <xf:csrf />
                            </form>
                        </div>
                    </xf:if>
                </div>
            </div>
            </xf:macro>

Insert it right after the </xfif> like so:

Code:
                                <xf:csrf />
                            </form>
                        </div>
                    </xf:if>
                    <xf:if is="property('xbStyleSwitch') != '0'">
                        <xf:set var="$StyleSwitchID">{{ property('xbStyleSwitch') }}</xf:set>
                        <a href="{{ link('misc/style', null, { 'style_id': $StyleSwitchID, '_xfRedirect': $redirect, 't': csrf_token() }) }}" class="p-navgroup-link p-navgroup-link--iconic p-navgroup-link--switch" data-xf-init="tooltip" aria-label="{{ property('xbStyleSwitchPhrase') }}" title="{{ property('xbStyleSwitchPhrase') }}">
                            <i aria-hidden="true"></i>
                        </a>
                    </xf:if>
                </div>
            </div>
            </xf:macro>
 
Solution

Pre-Sale Questions

If you have any questions or concerns you want to ask before you make a purchase don't hesitate to use one of our multiple support channels for your convenience.

Back