Skip to content
This repository has been archived by the owner on Jun 22, 2022. It is now read-only.

Toggles are badly rendered #159

Open
PaulRaUnite opened this issue Jan 5, 2020 · 2 comments
Open

Toggles are badly rendered #159

PaulRaUnite opened this issue Jan 5, 2020 · 2 comments

Comments

@PaulRaUnite
Copy link

Thanks for your hard work with vue-atlas!
Unfortunately, after fix of #156 toggles become broken in topbar context.
(other components are seems to render fine)

Steps to reproduce:

<template>
    <va-app
            bg-color="#F4F5F7"
            page-bg-color="#FFFFFF"
            desktop-margin="0"
            desktop-minimum-width="0"
            desktop-sidebar-width="300"
            desktop-minibar-width="0"
            desktop-topbar-height="50"
            mobile-sidebar-width="0"
            mobile-minibar-width="0"
            mobile-topbar-height="50">
        <va-topbar theme="dark">
            <div slot="left">
                <va-dropdown class="dropdown">
                    <div slot="trigger">
                        <va-button type="darker">
                            Click me
                        </va-button>
                    </div>
                    <ul>
                        <li><va-input/></li>
                        <li><va-file-picker/></li>
                        <li><va-textarea/></li>
                        <li><va-toggle :value="false"/></li>
                        <li><va-badge type="success">Badge</va-badge></li>
                        <li><va-checkbox-btn>cbx btn</va-checkbox-btn></li>
                        <li><va-radio/></li>
                        <li><va-range/></li>
                        <li><va-lozenge type="primary">LOZENGE</va-lozenge></li>
                    </ul>
                </va-dropdown>
            </div>
        </va-topbar>

        <va-page>
            <va-card>
                <va-toggle :value="true"/>
            </va-card>
        </va-page>
    </va-app>
</template>

What is expected?
1

What is actually happening?
2

@websiddu
Copy link

websiddu commented Jan 10, 2020

This happens when a toggle is rendered inside a dropdown. I suspect its because of importing the reset for each component and I don't know if that is an efficient way to do resets.

@nvms
Copy link
Owner

nvms commented Jan 11, 2020

I'm going to do my best to have a fix for this over this weekend. sorry for breaking this! I have to admit that I immediately do not know what's causing this without diving into a project that replicates it. It's easy enough to replicate, though.

@PaulRaUnite the change in #156 should only be affecting elements with input[type=text], which toggle doesn't have. weird!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants