Skip to content

Instantly share code, notes, and snippets.

@zachary
Created August 31, 2024 17:16
Show Gist options
  • Save zachary/d123cd6eeee6368dde7732f4a2201b08 to your computer and use it in GitHub Desktop.
Save zachary/d123cd6eeee6368dde7732f4a2201b08 to your computer and use it in GitHub Desktop.

Revisions

  1. zachary created this gist Aug 31, 2024.
    56 changes: 56 additions & 0 deletions all.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,56 @@
    /* Reset some default styles and provide a clean slate */
    * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    }
    /* Apply a simple, elegant font to the entire page */
    body {
    font-family: 'Arial', sans-serif;
    }
    /* Add a subtle background color and center content */
    html, body {
    height: 100%;
    background-color: #f0f0f0;
    display: flex;
    justify-content: center;
    align-items: center;
    }
    /* Style links with a different color and remove underlines */
    a {
    text-decoration: none;
    color: #007BFF;
    }
    /* Create a responsive, centered container */
    • container {
    max-width: 800px; margin: 0 auto;
    padding: 20px;
    background-color: #fff;
    box-shadow: 0 2px 5px gba(0, 0, 0, 0.1);
    border-radius: 5px;
    }
    /* Style buttons with a modern look */
    button {
    background-color: #007BFF;
    color: #fff; border: none;
    border-radius: 5px;
    padding: 10px 20px;
    cursor: pointer;
    transition: background-color 0.3s;
    }
    button: hover {
    background-color: #0056b3;
    }
    /* Add responsive design for mobile devices */
    @media (max-width: 768px) {
    .container
    padding: 10px;
    button {
    padding: 8px 16px;
    }
    }
    /* Highlight important elements with a soft shadow */
    •highlight {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    }