mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-20 16:46:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Better spacing between form elements

Browse source 
+ Revert better alignement for checkboxes & radios (#07d19a8)
This commit is contained in:
Lucas 2020-09-25 00:45:44 +07:00
parent 07d19a8673
commit 6f260e9b74
11 changed files with 28 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

8
css/pico.classless.css
View file

@ -831,7 +831,7 @@ fieldset {
label,
fieldset legend {
display: block;
margin-bottom: 0.125rem;
margin-bottom: 0.25rem;
vertical-align: middle;
}
@ -951,7 +951,7 @@ textarea + small {
label > input,
label > select,
label > textarea {
margin-top: 0.125rem;
margin-top: 0.25rem;
}
/**
@ -967,9 +967,9 @@ label > textarea {
width: 1.25rem;
height: 1.25rem;
margin-right: .375rem;
margin-bottom: 0.125rem;
margin-bottom: 0.25rem;
border-width: 2px;
vertical-align: bottom;
vertical-align: middle;
cursor: pointer;
}

2
css/pico.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

8
css/pico.css
View file

@ -1052,7 +1052,7 @@ fieldset {
label,
fieldset legend {
display: block;
margin-bottom: 0.125rem;
margin-bottom: 0.25rem;
vertical-align: middle;
}
@ -1195,7 +1195,7 @@ textarea + small {
label > input,
label > select,
label > textarea {
margin-top: 0.125rem;
margin-top: 0.25rem;
}
/**
@ -1211,9 +1211,9 @@ label > textarea {
width: 1.25rem;
height: 1.25rem;
margin-right: .375rem;
margin-bottom: 0.125rem;
margin-bottom: 0.25rem;
border-width: 2px;
vertical-align: bottom;
vertical-align: middle;
cursor: pointer;
}

8
css/pico.fluid.classless.css
View file

@ -827,7 +827,7 @@ fieldset {
label,
fieldset legend {
display: block;
margin-bottom: 0.125rem;
margin-bottom: 0.25rem;
vertical-align: middle;
}
@ -947,7 +947,7 @@ textarea + small {
label > input,
label > select,
label > textarea {
margin-top: 0.125rem;
margin-top: 0.25rem;
}
/**
@ -963,9 +963,9 @@ label > textarea {
width: 1.25rem;
height: 1.25rem;
margin-right: .375rem;
margin-bottom: 0.125rem;
margin-bottom: 0.25rem;
border-width: 2px;
vertical-align: bottom;
vertical-align: middle;
cursor: pointer;
}

2
css/pico.fluid.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.min.css vendored
View file

File diff suppressed because one or more lines are too long

4
css/pico.slim.css
View file

@ -851,7 +851,7 @@ fieldset {
label,
fieldset legend {
display: block;
margin-bottom: 0.125rem;
margin-bottom: 0.25rem;
vertical-align: middle;
}
@ -970,7 +970,7 @@ textarea + small {
label > input,
label > select,
label > textarea {
margin-top: 0.125rem;
margin-top: 0.25rem;
}
/**

2
css/pico.slim.min.css vendored
View file

File diff suppressed because one or more lines are too long

9
scss/_variables.scss
View file

@ -35,16 +35,19 @@ $enable-transitions: true !default;
// Gutters and horizontals margins
// For <body>, .grid, <nav>, <table>
$spacing-gutter: 1rem !default;
$spacing-gutter: 1rem !default;
// Blocks verticals margins and paddings
// For <header>, <main>, <footer>, <section>, <article>
// This value is proportionally multiplied according breakpoints for great responsive spacings
$spacing-block: 2rem !default;
$spacing-block: 2rem !default;
// Vertical margins for Typography and Form elements
// This value is proportionally multiplied according breakpoints for great responsive spacings
$spacing-typography: 1.5rem !default;
$spacing-typography: 1.5rem !default;
// Spacing between: Label and Input, Checkboxes, Radios
$spacing-form-elements: $spacing-typography/6 !default;
// Padding for <input> and <button>
$spacing-input-button-vertical: .75rem !default;

4
scss/content/_form-checkbox-radio.scss
View file

@ -12,9 +12,9 @@
width: 1.25rem;
height: 1.25rem;
margin-right: .375rem;
margin-bottom: $spacing-label-input;
margin-bottom: $spacing-form-elements;
border-width: 2px;
vertical-align: bottom;
vertical-align: middle;
cursor: pointer;
&::-ms-check {

7
scss/content/_form.scss
View file

@ -129,14 +129,11 @@ fieldset {
border: 0;
}
// Spacing beteen label and input
$spacing-label-input: $spacing-typography/12;
// Label & legend
label,
fieldset legend {
display: block;
margin-bottom: $spacing-label-input;
margin-bottom: $spacing-form-elements;
vertical-align: middle;
}
@ -289,6 +286,6 @@ label {
& > input,
& > select,
& > textarea {
margin-top: $spacing-label-input;
margin-top: $spacing-form-elements;
}
}