|
|
Line 1: |
Line 1: |
− | /* ===== CHANGE : Border to the left of H3s to make it easier to separate H3 sections from H4 sections ==============================================================
| |
− | *
| |
− | * This is a change I'm somewhat conflicted about. It works, and it merges nice, and works in mobile as well, but it means the H3s are indented more than the H4s, and can give a minor conflicting look because of it.
| |
− | *
| |
− | */
| |
| | | |
− | /* Add a border to H3s by default*/
| |
− | h3 {
| |
− | border-left: 5px solid #7babde; /* 5px cuz visible, but not distracting */
| |
− | padding-left: 10px; /* need some air to breath */
| |
− | position: relative;
| |
− | left: -15px;
| |
− | margin-top: 2rem !important;
| |
− | }
| |
− |
| |
− | /* Dunno why we're using padding-top when margin-top is more appropriate for this. Probably haven't found the edge case yet, I guess. */
| |
− | /* This is mostly to remove the padding-top that makes the new border extend upwards above the text of the H3. */
| |
− |
| |
− | h1, h2, h3, h4, h5 {
| |
− | margin-top: 10px; /* 10px for margin-top since padding-top: 5px results in about the same, for some weird reason */
| |
− | padding-top: 0; /* let's remove the current 5px default */
| |
− | }
| |
− |
| |
− | /* Let's add more space between sections?
| |
− |
| |
− | /*
| |
− | div#body-content h2 {
| |
− | margin-top: 3.6rem;
| |
− | }
| |
− | *//* Default: 1.2rem */
| |