tazpkg annotate tazpanel/pkgs.css @ rev 737

pkgs.cgi: rework sidebar; remove "My packages" button and "list" command. Now selection of "My packages/All packages", Category, Repository (+ lists of tags and categories) is done using sidebar.
author Aleksej Bobylev <al.bobylev@gmail.com>
date Wed Dec 31 05:34:56 2014 +0200 (2014-12-31)
parents 853142b48010
children a4c149977942
rev   line source
al@737 1
al@737 2 /* Sidebar menus */
al@737 3
al@737 4 #content-sidebar { margin: 20px 144px 20px 20px; }
al@737 5
al@737 6 #sidebar {
al@737 7 /*background-color: #FFF;*/
al@737 8 /*border: 1pt solid #888;*/
al@737 9 position: fixed;
al@737 10 top: 80px;
al@737 11 right: 5px;
al@737 12 width: 132px;
al@737 13 }
al@737 14
al@737 15 #sidebar > a {
al@737 16 display: block;
al@737 17 padding: 0;
al@737 18 margin: 0 0 0 0.5em;
al@737 19 }
al@737 20
al@737 21 #sidebar .active {
al@737 22 color: #000;
al@737 23 font-weight: bold;
al@737 24 }
al@737 25
al@737 26 #sidebar h4 {
al@737 27 margin: 0;
al@737 28 font-size: 16px; color: #222;
al@737 29 text-align: center;
al@737 30 }
al@737 31
al@737 32 #sidebar input[type=submit] { display: none; }
al@737 33
al@737 34 #sidebar label {
al@737 35 display: inline-block;
al@737 36 padding: 0 0 0 0.5em; margin: 0;
al@737 37 color: #666;
al@737 38 font-size: small;
al@737 39 width: 100%;
al@737 40 }
al@737 41
al@737 42 #sidebar label:hover { color: #000; }
al@737 43
al@737 44 table.side {
al@737 45 background-color: #f8f8f8;
al@737 46 border: none; border-collapse: collapse;
al@737 47 padding: 0; margin: 0;
al@737 48
al@737 49 border: 1pt solid #888;
al@737 50 -moz-border-radius: 4px;
al@737 51 -webkit-border-radius: 4px;
al@737 52 border-radius: 4px;
al@737 53 }
al@737 54 table.side tr:nth-child(even) {
al@737 55 background-color: rgba(0,0,0,0.05);
al@737 56 }
al@737 57
al@737 58 #sidebar select {
al@737 59 margin: 0; padding: 0 0.5em;
al@737 60 width: 100%;
al@737 61 font-size: small;
al@737 62 }
al@737 63
al@737 64
al@737 65
al@718 66 /* links classes:
al@718 67 * pkg - package (not installed);
al@718 68 * pkgi - package (installed);
al@718 69 * pkgib - package (installed and blocked);
al@718 70 * w - web site
al@718 71 *
al@718 72 * you can style links using icons and/or color
al@718 73 */
al@718 74
al@718 75 a.pkg {
al@718 76 background: url(images/tazpkg.png) no-repeat left; }
al@718 77 a.pkgi, a.pkgib {
al@718 78 background: url(images/tazpkg-installed.png) no-repeat left; }
al@718 79 /*
al@718 80 a.pkgi {
al@718 81 color: green; }
al@718 82 */
al@718 83 a.pkgib {
al@718 84 color: red; }
al@720 85 a.w, .pkglist td:nth-child(4) a {
al@718 86 background: url(images/browser.png) no-repeat left; }
al@718 87
al@720 88 a.pkg, a.pkgi, a.pkgib, a.w, .pkglist td:nth-child(4) a {
al@718 89 margin: 0; padding: 0 0 0 17px;
al@718 90 min-height: 16px; min-width: 16px;
al@718 91 display: inline-block; }
al@718 92
al@718 93
al@723 94 .pkglist td:nth-child(1), .filelist td:nth-child(1) {
al@719 95 white-space: nowrap;
al@719 96 }
al@719 97
al@723 98 .pkglist td:nth-child(1) a, .filelist td:nth-child(1) a {
al@719 99 max-width: 12em;
al@719 100 }
al@719 101
al@719 102 .pkglist td:nth-child(2) {
al@719 103 max-width: 7em;
al@719 104 }
al@719 105
al@723 106 .pkglist td:nth-child(1) a, .pkglist td:nth-child(2),
al@723 107 .filelist td:nth-child(1) a, .filelist td:nth-child(2) {
al@719 108 white-space: nowrap;
al@719 109 overflow: hidden;
al@719 110 text-overflow: ellipsis; -o-text-overflow: ellipsis;
al@719 111 }
al@719 112
al@723 113 .filelist td:nth-child(2) {
al@723 114 max-width: 30em;
al@723 115 }
al@723 116
al@726 117 #actions { overflow: auto; }
al@726 118
al@726 119 a.pages {
al@726 120 padding: 0.5ex;
al@726 121 margin: 0.5ex 0;
al@726 122 border: 1px solid #AAA;
al@726 123 width: 3ex;
al@726 124 display: inline-block;
al@726 125 text-align: center;
al@726 126 }
al@726 127 a.pages:hover {
al@726 128 border: 1px solid #F94;
al@726 129 background: #F94;
al@726 130 color: black;
al@726 131 }
al@726 132 a.pages.current, a.pages.current:hover {
al@726 133 font-weight: bold;
al@726 134 border: 1px solid #07F;
al@726 135 background: #07F;
al@726 136 color: #eee;
al@726 137 }
al@731 138
al@731 139 a.tag1 { font-size: 0.9em; color: #678; }
al@731 140 a.tag2 { font-size: 1.0em; color: #444; }
al@731 141 a.tag3 { font-size: 1.1em; color: #16A; }
al@731 142 a.tag4 { font-size: 1.3em; color: #282; }
al@731 143 a.tag5 { font-size: 1.5em; color: #828; }
al@731 144 a.tag6 { font-size: 1.8em; color: #862; }
al@731 145 a.tag7 { font-size: 2.1em; color: #FA0; }
al@731 146 a.tag8 { font-size: 2.4em; color: #F00; }
al@731 147 a.tag1, a.tag2, a.tag3, a.tag4, a.tag5, a.tag6, a.tag7, a.tag8 {
al@731 148 display: inline-block;
al@731 149 white-space: nowrap;
al@731 150 vertical-align: middle;
al@731 151 padding: 0.2em 0.5em;
al@731 152 }
al@731 153 a.tag1:hover, a.tag2:hover, a.tag3:hover, a.tag4:hover, a.tag5:hover, a.tag6:hover, a.tag7:hover, a.tag8:hover {
al@731 154 outline: 1.5pt solid #FC8; }
al@731 155