nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-27 08:00:51 +01:00
Code Issues Packages Projects Releases Wiki Activity

close button

Browse Source
This commit is contained in:
Layne 2021-06-20 01:46:24 -04:00
parent eeee644bad
commit 6841eeba60
2 changed files with 27 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/layout/card/header/NitroCardHeaderView.scss
View File

@ -1,4 +1,29 @@
.nitro-card-header { .nitro-card-header {
min-height: $nitro-card-header-height; min-height: $nitro-card-header-height;
max-height: $nitro-card-header-height; max-height: $nitro-card-header-height;
.nitro-card-close-parent {
right:-3px;
top:5px;
position: absolute;
width: auto;
.nitro-card-close {
cursor: pointer;
border-radius: $border-radius;
box-shadow: inset 0 0 0 1px #921911, inset 0 2px rgba($white,.2);
padding:2px 6px 0 6px;
border:1px solid $white;
background: rgb(245,80,65);
background: linear-gradient(180deg, rgba(245,80,65,1) 0%, rgba(245,80,65,1) 50%, rgba(194,48,39,1) 50%, rgba(194,48,39,1) 100%);
&:hover {
filter: brightness(1.2);
}
&:active {
filter: brightness(0.8);
}
}
}
} }

4
src/layout/card/header/NitroCardHeaderView.tsx
View File

@ -13,8 +13,8 @@ export const NitroCardHeaderView: FC<NitroCardHeaderViewProps> = props =>
<div className="col-10 offset-1 d-flex justify-content-center align-items-center"> <div className="col-10 offset-1 d-flex justify-content-center align-items-center">
<div className="h4 m-0 text-white text-shadow">{ headerText }</div> <div className="h4 m-0 text-white text-shadow">{ headerText }</div>
</div> </div>
<div className="d-flex col-1 justify-content-center align-items-center"> <div className="nitro-card-close-parent">
<div className="cursor-pointer" onClick={ onCloseClick }> <div className="nitro-card-close" onClick={ onCloseClick }>
<i className="fas fa-times"></i> <i className="fas fa-times"></i>
</div> </div>
</div> </div>