]>
git.immae.eu Git - github/shaarli/Shaarli.git/blob - tpl/default/css/shaarli.css
17 display: inline-block
;
24 vertical-align: baseline
;
25 border-radius: .25rem;
29 font-family: 'Roboto Slab';
34 local
('Fira-Sans-regular'),
35 url
('../fonts/Fira-Sans-regular.woff2') format
('woff2'),
36 url
('../fonts/Fira-Sans-regular.woff') format
('woff');
40 * Extends Pure grids responsive to hide items.
41 * Use xx-0 to hide an item on xx screen.
42 * Display it at any level with xx-visible.
44 .pure-u-0 { display: none
!important
; }
45 @media screen and
(min-width: 35.5em) {
46 .pure-u-sm-0 { display: none
!important
; }
47 .pure-u-sm-visible { display: inherit
!important
; }
49 @media screen and
(min-width: 48em) {
50 .pure-u-md-0 { display: none
!important
; }
51 .pure-u-md-visible { display: inherit
!important
; }
53 @media screen and
(min-width: 64em) {
54 .pure-u-lg-0 { display: none
!important
; }
55 .pure-u-lg-visible { display: inherit
!important
; }
57 @media screen and
(min-width: 80em) {
58 .pure-u-xl-0 { display: none
!important
; }
59 .pure-u-xl-visible { display: inherit
!important
; }
70 -webkit-font-smoothing: antialiased
;
71 /* Hack to transition with auto height: http://stackoverflow.com/a/8331169/1484919 */
73 transition: max-height
0.5s;
80 transition: max-height
0.75s;
88 .pure-menu-link:visited
,
89 .pure-menu-selected
.pure-menu-link
,
90 .pure-menu-selected .pure-menu-link:visited {
94 .pure-menu-link:hover
,
95 .pure-menu-selected .pure-menu-link:hover {
97 background: transparent
;
110 background-color: #b0ddce;
114 border-radius: 100px;
118 transition: all
0.5s;
121 .menu-toggle .bar:first-child {
122 transform: translateY
(-6px);
125 .menu-toggle.x .bar {
126 transform: rotate
(45deg);
129 .menu-toggle.x .bar:first-child {
130 transform: rotate
(-45deg);
133 @media screen and
(max-width: 64em) {
145 background: url
(../img/noise.png), #1fa67a url
(../img/logo2.png) no-repeat fixed
10px 2.5em;
151 margin: 45px 0 0 125px;
156 #header h1 a
, #header h1
a:visited
{
157 /* https://css-tricks.com/centering-css-complete-guide/#vertical-inline-multiple */
158 display: -ms-flexbox
;
160 flex-direction: column
;
161 justify-content: center
;
166 text-decoration: none
;
169 font-family: Roboto Slab
, Arial
, sans-serif
;
178 /* position: fixed; */
188 * Can't make it work with awesomplete list z-index. Any idea?
198 #search input
[type
="text"] {
200 padding: 5px 5px 3px 15px;
203 transition: width
.5s ease
;
205 border: medium none currentColor
;
207 box-shadow: 0 1px 0 rgba
(255, 255, 255, 0.078), 0 1px 4px rgba
(0, 0, 0, 0.298) inset
;
212 background: transparent
;
217 #search button:hover
{
226 box-shadow: 0 -2px 1em #797979;
228 background: url
(../img/noise.png) #979797;
232 * CONTENT - LINKLIST PAGING
234 @media screen and
(min-width: 35.5em) {
240 @media screen and
(min-width: 64em) {
251 .linklist-filters span {
255 .linklist-filters a {
257 text-decoration: none
;
260 .linklist-filters .filter-off {
265 .linklist-filters .filter-on {
278 text-decoration: none
;
281 .linklist-pages a:hover {
293 text-decoration: none
;
296 border: solid
1px #979797;
304 .linksperpage input[type="text"] {
308 padding: 3px 5px 3px 8px;
310 border: medium none currentColor
;
312 box-shadow: 0 1px 0 rgba
(255, 255, 255, 0.078), 0 1px 4px rgba
(0, 0, 0, 0.298) inset
;
318 * CONTENT - LINKLIST ITEMS
323 box-shadow: 2px 2px 0.5em #797979;
326 .linklist-item-title, .linklist-item-title h2 {
330 .linklist-item-title {
331 background: #20b988 url
(../img/noise.png);
332 border-bottom: 1px solid
#1b926c;
333 box-shadow: 1px 1px 0.2em #1b926c;
336 .linklist-item-title h2 {
337 padding: 3px 10px 0 10px;
341 .linklist-item-title a {
344 text-decoration: none
;
345 vertical-align: middle
;
346 font-family: Roboto Slab
, Arial
, sans-serif
;
349 .linklist-item-title .linklist-link:visited {
353 .linklist-item-title a:hover, .linklist-item-title .linklist-link:hover{
358 .linklist-item-title .label-private {
359 border: solid
1px #d0fff0;
360 font-family: Arial
, sans-serif
;
364 .linklist-item-title .fold-button {
368 .linklist-item-editbuttons {
373 .linklist-item-editbuttons a {
377 .linklist-item-description {
379 font-family: Roboto Slab
, Arial
, sans-serif
;
382 .linklist-item-description a {
383 text-decoration: none
;
387 .linklist-item-description a:hover {
388 text-shadow: 1px 1px #ddd;
391 .linklist-item-description a:visited {
395 .linklist-item-infos {
397 background: #ddd url
(../img/noise.png);
398 border-top: 1px solid
#989898;
399 box-shadow: 1px -1px 0.2em #989898;
404 .linklist-item-infos a {
406 text-decoration: none
;
409 .linklist-item-infos a:hover {
413 .linklist-item-tags {
417 .linklist-item-infos .label-tag {
418 border: 1px solid
#505050;
422 .linklist-item-infos .label-tag:hover {
423 border: 1px solid
#000;
426 .linklist-plugin-icon {
431 .linklist-item-infos-url {
435 text-overflow: ellipsis
;
439 * CONTENT - LINKLIST ITEMS
444 box-shadow: 2px 2px 0.5em #797979;
447 .linklist-item-title, .linklist-item-title h2 {
451 .linklist-item-title {
452 background: #20b988 url
(../img/noise.png);
453 border-bottom: 1px solid
#1b926c;
454 box-shadow: 1px 1px 0.2em #1b926c;
457 .linklist-item-title h2 {
462 .linklist-item-title a {
465 text-decoration: none
;
466 vertical-align: middle
;
469 .linklist-item-title a:hover {
473 .linklist-item-editbuttons {
478 .linklist-item-editbuttons a {
482 .linklist-item-description {
486 .linklist-item-infos {
488 background: #ddd url
(../img/noise.png);
489 border-top: 1px solid
#989898;
490 box-shadow: 1px -1px 0.2em #989898;
495 .linklist-item-infos a {
497 text-decoration: none
;
500 .linklist-item-infos a:hover {