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

Fix close button

Browse Source
This commit is contained in:
MyNameIsBatman 2021-06-22 19:08:08 -03:00
parent 2819df2ecc
commit 1c44de5daa
5 changed files with 24 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/layout/card/NitroCardView.scss
View File

@ -41,4 +41,24 @@ $nitro-card-top-height: $nitro-card-header-height + $nitro-card-tabs-height;
} }
} }
.header-close {
right: 6px;
border-radius: $border-radius;
box-shadow: inset 0 0 0 1.5px #921911, inset 0 2px rgba($white, .2);
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%);
cursor: pointer;
line-height: 1;
padding: 4px 6px;
&:hover {
filter: brightness(1.2);
}
&:active {
filter: brightness(0.8);
}
}
@import './accordion/NitroCardAccordionView'; @import './accordion/NitroCardAccordionView';

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

@ -1,24 +1,4 @@
.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;
.header-close {
right: 6px;
border-radius: $border-radius;
box-shadow: inset 0 0 0 1.5px #921911, inset 0 2px rgba($white, .2);
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%);
cursor: pointer;
line-height: 1;
padding: 4px 6px;
&:hover {
filter: brightness(1.2);
}
&:active {
filter: brightness(0.8);
}
}
} }

20
src/layout/card/simple-header/NitroCardSimpleHeaderView.scss
View File

@ -8,24 +8,4 @@
width: 100%; width: 100%;
margin: 0 30px; margin: 0 30px;
} }
.header-close {
right: 6px;
border-radius: $border-radius;
box-shadow: inset 0 0 0 1.5px #921911, inset 0 2px rgba($white, .2);
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%);
cursor: pointer;
line-height: 1;
padding: 4px 6px;
&:hover {
filter: brightness(1.2);
}
&:active {
filter: brightness(0.8);
}
}
} }

4
src/views/room/widgets/camera/CameraWidgetView.scss
View File

@ -1,7 +1,7 @@
.nitro-camera-capture { .nitro-camera-capture {
.nitro-card-close-parent { .header-close {
top: 7px; top: 7px;
right: 10px; right: 9px;
} }
.camera-canvas { .camera-canvas {

6
src/views/room/widgets/camera/views/capture/CameraWidgetCaptureView.tsx
View File

@ -79,10 +79,8 @@ export const CameraWidgetCaptureView: FC<CameraWidgetCaptureViewProps> = props =
<DraggableWindow handle=".nitro-camera-capture"> <DraggableWindow handle=".nitro-camera-capture">
<div className="nitro-camera-capture d-flex flex-column justify-content-center align-items-center"> <div className="nitro-camera-capture d-flex flex-column justify-content-center align-items-center">
<div className="camera-canvas"> <div className="camera-canvas">
<div className="nitro-card-close-parent"> <div className="position-absolute header-close" onClick={ event => processAction('close') }>
<div className="nitro-card-close" onClick={ event => processAction('close') }> <i className="fas fa-times"/>
<i className="fas fa-times"/>
</div>
</div> </div>
<div ref={ cameraFrameRef } className={'camera-frame ' + classNames({'bg': cameraWidgetContext.selectedPictureIndex > -1}) }> <div ref={ cameraFrameRef } className={'camera-frame ' + classNames({'bg': cameraWidgetContext.selectedPictureIndex > -1}) }>
{ cameraWidgetContext.selectedPictureIndex > -1 && <div> { cameraWidgetContext.selectedPictureIndex > -1 && <div>