Kieran/snort
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tailwind close btn that works on light theme

Browse Source
This commit is contained in:
Martti Malmi
2023-12-15 12:04:04 +02:00
parent 39549dbe96
commit 1389bfe1ed
8 changed files with 26 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
packages/app/src/index.css
View File

@ -954,34 +954,6 @@ svg.repeat {
display: none;
}
/* Basic styling for the close button */
.close-button {
position: relative;
width: 30px;
height: 30px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1); /* 10% opacity white background */
cursor: pointer;
overflow: hidden;
transition: background 0.3s ease;
}
/* Styling for the X icon */
.close-button::before {
content: "x";
color: #fff;
font-size: 16px;
line-height: 30px; /* Adjust to the height of the container */
position: absolute;
top: 47%;
left: 50%;
transform: translate(-50%, -50%);
}
/* Hover effect */
.close-button:hover {
background: rgba(255, 255, 255, 0.15); /* 15% opacity white background on hover */
}
@media (min-width: 768px) {
.rt-border {
border-right-width: 1px;