Close

Responsive Admin Panel

This is an example of a responsive bootstrap admin panel with hover effects, designed using HTML, CSS, and bootstrap framework 4. The icons, images, and fonts are imported to the code with their URLs. The concept of Lists has been used with UL and LI components. UL element has been used with the child elements of LI to display the details in an orderly manner. Media queries have been used to increase the responsiveness of the form. The font family for the form is set as 'Muli', sans-serif. The sidebar is given a style set of padding as 20px, margin-bottom as 6px, color as #606060, font-weight as 600, border-left as solid 4px rgba(0,0,0,0.1), margin-left as 4px, cursor as pointer to get the hand cursor effect, and a transition of all 0.3s. In a hover event, the sidebar takes the color of #fcc728. The drop-down items take a transform effect of rotate (90deg), in a hover event. The section titles has the styles of font-weight as 400, font-size as 1.3em, and text-decoration as underline, whereas the section tables are given a background color of #fcc728, and filter as drop-shadow(0px 6px 0px #e2b324). Source: https://codepen.io/rafael-medeiros-the-sasster/pen/abzLvrv

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Several Related Snippets

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.