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

[Form] Support inverted transparent textarea #161

Merged
merged 5 commits into from
Oct 12, 2018

Conversation

lubber-de
Copy link
Member

Description

Support for transparent textarea in an inverted segment or form (only the color needed to be changed)

Related to

#158

@lubber-de lubber-de changed the title Support inverted transparent textarea [Form] Support inverted transparent textarea Oct 8, 2018
@ColinFrick ColinFrick added type/feat Any feature requests or improvements lang/css Anything involving CSS labels Oct 8, 2018
@y0hami y0hami added the state/awaiting-reviews Pull requests which are waiting for reviews label Oct 8, 2018
.ui.form .inverted.segment textarea.transparent {
color: inherit;
}

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why so much whitespace?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I simply adjusted the logic the same as it is for input.

... or maybe i don't get, what you mean? 🤔

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if you simply mean the additional empty lines...then i am simply sorry for that, there was no reason for sure

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What he probably meant is that you added two empty lines before the selector and four lines after.
Additionally couldn't this be added to this:

/*--------------------
Transparent
---------------------*/
.ui.form .field textarea.transparent {
border-color: transparent !important;
background-color: transparent !important;
padding: 0em !important;
box-shadow: none !important;
border-radius: 0px !important;
}

or to the inverted variation section?
/*--------------------
Inverted Colors
---------------------*/
.ui.inverted.form label,
.ui.form .inverted.segment label,
.ui.form .inverted.segment .ui.checkbox label,
.ui.form .inverted.segment .ui.checkbox .box,
.ui.inverted.form .ui.checkbox label,
.ui.inverted.form .ui.checkbox .box,
.ui.inverted.form .inline.fields > label,
.ui.inverted.form .inline.fields .field > label,
.ui.inverted.form .inline.fields .field > p,
.ui.inverted.form .inline.field > label,
.ui.inverted.form .inline.field > p {
color: @invertedLabelColor;
}
/* Inverted Field */
.ui.inverted.form input:not([type]),
.ui.inverted.form input[type="date"],
.ui.inverted.form input[type="datetime-local"],
.ui.inverted.form input[type="email"],
.ui.inverted.form input[type="number"],
.ui.inverted.form input[type="password"],
.ui.inverted.form input[type="search"],
.ui.inverted.form input[type="tel"],
.ui.inverted.form input[type="time"],
.ui.inverted.form input[type="text"],
.ui.inverted.form input[type="file"],
.ui.inverted.form input[type="url"] {
background: @invertedInputBackground;
border-color: @invertedInputBorderColor;
color: @invertedInputColor;
box-shadow: @invertedInputBoxShadow;
}

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You have 4 blank lines of whitespace added and there isn't any need for it

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ok, got it now working in the suggested transparent section also. see latest commit. Sorry for any inconvenience 😉

Copy link
Member Author

@lubber-de lubber-de left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

removed whitespace line now by another commit. 😉

.ui.form .inverted.segment textarea.transparent {
color: inherit;
}

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if you simply mean the additional empty lines...then i am simply sorry for that, there was no reason for sure

@y0hami
Copy link
Member

y0hami commented Oct 8, 2018

I agree with @ColinFrick you can probably achieve this without making another textarea definition.

@lubber-de
Copy link
Member Author

@ColinFrick Thanks, i moved it to a more suitable area, taking care of no extra whitespace now, within the less file as suggested. I'll take care of such things in the future! 😊

Copy link
Member

@y0hami y0hami left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, I am going to wait until #107 is fixed before merging.

Copy link
Contributor

@prudho prudho left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, but i think that we should squash commits into one, since the purpose of this PR is pretty clear.

Copy link
Member

@ColinFrick ColinFrick left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I agree with @prudho
If we ever want to go over to conventional commit messages / automatic release notes, that‘s a requirement anyway.

@ColinFrick ColinFrick added this to the 2.6.3 milestone Oct 12, 2018
@y0hami y0hami removed the state/awaiting-reviews Pull requests which are waiting for reviews label Oct 12, 2018
@y0hami y0hami merged commit 1463398 into fomantic:beta Oct 12, 2018
@lubber-de lubber-de deleted the inverted_transparent_textarea branch October 12, 2018 10:11
@y0hami y0hami mentioned this pull request Oct 17, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
lang/css Anything involving CSS type/feat Any feature requests or improvements
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants