mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
Fix button, input, and select line-height
This commit is contained in:
parent
718bbdbfd0
commit
d2d9515dfa
@ -583,10 +583,10 @@ a.box:active {
|
|||||||
height: 2.25em;
|
height: 2.25em;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
padding-bottom: 0.375em;
|
padding-bottom: 0.425em;
|
||||||
padding-left: 0.625em;
|
padding-left: 0.625em;
|
||||||
padding-right: 0.625em;
|
padding-right: 0.625em;
|
||||||
padding-top: 0.375em;
|
padding-top: 0.325em;
|
||||||
position: relative;
|
position: relative;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
-webkit-touch-callout: none;
|
-webkit-touch-callout: none;
|
||||||
@ -1297,6 +1297,10 @@ a.box:active {
|
|||||||
position: absolute !important;
|
position: absolute !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
button.button {
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
color: #4a4a4a;
|
color: #4a4a4a;
|
||||||
}
|
}
|
||||||
@ -1462,10 +1466,10 @@ a.box:active {
|
|||||||
height: 2.25em;
|
height: 2.25em;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
padding-bottom: 0.375em;
|
padding-bottom: 0.425em;
|
||||||
padding-left: 0.625em;
|
padding-left: 0.625em;
|
||||||
padding-right: 0.625em;
|
padding-right: 0.625em;
|
||||||
padding-top: 0.375em;
|
padding-top: 0.325em;
|
||||||
position: relative;
|
position: relative;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
@ -1699,10 +1703,10 @@ a.box:active {
|
|||||||
height: 2.25em;
|
height: 2.25em;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
padding-bottom: 0.375em;
|
padding-bottom: 0.425em;
|
||||||
padding-left: 0.625em;
|
padding-left: 0.625em;
|
||||||
padding-right: 0.625em;
|
padding-right: 0.625em;
|
||||||
padding-top: 0.375em;
|
padding-top: 0.325em;
|
||||||
position: relative;
|
position: relative;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
@ -1839,6 +1843,11 @@ a.box:active {
|
|||||||
color: #ff3860;
|
color: #ff3860;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
input[type="submit"].input,
|
||||||
|
.select select {
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.field:not(:last-child) {
|
.field:not(:last-child) {
|
||||||
margin-bottom: 0.75rem;
|
margin-bottom: 0.75rem;
|
||||||
}
|
}
|
||||||
@ -1957,9 +1966,11 @@ a.box:active {
|
|||||||
flex-shrink: 1;
|
flex-shrink: 1;
|
||||||
}
|
}
|
||||||
.field-body .field {
|
.field-body .field {
|
||||||
flex-grow: 1;
|
|
||||||
flex-shrink: 1;
|
flex-shrink: 1;
|
||||||
}
|
}
|
||||||
|
.field-body .field:not(.is-narrow) {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
.field-body .field:not(:last-child) {
|
.field-body .field:not(:last-child) {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
margin-right: 0.75rem;
|
margin-right: 0.75rem;
|
||||||
@ -1967,6 +1978,7 @@ a.box:active {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.control {
|
.control {
|
||||||
|
font-size: 1rem;
|
||||||
position: relative;
|
position: relative;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
@ -3635,10 +3647,10 @@ a.nav-item.is-tab.is-active {
|
|||||||
height: 2.25em;
|
height: 2.25em;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
padding-bottom: 0.375em;
|
padding-bottom: 0.425em;
|
||||||
padding-left: 0.625em;
|
padding-left: 0.625em;
|
||||||
padding-right: 0.625em;
|
padding-right: 0.625em;
|
||||||
padding-top: 0.375em;
|
padding-top: 0.325em;
|
||||||
position: relative;
|
position: relative;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
-webkit-touch-callout: none;
|
-webkit-touch-callout: none;
|
||||||
|
@ -759,13 +759,32 @@ doc-subtab: form
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<p class="control is-expanded has-icon">
|
<p class="control is-expanded has-icon has-icon-right">
|
||||||
<input class="input is-success" type="email" placeholder="Email" value="alex@smith.com">
|
<input class="input is-success" type="email" placeholder="Email" value="alex@smith.com">
|
||||||
<span class="icon is-small">
|
<span class="icon is-small">
|
||||||
<i class="fa fa-check"></i>
|
<i class="fa fa-check"></i>
|
||||||
</span>
|
</span>
|
||||||
</p>
|
</p>
|
||||||
<p class="help is-success">This username is available</p>
|
<p class="help is-success">This email is correct</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="field is-horizontal">
|
||||||
|
<div class="field-label">
|
||||||
|
<label class="label">Department</label>
|
||||||
|
</div>
|
||||||
|
<div class="field-body">
|
||||||
|
<div class="field is-narrow">
|
||||||
|
<div class="control">
|
||||||
|
<div class="select is-fullwidth">
|
||||||
|
<select>
|
||||||
|
<option>Business development</option>
|
||||||
|
<option>Marketing</option>
|
||||||
|
<option>Sales</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -777,12 +796,11 @@ doc-subtab: form
|
|||||||
<div class="field-body">
|
<div class="field-body">
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<div class="control">
|
<div class="control">
|
||||||
<div class="select is-fullwidth">
|
<input class="input is-danger" type="text" placeholder="e.g. Partnership opportunity">
|
||||||
<select>
|
|
||||||
<option>General enquiry</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<p class="help is-danger">
|
||||||
|
This field is required
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -153,3 +153,6 @@ $button-shadow-inset: inset 0 1px 2px rgba($black, 0.2) !default
|
|||||||
+loader
|
+loader
|
||||||
+center(1em)
|
+center(1em)
|
||||||
position: absolute !important
|
position: absolute !important
|
||||||
|
|
||||||
|
button.button
|
||||||
|
line-height: 1
|
||||||
|
@ -158,6 +158,10 @@ $input-radius: $radius !default
|
|||||||
&.is-#{$name}
|
&.is-#{$name}
|
||||||
color: $color
|
color: $color
|
||||||
|
|
||||||
|
input[type="submit"].input,
|
||||||
|
.select select
|
||||||
|
line-height: 1
|
||||||
|
|
||||||
// Containers
|
// Containers
|
||||||
|
|
||||||
.field
|
.field
|
||||||
@ -254,13 +258,15 @@ $input-radius: $radius !default
|
|||||||
flex-grow: 5
|
flex-grow: 5
|
||||||
flex-shrink: 1
|
flex-shrink: 1
|
||||||
.field
|
.field
|
||||||
flex-grow: 1
|
|
||||||
flex-shrink: 1
|
flex-shrink: 1
|
||||||
|
&:not(.is-narrow)
|
||||||
|
flex-grow: 1
|
||||||
&:not(:last-child)
|
&:not(:last-child)
|
||||||
margin-bottom: 0
|
margin-bottom: 0
|
||||||
margin-right: 0.75rem
|
margin-right: 0.75rem
|
||||||
|
|
||||||
.control
|
.control
|
||||||
|
font-size: $size-normal
|
||||||
position: relative
|
position: relative
|
||||||
text-align: left
|
text-align: left
|
||||||
// Modifiers
|
// Modifiers
|
||||||
|
@ -13,10 +13,10 @@ $control-radius-small: $radius-small !default
|
|||||||
height: 2.25em
|
height: 2.25em
|
||||||
justify-content: flex-start
|
justify-content: flex-start
|
||||||
line-height: 1.5
|
line-height: 1.5
|
||||||
padding-bottom: 0.375em
|
padding-bottom: 0.425em
|
||||||
padding-left: 0.625em
|
padding-left: 0.625em
|
||||||
padding-right: 0.625em
|
padding-right: 0.625em
|
||||||
padding-top: 0.375em
|
padding-top: 0.325em
|
||||||
position: relative
|
position: relative
|
||||||
vertical-align: top
|
vertical-align: top
|
||||||
// States
|
// States
|
||||||
|
Loading…
Reference in New Issue
Block a user