fix skit2

This commit is contained in:
fifi97
2022-03-16 10:33:15 +08:00
parent bb465edb97
commit fea81bf8ce
2 changed files with 137 additions and 1 deletions
@@ -153,8 +153,36 @@
</div>
</div>
<div class="notify-petibesi max">
<div class="toast-content max">
<i class="fas fa-exclamation check"></i>
<div class="message">
<span class="text text-1">Baki Maksimum</span>
<span class="text text-2">Baki peti besi melebihi RM 150,000.00</span>
</div>
<i class="fas fa-times close"></i>
<div class="progress"></div>
</div>
</div>
{{-- <div class="notify-petibesi min">
<div class="toast-content min">
<i class="fas fa-exclamation check"></i>
<div class="message">
<span class="text text-1">Baki Minimum</span>
<span class="text text-2">Baki peti besi melebihi RM 150,000.00</span>
</div>
<i class="fas fa-times close"></i>
<div class="progress"></div>
</div>
</div> --}}
<div class="container">
<button id="showbutton">Click</button>
<div class="row justify-content-center" style="margin-top:60px;">
<div class="col-md-12">
@@ -495,7 +523,7 @@
function simpanfunc()
{
console.log('simpan');
// console.log('simpan');
//Swal.fire({
// title: 'Adakah anda pasti untuk mengemaskini denominasi?',
// text: "Sila pastikan denominasi anda betul!",
@@ -749,6 +777,20 @@
}
// function clickedbutton(){
// const button = $('#show').val();
// }
$("#showbutton").click(function(){
// alert("The paragraph was clicked.");
$(".notify-petibesi").addClass("active");
});
$(".close").click(function(){
// alert("The paragraph was clicked.");
$(".notify-petibesi").removeClass("active");
});
</script>
@endsection
+94
View File
@@ -75,6 +75,100 @@
align-items: flex-start !important;
}
.notify-petibesi.max{
position: absolute;
bottom:50px;
right: 30px;
border-radius:12px;
background: #fff;
padding: 20px 35px 20px 25px;
box-shadow:0 5px 10px rgba(0,0,0,0.1);
border-left: 6px solid #e67e22;
z-index:1;
display:none;
-webkit-transition: opacity 600ms, visibility 600ms;
transition: opacity 600ms, visibility 600ms;
}
.notify-petibesi.min{
position: absolute;
bottom:50px;
right: 30px;
border-radius:12px;
background: #fff;
padding: 20px 35px 20px 25px;
box-shadow:0 5px 10px rgba(0,0,0,0.1);
border-left: 6px solid #e74c3c;
z-index:1;
display:none;
-webkit-transition: opacity 600ms, visibility 600ms;
transition: opacity 600ms, visibility 600ms;
}
.notify-petibesi.active{
display:block;
}
.notify-petibesi .toast-content{
display:flex;
align-items:center;
}
.toast-content .message{
display:flex;
flex-direction: column;
margin: 0 20px;
}
.toast-content.max .check{
display:flex;
align-items:center;
justify-content:center;
height:35px;
width:35px;
background-color:#e67e22;
color:#fff;
font-size:20px;
border-radius:50%;
}
.toast-content.min .check{
display:flex;
align-items:center;
justify-content:center;
height:35px;
width:35px;
background-color:#e74c3c;
color:#fff;
font-size:20px;
border-radius:50%;
}
.message .text{
font-size:20px;
font-weight:400;
color:#666666;
}
.message .text.text-1{
font-weight:600;
color:#333;
}
.notify-petibesi .close{
position:absolute;
top:10px;
right:15px;
padding:5px;
cursor:pointer;
opacity:0.7;
}
.notify-petibesi .close:hover{
opacity:1;
}
</style>
</head>