Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Responsive label missing offset properties #723

Open
ggam opened this issue Apr 23, 2017 · 0 comments
Open

Responsive label missing offset properties #723

ggam opened this issue Apr 23, 2017 · 0 comments
Assignees
Milestone

Comments

@ggam
Copy link
Collaborator

ggam commented Apr 23, 2017

Have a look at this example:

                <b:form horizontal="true">
                        <b:inputTextarea rows="3" placeholder="Username" required="true" label="E-mail:" renderLabel="true" offsetXs="2" labelColXs="2" colXs="6">
                            <f:facet name="prepend">
                                <b:icon name="user" />
                            </f:facet>
                        </b:inputTextarea>

                        <b:inputTextarea rows="3" placeholder="Password" label="Password:" renderLabel="true" offsetXs="2" labelColXs="2" colXs="6">
                            <f:facet name="prepend">
                                <b:iconAwesome name="key" />
                            </f:facet>
                        </b:inputTextarea>
                    </b:form>

What I want is to put an offset of 2 at the begining, and 2 more columns at the end.

The result is the following:

captura de pantalla de 2017-04-23 11-26-13

Adding more classes there seems overkill, but the workaround for now is a bit verbose:

<b:form horizontal="true">
                        <b:row>
                            <b:column offsetXs="2" colXs="8">
                                <b:inputTextarea rows="3" placeholder="Username" required="true" label="E-mail:" renderLabel="true" labelColXs="2" colXs="10">
                                    <f:facet name="prepend">
                                        <b:icon name="user" />
                                    </f:facet>
                                </b:inputTextarea>
                            </b:column>
                        </b:row>

                        <b:row>
                            <b:column offsetXs="2" colXs="8">
                                <b:inputTextarea rows="3" placeholder="Password" label="Password:" renderLabel="true" labelColXs="2" colXs="10">
                                    <f:facet name="prepend">
                                        <b:iconAwesome name="key" />
                                    </f:facet>
                                </b:inputTextarea>
                            </b:column>
                        </b:row>
                    </b:form>

I think a better solution should be researched.

@geopossachs geopossachs self-assigned this Sep 19, 2019
@geopossachs geopossachs added this to the v1.5.0 milestone May 2, 2020
@TheCoder4eu TheCoder4eu modified the milestones: v1.5.0, v1.6.0 Aug 8, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants