diff options
author | Luke Shumaker <lukeshu@sbcglobal.net> | 2016-05-27 07:18:09 +0100 |
---|---|---|
committer | Luke Shumaker <lukeshu@sbcglobal.net> | 2016-05-27 07:18:09 +0100 |
commit | f009176f861ef77feef551e8aa3640da4bd81fcc (patch) | |
tree | 30f0b0aaeee5cccfb1433e66f1c07089b89a754d | |
parent | f3bcaebab57a16ac25a935e85a7aae3b8c8bd58f (diff) |
css: attach icons to the <td>, not the <a>.
This has the downside that they are no longer clickable.
It slightly alters both the vertical alignment of the icon and the
link text; the link is now alligned with the other row text (though
because of the space between them, it wasn't really perceptible).
The icon is now actually aligned with a 4px vertical padding, which is
what I always wanted.
-rw-r--r-- | style.css | 40 |
1 files changed, 19 insertions, 21 deletions
@@ -23,33 +23,31 @@ tr:hover { box-shadow: inset 0 0 0 1px #bcd; } -/* Make room for a 16x16 icon on the left, with 4px padding between it - * and the text. */ -td a:first-of-type { +/* Make room for a 16x16 icon on the left, with 4px padding on either + * side */ +tr td:first-of-type { + padding-left: 24px; + background-size: 16px 16px; + background-repeat: no-repeat; + background-position: 4px 4px; margin-left: 20px; } -td a:first-of-type::before { - width: 16px; - height: 16px; - margin-left: -20px; - margin-right: 4px; -} /* generic inode information ---------------------------------------- */ tr.hidden { /*opacity: 0.5;*/ display: none; } tr.dir a::after { content: "/"; } -tr.dir a:first-of-type::before { content: url("dir.png"); } -tr.dir.parent a:first-of-type::before { content: url("parent.png"); } -tr.link a:first-of-type::before { content: url("link.png"); } -tr.file a:first-of-type::before { content: url("file.png"); } +tr.dir td:first-of-type { background-image: url("dir.png"); } +tr.dir.parent td:first-of-type { background-image: url("parent.png"); } +tr.link td:first-of-type { background-image: url("link.png"); } +tr.file td:first-of-type { background-image: url("file.png"); } /* domain-specific information -------------------------------------- */ -tr.dir.repo a:first-of-type::before { content: url("repo.png"); } -tr.arch td { background:#7fc3e5; } -tr.para td { background:#9fa6e3; } +tr.dir.repo td:first-of-type { background-image: url("repo.png"); } +tr.arch td { background-color:#7fc3e5; } +tr.para td { background-color:#9fa6e3; } tr.community { /* TODO: we should indicate this somehow */ } /* file extension information --------------------------------------- */ -tr.file.pkg.tar a:first-of-type::before { content: url("pkg.png"); } -tr.file.iso a:first-of-type::before { content: url("iso.png"); } -tr.file.tar a:first-of-type::before { content: url("tar.png"); } -tr.file.txt a:first-of-type::before { content: url("txt.png"); } -tr.file.torrent a:first-of-type::before { content: url("torrent.png"); } +tr.file.pkg.tar td:first-of-type { background-image: url("pkg.png"); } +tr.file.iso td:first-of-type { background-image: url("iso.png"); } +tr.file.tar td:first-of-type { background-image: url("tar.png"); } +tr.file.txt td:first-of-type { background-image: url("txt.png"); } +tr.file.torrent td:first-of-type { background-image: url("torrent.png"); } |