]>
git.immae.eu Git - github/shaarli/Shaarli.git/blob - inc/shaarli.css
1 /* Cascading Stylesheet for Shaarli - http://sebsauvage.net/wiki/doku.php?id=php:shaarli */
3 /* CSS Reset from Yahoo to cope with browsers CSS inconsistencies. */
5 Copyright (c) 2010, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.com/yui/license.html
8 html
{color:#000;background:#FFF;}body
,div
,dl
,dt
,dd
,ul
,ol
,li
,h1
,h2
,h3
,h4
,h5
,h6
,pre
,code
,form
,fieldset
,legend
,input
,button
,textarea
,p
,blockquote
,th
,td
{margin:0;padding:0;}table
{border-collapse:collapse
;border-spacing:0;}fieldset
,img
{border:0;}address
,caption
,cite
,code
,dfn
,em
,strong
,th
,var
,optgroup
{font-style:inherit
;font-weight:inherit
;}del
,ins
{text-decoration:none
;}li
{list-style:none
;}caption
,th
{text-align:left
;}h1
,h2
,h3
,h4
,h5
,h6
{font-size:100%;font-weight:normal
;}q:before
,q:after
{content:'';}abbr
,acronym
{border:0;font-variant:normal
;}sup
{vertical-align:baseline
;}sub
{vertical-align:baseline
;}legend
{color:#000;}input
,button
,textarea
,select
,optgroup
,option
{font-family:inherit
;font-size:inherit
;font-style:inherit
;font-weight:inherit
;}input
,button
,textarea
,select
{*font-size:100%;}
11 font-family: "Trebuchet MS",Verdana
,Arial
,Helvetica
,sans-serif
;
13 background-color: #ffffff;
14 word-wrap: break-word
;
18 background-color: #dedede;
19 background: -webkit-gradient
(linear
, 0 0, 0 bottom
, from
(#dedede), to
(#ffffff));
20 background: -webkit-linear-gradient
(#dedede, #ffffff);
21 background: -moz-linear-gradient
(#dedede, #ffffff);
22 background: -ms-linear-gradient
(#dedede, #ffffff);
23 background: -o-linear-gradient
(#dedede, #ffffff);
24 background: linear-gradient
(#dedede, #ffffff);
25 box-shadow: 0 1px 2px rgba
(0, 0, 0, 0.5);
27 border-radius: 5px 5px 5px 5px;
33 text-decoration: none
;
45 background-color: #c0c0c0;
46 background: -moz-linear-gradient
(#c0c0c0, #ffffff) repeat scroll
0 0 transparent
;
47 background: -webkit-gradient
(linear
, 0 0, 0 bottom
, from
(#c0c0c0), to
(#ffffff));
48 background: -webkit-linear-gradient
(#c0c0c0, #ffffff);
49 background: -ms-linear-gradient
(#c0c0c0, #ffffff);
50 background: -o-linear-gradient
(#c0c0c0, #ffffff);
51 background: linear-gradient
(#c0c0c0, #ffffff);
52 border-radius: 3px 3px 3px 3px;
53 box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.5);
64 background-color: #c0c0c0;
65 background: -moz-linear-gradient
(#c0c0c0, #ffffff) repeat scroll
0 0 transparent
;
66 background: -webkit-gradient
(linear
, 0 0, 0 bottom
, from
(#c0c0c0), to
(#ffffff));
67 background: -webkit-linear-gradient
(#c0c0c0, #ffffff);
68 background: -ms-linear-gradient
(#c0c0c0, #ffffff);
69 background: -o-linear-gradient
(#c0c0c0, #ffffff);
70 background: linear-gradient
(#c0c0c0, #ffffff);
71 border-radius: 3px 3px 3px 3px;
72 box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.5);
82 /* Small tab on the left of each link with edit/delete buttons. */
83 .button_edit, .button_delete {
95 padding: 4px 2px 2px 2px;
96 background-color: #f0f0f0;
98 -webkit-border-radius: 0px 6px 6px 0px;
99 -moz-border-radius: 0px 6px 6px 0px;
100 -o-border-radius: 0px 6px 6px 0px;
101 -ms-border-radius: 0px 6px 6px 0px;
102 border-radius: 0px 6px 6px 0px;
104 -webkit-box-shadow: 0px 0px 3px 0px #333333;
105 -moz-box-shadow: 0px 0px 3px 0px #333333;
106 -o-box-shadow: 0px 0px 3px 0px #333333;
107 -ms-box-shadow: 0px 0px 3px 0px #333333;
108 box-shadow: 0px 0px 3px 0px #333333;
112 background-image: url
('../images/logo.png');
113 background-repeat: no-repeat
;
115 margin: 0 10px 0 10px;
121 #pageheader #linkcount
{
130 background-color: #333333;
131 background: -webkit-gradient
(linear
, 0 0, 0 bottom
, from
(#333333), to
(#111111));
132 background: -webkit-linear-gradient
(#333333, #111111);
133 background: -moz-linear-gradient
(#333333, #111111);
134 background: -ms-linear-gradient
(#333333, #111111);
135 background: -o-linear-gradient
(#333333, #111111);
136 background: linear-gradient
(#333333, #111111);
137 box-shadow: 0 1px 2px rgba
(0, 0, 0, 0.5);
139 padding: 0 10px 5px 10px;
144 background-color: #333333;
145 background: -webkit-gradient
(linear
, 0 0, 0 bottom
, from
(#333333), to
(#000000));
146 background: -webkit-linear-gradient
(#333333, #000000);
147 background: -moz-linear-gradient
(#333333, #000000);
148 background: -ms-linear-gradient
(#333333, #000000);
149 background: -o-linear-gradient
(#333333, #000000);
150 background: linear-gradient
(#333333, #000000);
151 box-shadow: 0 1px 2px rgba
(0, 0, 0, 0.5);
153 border-radius: 5px 5px 5px 5px;
154 margin: 10px 3px 3px 3px;
157 text-decoration: none
;
160 #pageheader .search
{
169 #toolsdiv #bookmark
{
177 .linksperpage, .tagfilter, .searchform, .addform {
178 background-color: #dedede;
179 background: -webkit-gradient
(linear
, 0 0, 0 bottom
, from
(#dedede), to
(#ffffff));
180 background: -webkit-linear-gradient
(#dedede, #ffffff);
181 background: -moz-linear-gradient
(#dedede, #ffffff);
182 background: -ms-linear-gradient
(#dedede, #ffffff);
183 background: -o-linear-gradient
(#dedede, #ffffff);
184 background: linear-gradient
(#dedede, #ffffff);
186 box-shadow: 0 1px 2px rgba
(0, 0, 0, 0.5);
189 border-radius: 5px 5px 5px 5px;
190 margin: 10px 3px 3px 3px;
195 box-shadow: 0 0 0 rgba
(0, 0, 0, 0.5);
199 .linksperpage input, .tagfilter input, .searchform input, .addform input {
207 .linksperpage input {
211 .searchform #searchform_value {
219 .tagfilter #tagfilter_value {
223 .tagfilter input.bigbutton, .searchform input.bigbutton, .addform input.bigbutton {
224 background-color: #dedede;
225 background: -webkit-gradient
(linear
, 0 0, 0 bottom
, from
(#dedede), to
(#ffffff));
226 background: -webkit-linear-gradient
(#dedede, #ffffff);
227 background: -moz-linear-gradient
(#dedede, #ffffff);
228 background: -ms-linear-gradient
(#dedede, #ffffff);
229 background: -o-linear-gradient
(#dedede, #ffffff);
230 background: linear-gradient
(#dedede, #ffffff);
231 box-shadow: 0 1px 2px rgba
(0, 0, 0, 0.5);
232 padding: 0 5px 0 5px;
235 border-radius: 5px 5px 5px 5px;
246 color: #fff !important
;
249 #pageheader a:visited
{
251 text-decoration: none
;
254 #pageheader a:hover
{
256 text-decoration: none
;
259 #pageheader a:active
{
261 text-decoration: none
;
265 padding: 4px 0px 5px 5px;
271 background-color: #777;
279 text-decoration: none
;
294 .paging_privatelinks {
298 .paging_linksperpage {
303 .paging_linksperpage form.linksperpage {
307 .paging_linksperpage form.linksperpage input {
327 padding: 5px 5px 5px 5px;
331 #headerform input
.linkurl
{
337 padding: 5px 5px 5px 5px;
343 padding: 5px 5px 5px 5px;
350 padding: 5px 5px 5px 15px;
355 #editlinkform textarea
, #editlinkform
.lf_input
{
360 padding: 4px 10px 15px 20px;
361 border-top: 1px solid
#bbb;
363 background-color: #F2F2F2;
364 background: -webkit-gradient
(linear
, 0 0, 0 bottom
, from
(#F2F2F2), to
(#ffffff));
365 background: -webkit-linear-gradient
(#F2F2F2, #ffffff);
366 background: -moz-linear-gradient
(#F2F2F2, #ffffff);
367 background: -ms-linear-gradient
(#F2F2F2, #ffffff);
368 background: -o-linear-gradient
(#F2F2F2, #ffffff);
369 background: linear-gradient
(#F2F2F2, #ffffff);
373 #linklist li.publicLinkHightLight:hover, #linklist li:hover {
378 .linkdate, .linkarchive {
383 .linkdate a, .linkarchive a {
397 #linklist li
.private
{
398 background: url
('../images/private.png') no-repeat
10px center
;
406 .private .linktitle a {
416 text-decoration: none
;
424 .linkdate, .linkarchive {
429 .linkdate a, .linkarchive a {
430 background-image: url
('../images/calendar.png');
431 padding: 2px 0 3px 20px;
432 background-repeat: no-repeat
;
433 text-decoration: none
;
455 text-decoration: none
;
459 .linkdescription a:hover {
470 background-color: #F2F2F2;
471 background: -webkit-gradient
(linear
, 0 0, 0 bottom
, from
(#F2F2F2), to
(#ffffff));
472 background: -webkit-linear-gradient
(#F2F2F2, #ffffff);
473 background: -moz-linear-gradient
(#F2F2F2, #ffffff);
474 background: -ms-linear-gradient
(#F2F2F2, #ffffff);
475 background: -o-linear-gradient
(#F2F2F2, #ffffff);
476 background: linear-gradient
(#F2F2F2, #ffffff);
477 box-shadow: 0 0 2px rgba
(0, 0, 0, 0.5);
478 padding: 3px 3px 3px 20px;
480 border-radius: 3px 3px 3px 3px;
482 background-image: url
('../images/tag_blue.png');
483 background-repeat: no-repeat
;
484 background-position: 3px center
;
485 background-color: #ffffff;
489 border-color: #555573;
495 text-decoration: none
;
499 border-left: 1px solid
#aaa;
510 text-decoration: none
;
515 text-decoration: underline
;
525 border-top: 1px solid
#ddd;
539 background-color: #FFFFA0;
548 #newversion #version_id
{
549 text-decoration: blink
;
566 text-decoration: none
;
574 border: 1px solid black
;
585 padding: 10px 5px 10px 5px;
589 #installform input
.bigbutton
{
593 #changepasswordform {
595 padding: 10px 5px 10px 5px;
601 padding: 10px 5px 10px 5px;
612 padding: 10px 5px 10px 5px;
617 padding: 10px 5px 10px 5px;
626 /* If you want thumbnails on the left:
637 /* --- Picture wall CSS --- */
640 background-color: #000;
644 .picwall_pictureframe {
645 background-color: #000;
649 vertical-align: middle
;
657 .picwall_pictureframe img {
660 } /* Adapt the width of the image */
662 .picwall_pictureframe a {
663 text-decoration: none
;
666 /* CSS to show title when hovering an image - no javascript required. */
667 .picwall_pictureframe span.info {
671 .picwall_pictureframe:hover span.info {
681 background-color: transparent
;
682 background-color: rgba
(0, 0, 0, 0.4);
683 /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
684 filter: progid: DXImageTransform
.Microsoft
.gradient
(startColorstr
=#66000000, endColorstr
=#66000000);
686 text-shadow: 2px 2px 1px #000000;
689 /* Minimal customisation for jQuery widgets */
691 background-color: #fff;
696 background-color: #604dff;
700 #linklist li
.publicLinkHightLight
{
704 div#permalinkQrcode
{
708 background-color: #ffffff;
709 border: 1px solid black
;
716 -webkit-box-shadow: 2px 2px 20px 2px #333333;
717 -moz-box-shadow: 2px 2px 20px 2px #333333;
718 -o-box-shadow: 2px 2px 20px 2px #333333;
719 -ms-box-shadow: 2px 2px 20px 2px #333333;
720 box-shadow: 2px 2px 20px 2px #333333;
724 font-family: Georgia
, 'DejaVu Serif', Norasi
, serif
;
725 background-color: #E6D6BE;
726 /* Background paper texture by BashCorpo:
727 http://www.bashcorpo.dk/textures.php
728 http://bashcorpo.deviantart.com/art/Grungy-paper-texture-v-5-22966998 */
729 background-image: url
("../images/Paper_texture_v5_by_bashcorpo_w1000.jpg");
730 -webkit-background-size: cover
;
731 -moz-background-size: cover
;
732 -o-background-size: cover
;
733 background-size: cover
;
735 border-bottom: 2px solid black
;
759 border: 1px solid black
;
764 padding: 5px 5px 5px 5px;
784 padding: 10px 20px 0px 20px;
791 padding: 0px 20px 30px 20px;
794 /* Individual entries in "Daily": */
796 margin: 5px 10px 2px 5px;
798 border-top: 1px solid
#555;
802 text-decoration: none
;
810 div
.dailyEntryTitle
{
815 div
.dailyEntryThumbnail
{
818 background-color: rgb
(128, 128, 128);
819 background: url
(../images/50pc_transparent.png);
820 padding: 4px 0px 2px 0px;
823 div
.dailyEntryDescription
{
832 padding: 40px 0px 90px 0px;
838 padding-bottom: 20px;
841 /* Common CSS screwdriver */
850 /* For lazy images loading in picture wall.
851 Using http://www.appelsiini.net/projects/lazyload
857 #configuration_table td
{
866 background: #fff !important
;
867 color: #000 !important
;
872 width: auto
!important
;
873 margin: auto
!important
;
876 /* Minimum numer of lines to display when splitting a paragraph
884 color: #000 !important
;
885 text-decoration: none
!important
;
888 #pageheader, .paging
, #linklist li form
, #footer
{
894 border-top: 2px solid
#000;
898 #linklist li
.private
{
899 background-color: none
;
916 border: 1px solid black
;
922 @media handheld
, only screen and
(max-width: 480px), only screen and
(max-device-width: 854px) {
923 /* A few fixes for mobile devices (far from perfect). */
934 border-radius: 5px 5px 5px 5px;
938 .searchform, .tagfilter {
939 display: block
!important
;
940 margin: 0px !important
;
941 padding: 0px !important
;
942 width: 100% !important
;
945 .searchform input, .tagfilter input {
946 margin: 0px !important
;
947 padding: 0px !important
;
948 display: inline
!important
;
951 .tagfilter input.bigbutton, .searchform input.bigbutton, .addform input.bigbutton {
957 width: 70% !important
;
961 width: 70% !important
;
971 .paging_privatelinks {
975 .paging_linksperpage {
981 #paging_older, #paging_newer
, .paging_linksperpage a
{
982 border: 1px solid black
;
983 padding: 3px 5px 3px 5px;
984 background-color: #666;
986 border-radius: 5px 5px 5px 5px;
1010 #daily_col1, #daily_col2
, #daily_col3
{
1028 div
.dailyEntryTitle
{
1033 div
.dailyEntryDescription
{
1038 /* Highlight search results */
1040 background-color: #FFFF33;