This README outlines minor CSS customizations added to my AIBooru/Danbooru instance, primarily rounded image corners and a subtle hover effect for visual enhancement.
- Rounded Image Corners: Images now have 20px rounded corners for a softer, more modern aesthetic.
- Image Grow on Hover: Images very slightly increase in size when hovered over, adding a touch of interactivity.
- Locate Stylesheet: Go to My Account -> Settings -> Advanced, and scroll to the very bottom and you will see the CSS Menu
- Add Custom CSS: Apply the stylesheet and add the following CSS code (adjust selectors and values as needed):
/* Image Rounded Corners */
header img,
body img,
.main img {
border-radius: 20px;
}
/* Image Hover Effect */
.image-container img, .note-container img, .blacklisted img {
transition: transform 0.2s ease-in-out;
}
.image-container img:hover, .note-container img:hover, .blacklisted img:hover {
transform: scale(1.05);
}