Close

Mini Admin Panel

This is an example of a mini admin panel with hover effects, designed using HTML, CSS, and bootstrap framework 4. The icons, 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. The body of the form is given a style set of background-color as rgb(220,220,220), font-size as 16px, and font-family as sans-serif. The logo has the styles of height as 145px, and border-bottom as 1px solid rgb(235,235,235). The sidebar items are given a style set of color as rgb(140,140,140), font as 16px/40px helvetica,verdana,sans-serif, box-sizing as border-box, border-bottom as 1px solid rgb(235,235,235), box-shadow as inset 0 1px 0 rgb(255,255,255), text-indent as 20px, and text-transform as capitalize to make the first letter of the each word uppercase. In a hover event, the items take the effects of background-color as rgb(255,255,255), and box-shadow as 1px 0 0 rgb(255,255,255),inset 5px 0 0 -1px rgb(234,83,63). Source: https://codepen.io/francgio/pen/oNgvaEw

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.