source: spip-zone/_squelettes_/zktx-kore/trunk/css/zktx.css.html @ 112736

Last change on this file since 112736 was 112736, checked in by l.oiseau2nuit@…, 2 years ago

ménages et bugfixes

  • poursuite refactoring css
  • on vire les vieux icônes par défaut et on intègre une dépendance à favicon (obj. qualité site)
  • inclure/rubriques: intégration correcte de la class #EXPOSE
  • extras: affinage markup

Reste encore quelques bizarrerries à régler ça et là, genre :

  • sur la home: erreur 404 si pas d'article sommaire_description_longue
  • rubriques: erreurs 404 si pas de #TEXTE
  • terminer les extras sur la page mots aussi

Je suis presqu'ému de le dire après 5 années de zone (au propre comme au figuré) mais on approche d'une version (relativement) stable

File size: 5.8 KB
Line 
1#CACHE{0} [(#REM) dev => 0 ; prod => 3600*24*30 ]
2#HTTP_HEADER{Content-Type: text/css; charset=#CHARSET}
3
4[(#REM) Couleur principale & nuances
5- utilise le plugin couleur_rubrique d'ARNO*
6- sinon utilise la variable 'couleur_primary' suivante
7]<BOUCLE_couleur_r(RUBRIQUES){tout}>
8  [(#SET{[couleur_r(#ID_RUBRIQUE)],[(#ID_RUBRIQUE|couleur_rubrique)] })]
9</BOUCLE_couleur_r>
10<BOUCLE_couleur_a(ARTICLES){tout}>
11  [(#SET{[couleur_a(#ID_ARTICLE)],[(#ID_RUBRIQUE|couleur_rubrique)] })]
12</BOUCLE_couleur_a>
13[(#SET{couleur_primary,337AB7})]
14[(#SET{couleur,[(#GET{couleur_a#ID_ARTICLE}|sinon{[(#GET{couleur_r#ID_RUBRIQUE})]}|sinon{[(#ID_RUBRIQUE|couleur_site)]}|sinon{[(#GET{couleur_primary})]})] })]
15[(#SET{couleur_eclaircir_2,[(#GET{couleur}|couleur_eclaircir|couleur_eclaircir)]})]
16[(#SET{couleur_eclaircir_1,[(#GET{couleur}|couleur_eclaircir)]})]
17[(#SET{couleur_foncer_1,[(#GET{couleur}|couleur_foncer)]})]
18[(#SET{couleur_foncer_2,[(#GET{couleur}|couleur_foncer|couleur_foncer)]})]
19[(#SET{couleur_inverser,[(#GET{couleur}|couleur_inverser)]})]
20
21[(#REM) Recolorisation de la couleur "primary" ]
22a:link, a:visited, a:active, a:hover, a:focus, button, .btn, button:hover, .btn:hover {
23  -webkit-transition: All .6s ease-in;
24  moz-transition: All .6s ease-in;
25  o-transition: All .6s ease-in;
26  transition: All .6s ease-in;
27}
28a, a:active, a:visited { color: [#(#GET{couleur_foncer_1})]; }
29a:focus, a:hover, a:active { color: [#(#GET{couleur})]; }
30.btn:hover { text-decoration:none; }
31.btn-primary, .list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover {
32  color:#FFFFFF!important;
33  background-color: [#(#GET{couleur})]!important;
34}
35.btn-primary {
36  background-image: -webkit-gradient(linear,left 0,left 100%,from([#(#GET{couleur})]),to([#(#GET{couleur_foncer_1})]));
37  background-image: -webkit-linear-gradient(top,[#(#GET{couleur})] 0,[#(#GET{couleur_foncer_1})] 100%);
38  background-image: -moz-linear-gradient(top,[#(#GET{couleur})] 0,[#(#GET{couleur_foncer_1})] 100%);
39  background-image: linear-gradient(to bottom,[#(#GET{couleur})] 0,[#(#GET{couleur_foncer_1})] 100%);
40  background-repeat: repeat-x;
41  border-color: [#(#GET{couleur_foncer_2})];
42  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff[#(#GET{couleur})]',endColorstr='#ff[#(#GET{couleur_foncer_1})]',GradientType=0);
43  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
44}
45.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
46  border-color: [#(#GET{couleur_foncer_2})]!important;
47  background-color: [#(#GET{couleur_foncer_1})]!important;
48  background-position: 0 -15px!important;
49}
50
51[(#REM) btn sociaux aux couleurs officielles
52        à adapter (color ou background-color)
53        selon icons utilisés (socicon-*, fa-* ou fa-*-square)
54]       [(#REM) les + utilisés]
55        a.btn-social {color:#FFFFFF!important;}
56        .btn-fb {background-color:#47639E;}
57        .btn-tw {background-color:#55ACEE;}
58        .btn-li {background-color:#0077B5;}
59        .btn-gp {background-color:#DD4B39;}
60        .btn-yt {background-color:#e02a20;}
61        .btn-ig {background-color:#000000;}
62        [(#REM) services streaming]
63        .btn-bcp {background-color:#619aa9;}
64        .btn-scd {background-color:#fe3801;}
65        .btn-dzr {background-color:#32323d;}
66        .btn-spy {background-color:#7bb342;}
67        .btn-itu {background-color:#ff5e51;}
68
69
70[(#REM) Navigations ]
71.navbar-brand {padding:10px 15px;}
72.top { position:fixed; bottom:1em; right:1em;}
73
74
75[(#REM) Elements ]
76p { margin:1em 0; }
77
78
79[(#REM) Utilities ]
80.pull-left {margin-right:1em;}
81.pull-right {margin-left:1em;}
82
83
84[(#REM) Blocks de pages ]
85.bs-content { padding:20px 0; }
86.bs-header  { padding:80px 0; }
87.bs-extra   { padding:20px 0; background-color: #EFEFEF; }
88.bs-extra.extra2 { background-color: [#(#GET{couleur_eclaircir_2})]; }
89.bs-extra.extra3 { background-color: [#(#GET{couleur_eclaircir_1})]; }
90.bs-footer  { padding:40px 0; }
91.breadcrumb, .well, .jumbotron { background-color: [#(#GET{couleur_eclaircir_1})]; }
92.bs-header .jumbotron, .bs-footer { background-color:[#(#GET{couleur_foncer_2})]; color: #FFFFFF; }
93.bs-footer a, .bs-header .jumbotron a { color:[#(#GET{couleur})]; }
94
95.bs-header {
96  color:#FFFFFF;
97  background-color: [#(#GET{couleur})];   
98  [background-position:50% 50%;
99  background-size:cover;
100  background-attachment:fixed;
101  background-repeat:no-repeat;
102  background-image:url('(#LOGO_SITE_SPIP_SURVOL
103                            |image_reduire{1900,0}
104                            |image_gamma{-50}
105                            |extraire_attribut{src}
106                          )');]
107}
108
109<BOUCLE_article_bs_header(ARTICLES){tout}>
110  .bs-header.article#ID_ARTICLE {
111    background-color: [#(#GET{couleur})];
112    [background-image:url('(#LOGO_ARTICLE_SURVOL
113                              |sinon{#LOGO_RUBRIQUE_SURVOL}
114                              |sinon{#LOGO_SITE_SPIP_SURVOL}
115                              |image_reduire{1900,0}
116                              |image_gamma{-50}
117                              |extraire_attribut{src}
118                          )');]
119  }
120</BOUCLE_article_bs_header>
121<BOUCLE_rubrique_bs_header(RUBRIQUES){tout}>
122  .bs-header.rubrique#ID_RUBRIQUE {
123
124    background-color: [#(#GET{couleur})];
125    [background-image:url('(#LOGO_RUBRIQUE_SURVOL
126                              |sinon{#LOGO_SITE_SPIP_SURVOL}
127                              |image_reduire{1900,0}
128                              |image_gamma{-50}
129                              |extraire_attribut{src}
130                          )');]
131  }
132</BOUCLE_rubrique_bs_header>
133<BOUCLE_mot_bs_header(MOTS){tout}>
134  .bs-header.mot#ID_MOT {
135    [background-image:url('(#LOGO_MOT_SURVOL
136                              |sinon{ #LOGO_SITE_SPIP_SURVOL }
137                              |image_reduire{1900,0}
138                              |image_gamma{-50}
139                              |extraire_attribut{src}
140                          )');]
141  }
142</BOUCLE_mot_bs_header>
Note: See TracBrowser for help on using the repository browser.