Browse Source

Fixes #1515 issue with ui action input with ui with icon variation

pull/1550/head
jlukic 10 years ago
parent
commit
3276cf1f9f
1 changed files with 15 additions and 14 deletions
  1. 29
      src/definitions/elements/input.less

29
src/definitions/elements/input.less

@ -87,7 +87,7 @@
Loading Loading
---------------------*/ ---------------------*/
.ui.loading.loading.input > .icon:before {
.ui.loading.loading.input > i.icon:before {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
@ -100,7 +100,7 @@
border-radius: @circularRadius; border-radius: @circularRadius;
border: @loaderLineWidth solid @loaderFillColor; border: @loaderLineWidth solid @loaderFillColor;
} }
.ui.loading.loading.input > .icon:after {
.ui.loading.loading.input > i.icon:after {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
@ -186,7 +186,7 @@
} }
/* Transparent Icon */ /* Transparent Icon */
.ui.transparent.icon.input > .icon {
.ui.transparent.icon.input > i.icon {
width: @transparentIconWidth; width: @transparentIconWidth;
} }
.ui.transparent.icon.input > input { .ui.transparent.icon.input > input {
@ -214,7 +214,7 @@
Icon Icon
---------------------*/ ---------------------*/
.ui.icon.input > .icon {
.ui.icon.input > i.icon {
cursor: default; cursor: default;
position: absolute; position: absolute;
text-align: center; text-align: center;
@ -228,8 +228,12 @@
border-radius: 0em @borderRadius @borderRadius 0em; border-radius: 0em @borderRadius @borderRadius 0em;
transition: @iconTransition; transition: @iconTransition;
} }
.ui.icon.input > .icon:before,
.ui.icon.input > .icon:after {
.ui.icon.input input {
padding-right: @iconMargin !important;
}
.ui.icon.input > i.icon:before,
.ui.icon.input > i.icon:after {
left: 0; left: 0;
position: absolute; position: absolute;
text-align: center; text-align: center;
@ -237,24 +241,21 @@
width: 100%; width: 100%;
margin-top: @iconOffset; margin-top: @iconOffset;
} }
.ui.icon.input > .link.icon {
.ui.icon.input > i.link.icon {
cursor: pointer; cursor: pointer;
} }
.ui.icon.input input {
padding-right: @iconMargin !important;
}
.ui.icon.input > .circular.icon {
.ui.icon.input > i.circular.icon {
top: @circularIconVerticalOffset; top: @circularIconVerticalOffset;
right: @circularIconHorizontalOffset; right: @circularIconHorizontalOffset;
} }
/* Left Icon Input */ /* Left Icon Input */
.ui[class*="left icon"].input > .icon {
.ui[class*="left icon"].input > i.icon {
right: auto; right: auto;
left: @borderWidth; left: @borderWidth;
border-radius: @borderRadius 0em 0em @borderRadius; border-radius: @borderRadius 0em 0em @borderRadius;
} }
.ui[class*="left icon"].input > .circular.icon {
.ui[class*="left icon"].input > i.circular.icon {
right: auto; right: auto;
left: @circularIconHorizontalOffset; left: @circularIconHorizontalOffset;
} }
@ -264,7 +265,7 @@
} }
/* Focus */ /* Focus */
.ui.icon.input > input:focus ~ .icon {
.ui.icon.input > input:focus ~ i.icon {
opacity: 1; opacity: 1;
} }

Loading…
Cancel
Save