tazpkg view 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
line source
2 /* Sidebar menus */
4 #content-sidebar { margin: 20px 144px 20px 20px; }
6 #sidebar {
7 /*background-color: #FFF;*/
8 /*border: 1pt solid #888;*/
9 position: fixed;
10 top: 80px;
11 right: 5px;
12 width: 132px;
13 }
15 #sidebar > a {
16 display: block;
17 padding: 0;
18 margin: 0 0 0 0.5em;
19 }
21 #sidebar .active {
22 color: #000;
23 font-weight: bold;
24 }
26 #sidebar h4 {
27 margin: 0;
28 font-size: 16px; color: #222;
29 text-align: center;
30 }
32 #sidebar input[type=submit] { display: none; }
34 #sidebar label {
35 display: inline-block;
36 padding: 0 0 0 0.5em; margin: 0;
37 color: #666;
38 font-size: small;
39 width: 100%;
40 }
42 #sidebar label:hover { color: #000; }
44 table.side {
45 background-color: #f8f8f8;
46 border: none; border-collapse: collapse;
47 padding: 0; margin: 0;
49 border: 1pt solid #888;
50 -moz-border-radius: 4px;
51 -webkit-border-radius: 4px;
52 border-radius: 4px;
53 }
54 table.side tr:nth-child(even) {
55 background-color: rgba(0,0,0,0.05);
56 }
58 #sidebar select {
59 margin: 0; padding: 0 0.5em;
60 width: 100%;
61 font-size: small;
62 }
66 /* links classes:
67 * pkg - package (not installed);
68 * pkgi - package (installed);
69 * pkgib - package (installed and blocked);
70 * w - web site
71 *
72 * you can style links using icons and/or color
73 */
75 a.pkg {
76 background: url(images/tazpkg.png) no-repeat left; }
77 a.pkgi, a.pkgib {
78 background: url(images/tazpkg-installed.png) no-repeat left; }
79 /*
80 a.pkgi {
81 color: green; }
82 */
83 a.pkgib {
84 color: red; }
85 a.w, .pkglist td:nth-child(4) a {
86 background: url(images/browser.png) no-repeat left; }
88 a.pkg, a.pkgi, a.pkgib, a.w, .pkglist td:nth-child(4) a {
89 margin: 0; padding: 0 0 0 17px;
90 min-height: 16px; min-width: 16px;
91 display: inline-block; }
94 .pkglist td:nth-child(1), .filelist td:nth-child(1) {
95 white-space: nowrap;
96 }
98 .pkglist td:nth-child(1) a, .filelist td:nth-child(1) a {
99 max-width: 12em;
100 }
102 .pkglist td:nth-child(2) {
103 max-width: 7em;
104 }
106 .pkglist td:nth-child(1) a, .pkglist td:nth-child(2),
107 .filelist td:nth-child(1) a, .filelist td:nth-child(2) {
108 white-space: nowrap;
109 overflow: hidden;
110 text-overflow: ellipsis; -o-text-overflow: ellipsis;
111 }
113 .filelist td:nth-child(2) {
114 max-width: 30em;
115 }
117 #actions { overflow: auto; }
119 a.pages {
120 padding: 0.5ex;
121 margin: 0.5ex 0;
122 border: 1px solid #AAA;
123 width: 3ex;
124 display: inline-block;
125 text-align: center;
126 }
127 a.pages:hover {
128 border: 1px solid #F94;
129 background: #F94;
130 color: black;
131 }
132 a.pages.current, a.pages.current:hover {
133 font-weight: bold;
134 border: 1px solid #07F;
135 background: #07F;
136 color: #eee;
137 }
139 a.tag1 { font-size: 0.9em; color: #678; }
140 a.tag2 { font-size: 1.0em; color: #444; }
141 a.tag3 { font-size: 1.1em; color: #16A; }
142 a.tag4 { font-size: 1.3em; color: #282; }
143 a.tag5 { font-size: 1.5em; color: #828; }
144 a.tag6 { font-size: 1.8em; color: #862; }
145 a.tag7 { font-size: 2.1em; color: #FA0; }
146 a.tag8 { font-size: 2.4em; color: #F00; }
147 a.tag1, a.tag2, a.tag3, a.tag4, a.tag5, a.tag6, a.tag7, a.tag8 {
148 display: inline-block;
149 white-space: nowrap;
150 vertical-align: middle;
151 padding: 0.2em 0.5em;
152 }
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 {
154 outline: 1.5pt solid #FC8; }