weiai/BootstrapBlazor
1
0
Fork 0
mirror of https://github.com/dotnetcore/BootstrapBlazor.git synced 2025-12-20 10:26:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(CheckboxList): update CSS file (#2159)

Browse Source 
* refactor: 更新 Checkbox 样式

* chore: bump version 7.10.8-beta06

* test: 更新单元测试
This commit is contained in:
Argo Zhang
2023-09-19 18:30:43 +08:00
committed by GitHub
parent 5d8bc4b24c
commit 822c11602a
7 changed files with 63 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/BootstrapBlazor/BootstrapBlazor.csproj
View File

@@ -1,7 +1,7 @@
<Project Sdk="Microsoft.NET.Sdk.Razor">
<PropertyGroup>
<Version>7.10.8-beta05</Version>
<Version>7.10.8-beta06</Version>
</PropertyGroup>
<ItemGroup Condition="'$(TargetFramework)' == 'net5.0'">

84
src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor.scss
View File

@@ -1,4 +1,4 @@
.checkbox-list {
.checkbox-list {
--bb-checkbox-item-width: #{$checkbox-item-width};
min-height: var(--bb-height);
height: auto;
@@ -12,10 +12,31 @@
flex-direction: column;
}
&.form-control.no-border:not(.is-valid):not(.is-invalid) {
border-color: transparent;
}
&.form-control:not(.is-invalid):focus {
box-shadow: none;
}
&.is-button {
padding: 0;
}
.checkbox-item {
display: inline-flex;
width: var(--bb-checkbox-item-width);
.form-check {
width: var(--bb-checkbox-item-width);
}
}
.form-check-sm .form-check-input {
margin: 3px 0 2px 0;
}
.btn-group {
border: 1px solid var(--bs-secondary);
display: inline-flex;
@@ -34,68 +55,43 @@
&.disabled {
> span {
opacity: var(--bs-btn-disabled-opacity);
}
> span:not(.active) {
background-color: var(--bb-disabled-bg);
}
}
.checkbox-item {
display: inline-flex;
width: var(--bb-checkbox-item-width);
.form-check {
width: var(--bb-checkbox-item-width);
}
}
&.form-control {
&.no-border {
&:not(.is-valid):not(.is-invalid) {
border-color: transparent;
&:not(.active) {
background-color: var(--bb-disabled-bg);
}
}
&:not(.is-invalid):focus {
box-shadow: none;
}
}
}
}
.checkbox-item .form-check-sm .form-check-input {
margin: 3px 0 2px 0;
}
.input-group-checkbox-list {
border: 1px solid var(--bs-border-color);
border-radius: var(--bs-border-radius);
flex: 1;
}
.input-group-checkbox-list:hover {
border: 1px solid var(--bb-border-hover-color);
}
&:hover {
border: 1px solid var(--bb-border-hover-color);
}
.input-group-checkbox-list .form-control {
border-color: transparent;
}
.form-control {
border-color: transparent;
.input-group-checkbox-list .form-control:hover {
border-color: transparent !important;
&:hover {
border-color: transparent !important;
}
}
}
.input-group > .checkbox-list {
display: flex;
--bb-checkbox-item-width: 110px;
}
.input-group > .checkbox-list .form-control {
border-color: transparent;
padding: 0;
}
.form-control {
border-color: transparent;
padding: 0;
.input-group > .checkbox-list .form-control:hover {
border-color: transparent !important;
:hover {
border-color: transparent !important;
}
}
}

2
src/BootstrapBlazor/wwwroot/css/bootstrap.blazor.bundle.min.css vendored
View File

File diff suppressed because one or more lines are too long

40
src/BootstrapBlazor/wwwroot/scss/bootstrap.blazor.css vendored
View File

@@ -1069,9 +1069,25 @@ a, a:hover, a:focus {
.checkbox-list.is-vertical {
flex-direction: column;
}
.checkbox-list.form-control.no-border:not(.is-valid):not(.is-invalid) {
border-color: transparent;
}
.checkbox-list.form-control:not(.is-invalid):focus {
box-shadow: none;
}
.checkbox-list.is-button {
padding: 0;
}
.checkbox-list .checkbox-item {
display: inline-flex;
width: var(--bb-checkbox-item-width);
}
.checkbox-list .checkbox-item .form-check {
width: var(--bb-checkbox-item-width);
}
.checkbox-list .form-check-sm .form-check-input {
margin: 3px 0 2px 0;
}
.checkbox-list .btn-group {
border: 1px solid var(--bs-secondary);
display: inline-flex;
@@ -1091,38 +1107,18 @@ a, a:hover, a:focus {
.checkbox-list .btn-group.disabled > span:not(.active) {
background-color: var(--bb-disabled-bg);
}
.checkbox-list .btn-group .checkbox-item {
display: inline-flex;
width: var(--bb-checkbox-item-width);
}
.checkbox-list .btn-group .checkbox-item .form-check {
width: var(--bb-checkbox-item-width);
}
.checkbox-list .btn-group.form-control.no-border:not(.is-valid):not(.is-invalid) {
border-color: transparent;
}
.checkbox-list .btn-group.form-control:not(.is-invalid):focus {
box-shadow: none;
}
.checkbox-item .form-check-sm .form-check-input {
margin: 3px 0 2px 0;
}
.input-group-checkbox-list {
border: 1px solid var(--bs-border-color);
border-radius: var(--bs-border-radius);
flex: 1;
}
.input-group-checkbox-list:hover {
border: 1px solid var(--bb-border-hover-color);
}
.input-group-checkbox-list .form-control {
border-color: transparent;
}
.input-group-checkbox-list .form-control:hover {
border-color: transparent !important;
}
@@ -1131,13 +1127,11 @@ a, a:hover, a:focus {
display: flex;
--bb-checkbox-item-width: 110px;
}
.input-group > .checkbox-list .form-control {
border-color: transparent;
padding: 0;
}
.input-group > .checkbox-list .form-control:hover {
.input-group > .checkbox-list .form-control :hover {
border-color: transparent !important;
}

2
src/BootstrapBlazor/wwwroot/scss/bootstrap.blazor.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
test/UnitTest/Components/LinkButtonTest.cs
View File

@@ -51,7 +51,7 @@ public class LinkButtonTest : BootstrapBlazorTestBase
Assert.Contains("link-danger", cut.Markup);
cut.SetParametersAndRender(pb => pb.Add(a => a.IsDisabled, true));
Assert.DoesNotContain("link-danger", cut.Markup);
cut.WaitForAssertion(() => Assert.DoesNotContain("link-danger", cut.Markup));
}
[Fact]

2
test/UnitTest/Components/TransferPanelTest.cs
View File

@@ -32,6 +32,8 @@ public class TransferPanelTest : BootstrapBlazorTestBase
{
pb.Add(a => a.ShowSearch, true);
});
cut.WaitForAssertion(() => cut.Contains("input-inner"));
var input = cut.Find(".input-inner");
input.Input(new ChangeEventArgs()
{