mirror/chota
1
0
Fork 0
mirror of https://github.com/jenil/chota.git synced 2023-08-10 21:13:07 +03:00
Code Issues Projects Releases Wiki Activity

Add .grouped.gapless class

Browse Source
This commit is contained in:
yne 2019-09-14 23:55:09 +02:00
parent f05ce0504d
commit 121eb60df0
3 changed files with 29 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
dist/chota.css vendored
View File

@ -524,17 +524,23 @@ button {
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
} }
.grouped > input:not(:last-child), .grouped > *:not(:last-child) {
.grouped > select:not(:last-child),
.grouped > .button:not(:last-child) {
margin-right: 16px; margin-right: 16px;
} }
.grouped.gapless > * {
margin: 0 0 0 -1px !important;
border-radius:0 !important;
}
.grouped.gapless > *:first-child {
margin: 0 !important;
border-radius:4px 0 0 4px !important;
}
.grouped.gapless > *:last-child {
border-radius:0 4px 4px 0 !important;
}
.button + .button { .button + .button {
margin-left: 1rem; margin-left: 1rem;
} }
.buttons > .button + .button {
margin-left: 0;
}
.button:hover, .button:hover,
[type="button"]:hover, [type="button"]:hover,
[type="reset"]:hover, [type="reset"]:hover,
@ -564,6 +570,7 @@ button:disabled:hover {
.button.success, .button.success,
[type="submit"] { [type="submit"] {
color: #fff; color: #fff;
z-index: 1; /* hightlight from other button's border when grouped */
background-color: #000; background-color: #000;
background-color: var(--color-primary); background-color: var(--color-primary);
} }

2
dist/chota.min.css vendored
View File

File diff suppressed because one or more lines are too long

22
src/_form.css
View File

@ -87,20 +87,27 @@ button {
display: flex; display: flex;
} }
.grouped > input:not(:last-child), .grouped > *:not(:last-child) {
.grouped > select:not(:last-child),
.grouped > .button:not(:last-child) {
margin-right: 16px; margin-right: 16px;
} }
.grouped.gapless > * {
margin: 0 0 0 -1px !important;
border-radius:0 !important;
}
.grouped.gapless > *:first-child {
margin: 0 !important;
border-radius:4px 0 0 4px !important;
}
.grouped.gapless > *:last-child {
border-radius:0 4px 4px 0 !important;
}
.button + .button { .button + .button {
margin-left: 1rem; margin-left: 1rem;
} }
.buttons > .button + .button {
margin-left: 0;
}
.button:hover, .button:hover,
[type="button"]:hover, [type="button"]:hover,
[type="reset"]:hover, [type="reset"]:hover,
@ -132,6 +139,7 @@ button:disabled:hover {
.button.success, .button.success,
[type="submit"] { [type="submit"] {
color: #fff; color: #fff;
z-index: 1; /* hightlight from other button's border when grouped */
background-color: #000; background-color: #000;
background-color: var(--color-primary); background-color: var(--color-primary);
} }