theme.less 12.1 KB
Newer Older
Pierre's avatar
Pierre committed
1 2 3 4 5 6
@import "css/variables.less";
@import "css/mixins.less";


@mm_radius_top: 0 0 4px 4px;

Pierre's avatar
Pierre committed
7 8
body {

Pierre's avatar
Pierre committed
9
    font-family: sans-serif;
Pierre's avatar
Pierre committed
10
}
Pierre's avatar
Pierre committed
11 12
.page_sommaire body {
	// font-size:1em;
Pierre's avatar
Pierre committed
13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
   //background: #FFF;
}
.page_sommaire .navbar .nav > li > a {
    //padding: 3px 5px;
}
.clear {clear:both;}
/*
#content {
    width: 760px;
}
#aside {
    width: 300px;
}
#extra {
    width: 300px;
}
Pierre's avatar
Pierre committed
29
a:hover{
Pierre's avatar
Pierre committed
30
    background-color: @yellow;
Pierre's avatar
Pierre committed
31
    background: @yellow;
Pierre's avatar
Pierre committed
32
}
Pierre's avatar
Pierre committed
33 34 35 36
.edito, .une {
	font-size:@baseFontSize;
	font-weight: normal;
}
Pierre's avatar
Pierre committed
37 38 39 40 41 42 43 44 45 46 47 48 49 50
.logo_ficelle {
    margin: 5px;
    margin-top: 50px;
}
.navbar-fixed-top {
    top: inherit;
    position: inherit;
}
*/
ul.spip .entry.document .spip_logos {
   // float: left;
    margin: 0 10px 2px 0em;
   // max-width: 2.14286em;
}
Pierre's avatar
Pierre committed
51 52 53
.footer .licence {
    padding-top: 10px;
}
Pierre's avatar
Pierre committed
54
.footer .nav-pills > .active > a, .footer .nav-pills > .active > a:hover, .footer .nav-pills > .active > a:focus {
Pierre's avatar
Pierre committed
55
    background-color: darken(@footerBackground, 2%);
Pierre's avatar
Pierre committed
56
}
Pierre's avatar
Pierre committed
57
.footer .nav-pills li.on.active > a {
Pierre's avatar
Pierre committed
58
    color: @yellow;
Pierre's avatar
Pierre committed
59 60 61 62
}
.abomailman_listes ul{
    list-style: none outside none;
}
Pierre's avatar
Pierre committed
63
.cartouche h1, h3.spip, .hero-unit h3, .hero-unit h1, .hero-unit h2{
Pierre's avatar
Pierre committed
64 65
  color: darken(@green, 10%);
}
Pierre's avatar
Pierre committed
66
.footer .hero-unit h3{
67 68
    font-size: 1.3em;
  font-variant: small-caps;
Pierre's avatar
Pierre committed
69
  margin-left: 2px;
Pierre's avatar
Pierre committed
70
}
Pierre's avatar
Pierre committed
71 72 73 74
.hero-unit::before {
    margin-left: -1px;
    width: 5px;
}
Pierre's avatar
Pierre committed
75
.navbar-inverse .navbar-search .search-query{
Pierre's avatar
Pierre committed
76 77 78 79
    border-color: @yellow;
    box-shadow: 0 1px 2px @yellow inset, 0 1px 0 rgba(255, 255, 255, 0.15);
    color: #333;
    transition: none 0s ease 0s ;
Pierre's avatar
Pierre committed
80 81 82
    background-color: #f6f6f6;
    border-radius: 10px;
}
Pierre's avatar
Pierre committed
83
.navbar-inverse #item-bureau ul, .navbar-inverse #item-webmail ul, .navbar-inverse #item-cloud ul{
Pierre's avatar
Pierre committed
84 85 86 87 88
    border-color: @yellow;
    box-shadow: 0 2px4px @yellow inset, 0 1px 0 rgba(255, 255, 255, 0.15);
    color: #333;
    transition: none 0s ease 0s ;
    background-color: #f6f6f6;
Pierre's avatar
Pierre committed
89
    border-radius: 10px;
Pierre's avatar
Pierre committed
90 91
}
.navbar-search {
Pierre's avatar
Pierre committed
92
    margin: 1px;
Pierre's avatar
Pierre committed
93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115
}
.navbar .nav > li.flote_droite {
    float: right;
}
.navbar ul.nav  {
    width: 100%;
}

.navbar input.span2, textarea.span2, .uneditable-input.span2 {
    width: 80px;
}
// recherche



li.on.active > a{
    color: @yellow;
}
.top_couleur .active .block_titre:hover {
    color: darken(@yellow, 50%);
}

.footer-wrap {
Pierre's avatar
Pierre committed
116
    background: none repeat scroll 0 0 @footerBackground;
Pierre's avatar
Pierre committed
117
    border-top: 1px solid #000;
118
    color: @footerBackgroundTextColor;
Pierre's avatar
Pierre committed
119 120 121 122
}
.footer-wrap .nav {
    margin-bottom: 5px;
}
Pierre's avatar
Pierre committed
123
.footer .nav-pills > li > a {
Pierre's avatar
Pierre committed
124
    color: @footerBackgroundTextColor;
Pierre's avatar
Pierre committed
125
}
Pierre's avatar
Pierre committed
126
.footer .nav-pills > li > a:hover, .footer .nav-pills > li > a:active, .footer .nav-pills > li > a:focus {
Pierre's avatar
Pierre committed
127
    background: none repeat scroll 0 0 lighten(@footerBackground,1%);
Pierre's avatar
Pierre committed
128
    color:@yellow;
Pierre's avatar
Pierre committed
129 130 131 132 133 134 135 136 137 138 139
}
.page_sommaire #content > .inner {
    padding-right: 0;
}
#aside {
    float: right;
}
#extra {
    float: right;
}
#content {
Pierre's avatar
Pierre committed
140
    background: #f8f8f8 none repeat scroll 0 0;
Pierre's avatar
Pierre committed
141
    border: 1px solid #e6e6e6;
Pierre's avatar
Pierre committed
142
    float: left;
Pierre's avatar
Pierre committed
143
    margin-bottom: 2em;
Pierre's avatar
Pierre committed
144
    margin-top: @topContent;
Pierre's avatar
Pierre committed
145 146
    margin-left: 0;
    margin-right: 0;
Pierre's avatar
Pierre committed
147
    padding: 1em 2em 1em;
Pierre's avatar
Pierre committed
148
    border-radius: 5px;
Pierre's avatar
Pierre committed
149 150
}

Pierre's avatar
Pierre committed
151 152 153
#aside {
    margin-top: @topContent;
}
154 155 156
.rubrique .texte {
	font-weight :	normal;
}
Pierre's avatar
Pierre committed
157
.rubriques_filles h3{
158 159 160 161
	font-size: 1.22em;
    margin-bottom: 4px;
    margin-top: 8px;
}
Pierre's avatar
Pierre committed
162 163 164 165 166 167 168 169
// Base classes
.label,
.badge {
  font-weight: normal;
  line-height: 14px; // ensure proper line-height if floated
  color: @textColor;
  vertical-align: baseline;
  white-space: inherit;
Pierre's avatar
Pierre committed
170
  text-shadow: inherit;
Pierre's avatar
Pierre committed
171 172 173 174 175 176 177
  background-color: #eee;
    border: 1px solid #eee;
    font-size: 0.8em;
    font-style: italic;
}
// Base classes
.label:hover,
Pierre's avatar
Pierre committed
178
.badge:hover {
Pierre's avatar
Pierre committed
179 180
  background-color: #ddd;
}
Pierre's avatar
Pierre committed
181 182 183 184 185 186
#slogan_site_spip {
    color: @grayLight;
    line-height: 1em;
}
#logo_site_spip {
    color: @grayLight;
Pierre's avatar
Pierre committed
187
    line-height: 1.5em;
Pierre's avatar
Pierre committed
188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204
    font-size: 2.2em;
}
#content .nuagetags {
	padding-top:1.5em;
	border-radius:@mm_radius_top;
	//background: url("img/background_light.png") repeat scroll 0 0 #FFFFFF;
}

.navbar, .header {
	/* font-weight: bold; */
}

/* image d'entête et espace haut pour aérer */
.header {
	padding-top:2.0em;
	padding-bottom:0.5em;
}
Pierre's avatar
Pierre committed
205
#navred {
Pierre's avatar
Pierre committed
206
    left: 0;
Pierre's avatar
Pierre committed
207
    right: 0;
Pierre's avatar
Pierre committed
208
    z-index: 120;
Pierre's avatar
Pierre committed
209
    background: @navbarInverseBackground;
Pierre's avatar
Pierre committed
210
    background-repeat: repeat-x;
Pierre's avatar
Pierre committed
211
    border-color: #770000;
Pierre's avatar
Pierre committed
212
    /* position: fixed; */
Pierre's avatar
Pierre committed
213
    line-height : @menuLineHeight;
Pierre's avatar
Pierre committed
214
    background-image: linear-gradient(to bottom, @navbarInverseBackgroundHighlight, @navbarInverseBackground);
Pierre's avatar
Pierre committed
215
}
Pierre's avatar
Pierre committed
216
#navred {
Pierre's avatar
Pierre committed
217 218 219 220 221 222 223 224 225
    background-color: @navbarInverseBackground;
}
#navred .navbar-inverse .nav > li > a {
    //font-size: 1.05em;
}
.navbar-inverse .nav li.dropdown > .dropdown-toggle .caret {
    border-bottom-color:  @yellow;
    border-top-color:  @yellow;
}
Pierre's avatar
Pierre committed
226
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:active, .dropdown-menu > li .active > a {
Pierre's avatar
Pierre committed
227
    white-space: inherit;
Pierre's avatar
Pierre committed
228 229
    background-color: @navbarInverseBackground;
    background: @navbarInverseBackground;
Pierre's avatar
Pierre committed
230 231
    color: #dfc673;
}
Pierre's avatar
Pierre committed
232 233 234 235 236 237 238 239
.well {
    border: 1px solid #ededed;
	background: url("img/background_light.png") repeat scroll 0 0 #FFFFFF;
}
.breadcrumb .divider {
    color: #777777;
}
.breadcrumb {
Pierre's avatar
Pierre committed
240 241 242 243 244
	background: #f2f2f2;
    border: 1px solid #eee;
  .box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
  .transition(~"border linear .2s, box-shadow linear .2s");
  margin-bottom: 0.4em;
Pierre's avatar
Pierre committed
245 246 247 248 249
}
#content > .inner {padding-right: @gridColumnWidth / 1.5;}
.page_sommaire .liste.long {
    clear: left;
}
Pierre's avatar
Pierre committed
250
/*
Pierre's avatar
Pierre committed
251 252
@media (max-width: 1200px) {
	.hero-unit {
Pierre's avatar
Pierre committed
253
	  max-width : 100%;
Pierre's avatar
Pierre committed
254 255 256 257 258 259
	  min-height: none;
	  margin-right: 0;
	}
}
@media (max-width: 767px) {
	.hero-unit {
Pierre's avatar
Pierre committed
260
	  max-width : 100%;
Pierre's avatar
Pierre committed
261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295
	  min-height: none;
	  margin-right: 0;
	}
  .header {
    // background-image: url(img/intro_100.jpg);
    padding-right:100px;
    padding-top:5em;
  }
}
*/
/* sous titres à la ligne */
.soustitre { display:block; color:@graySmall; margin-top:-5px; margin-bottom:1.5em;}

/* pas d'icone à coté des auteurs et de la date */
//.publication i.icon-calendar { display:none; }
//.publication i.icon-user { display:none; }

/* pas le nombre de commentaire non plus en haut de l'article */
.postmeta { padding-top: 15px }
.cartouche { border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

/* pas le nombre de commentaires sur les listes avec contenu long */
.long .postmeta {display:none;}

/* pas de flèche lire la suite sur les listes avec contenu long */
.long .lire-la-suite {display:none;}
/* du coup, sans lire-la-suite, on peut raccourcir l'espace */
.long .entry {
  padding-bottom: 0px
}
/* réduire l'écart entre titre et contenu */
.long .entry .h3-like {margin-bottom:0;}


/* nav-header légèrement plus gros */
Pierre's avatar
Pierre committed
296 297
.nav-header {
	font-size:0.8em;
Pierre's avatar
Pierre committed
298 299 300 301
	color:@gray;
}

/* pas de trait entre les items de listes */
Pierre's avatar
Pierre committed
302
.liste-items {  padding-top:1em }
Pierre's avatar
Pierre committed
303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328
.liste-items .item { border-bottom:none; border-top:none; }
.liste-items .item:last-child {border-bottom: none;}
/* liste secondaires plus aérées */
.secondary .liste-items  .item {padding:11px 0;}


/* listes condensées */
.liste.list-condensed .liste-items {border-top:none;}
.liste.list-condensed .liste-items .item {
	border-bottom:1px solid lighten(@inputBorder,5%);
	border-top:1px solid lighten(@inputBorder,5%);
}
.liste.list-condensed .liste-items .item:last-child {border-bottom:1px solid lighten(@inputBorder,5%);}
/* liste secondaires normales */
.secondary .liste.list-condensed .liste-items  .item {padding:.25em 0;}


/* titre des listes plus près d'elles */
.liste .h2 { margin-bottom:.5em;}

/* condensed comme dans bootstrap */
table.spip.table-condensed th, table.spip.table-condensed td {
    padding: 4px 5px;
}
.category {
	background: url("img/background.png") repeat scroll 0 0 #eee;
Pierre's avatar
Pierre committed
329
    border: 1px solid #eee;
Pierre's avatar
Pierre committed
330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362
    font-style: italic;
    font-size: 0.8em;
}
.noisette_miniagenda small {
    float: right;
}
.resultats .liste-items .entry .spip_logos {
    display: inline;
    height: auto !important;
    max-width: 100px;
}

h3, .h3, .h3-like { font-size: 1.5em; margin-bottom:.6em;}
.h3-like, .short .entry-title  {
    font-size: 1.4em;
    line-height: 1.4em;
}
h3.spip { margin-top: 1em; }

/* portfolio qui retourne a la ligne ! */
article footer, article aside{ .clearfix }

/* une abeille sous le hero */
.cartouche .spip_logos, .hero-unit .spip_logos, .entry-title .spip_logos {
    margin: 10px 0 11px 19px;
}
.hero-unit {
  background: none;
}

/* navigation arrondie */
.nav-list > .active > a { .border-radius(8px); margin-bottom:1px; font-weight:normal; }

Pierre's avatar
Pierre committed
363
/* navbar
Pierre's avatar
Pierre committed
364 365 366 367 368 369 370 371
.navbar {margin-bottom: (@baseLineHeight*2) };*/
.navbar {margin-bottom: 0;}
.navbar-inner {min-height:none; border-radius: 0 0 2px 2px;}
.navbar-inverse .navbar-inner {
    height: 35px;
    max-height: 35px;
    min-height: 35px;
}
372

Pierre's avatar
Pierre committed
373 374
/* footer */
.container > .wrapper { .clearfix ; margin-top: 40px;}
375
.footer {  border-width:4px; border-color: @yellow; }
Pierre's avatar
Pierre committed
376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437

/* coloration code et les cadres */
.spip_code, code { color:#a3537e; background:none; border:none; font-size: 0.9em; padding:0;}

.coloration_code {
  .cadre_download { text-align:right; margin:-9px 5px 9px 0; }
}

textarea.spip_cadre { cursor:text; }

.embed { margin-bottom:1em; }

.coloration_code .spip_cadre {
  #font > .shorthand(@baseFontSize,normal,@baseLineHeight); // Set size, weight, line-height here
  display: inline-block;
  padding: 6px 8px;
  font-size: @baseFontSize;
  line-height: @baseLineHeight;
  color: @gray;
  .border-radius(@inputBorderRadius);
  vertical-align: middle;

  background-color: #f3f3f3; /*@inputBackground;*/
  border: 1px solid @inputBorder;
  .box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
  .transition(~"border linear .2s, box-shadow linear .2s");

  .box-shadow(inset 0 1px 2px rgba(0,0,0,.025));

  /* http://forum.alsacreations.com/topic-4-59824-1-Mise-en-forme-liste-ol.html */
  ol {
    border: 1px solid lighten(@inputBorder,5%);
    .border-radius(0 5px 5px 0);
    padding-left:0;
    counter-reset: section; /* on instancie un compteur */
    margin-left: 2.5em;
    margin-bottom:0;
  }
  ol li:before {
    display: block;
    float: left;
    content: counter(section) ""; /* on utilise notre compteur */
    counter-increment: section; /* on ajoute +1 au compteur */
    width: 3em;
    margin-left:-4em;
    text-align:right;
  }
  ol li { list-style-type: none; padding:2px 5px; margin:0; background:white}
  ol li:first-child { .border-radius(0 5px 0 0); }
  ol li:last-child { .border-radius(0 0 5px 0); }
}



/* admin des forums avec un espace entre les boutons */
.bouton_action_post {margin-left:2px;}


/* boutons d'admin colorés et à droite */
body .spip-admin-bloc,
body .spip-admin-float {
  right:6%;
Pierre's avatar
Pierre committed
438
  font-size:0.9em;
Pierre's avatar
Pierre committed
439

Pierre's avatar
Pierre committed
440 441 442 443 444
  .spip-admin-boutons {
    background:darken(@yellow, 10%);
    font-weight:normal;
    border-radius:@mm_radius_top;
  }
Pierre's avatar
Pierre committed
445 446 447 448 449
  .spip-admin-boutons {
	margin: 0;
	padding: .4em 1em;
	border: 0;
	-webkit-border-top-left-radius: .3em;
Pierre's avatar
Pierre committed
450
	-webkit-border-top-right-radius: .3em;
Pierre's avatar
Pierre committed
451
	-moz-border-radius-topleft: .3em;
Pierre's avatar
Pierre committed
452 453
	-moz-border-radius-topright: .3em;
	border-radius: .3em .3em 0 0 ;
Pierre's avatar
Pierre committed
454
	opacity: .3;
Pierre's avatar
Pierre committed
455
  }
Pierre's avatar
Pierre committed
456 457 458
  .spip-admin-boutons, a.spip-admin-boutons, .spip-admin-boutons a {
    color: white;
    text-decoration: none;
Pierre's avatar
Pierre committed
459
  }
Pierre's avatar
Pierre committed
460 461 462
  a:focus.spip-admin-boutons, .spip-admin-boutons a:focus, a:hover.spip-admin-boutons, .spip-admin-boutons a:hover {
    opacity: 1;
    color: @grayDark;
Pierre's avatar
Pierre committed
463
  }
Pierre's avatar
Pierre committed
464 465 466
  a:active.spip-admin-boutons, .spip-admin-boutons a:active {
    background-color: #333;
    opacity: 0.7;
Pierre's avatar
Pierre committed
467 468 469 470 471 472
  }
}
.container > .wrapper:before, .container > .wrapper:after {
    display: table;
}

Pierre's avatar
Pierre committed
473 474
/* couleurs h3 menu footer */
.hu-red h3 {
Pierre's avatar
Pierre committed
475
  color: lighten(@red,0%);
Pierre's avatar
Pierre committed
476 477
}
.hu-green h3 {
Pierre's avatar
Pierre committed
478
  color: lighten(@green,10%);
Pierre's avatar
Pierre committed
479 480
}
.hu-purple h3 {
Pierre's avatar
Pierre committed
481
  color: lighten(@purple,15%);
Pierre's avatar
Pierre committed
482 483
}
.hu-yellow h3 {
Pierre's avatar
Pierre committed
484
  color: lighten(@yellow,0%);
Pierre's avatar
Pierre committed
485 486
}
.hu-black h3 {
Pierre's avatar
Pierre committed
487
  color: lighten(@black,0%);
Pierre's avatar
Pierre committed
488
}
Pierre's avatar
Pierre committed
489 490 491 492
.hu-orange h3 {
  color: lighten(@orange,20%);
}
/* boutons */
Pierre's avatar
Pierre committed
493
input.submit {
Pierre's avatar
Pierre committed
494 495 496
	text-shadow: none;
  color: lighten(@yellow,25%);
}
Pierre's avatar
Pierre committed
497
input.submit:hover {
Pierre's avatar
Pierre committed
498
  color: lighten(@yellow,34%);
Pierre's avatar
Pierre committed
499
}
Pierre's avatar
Pierre committed
500 501 502

.circle {
    background: #fff none repeat scroll 0 0;
Pierre's avatar
Pierre committed
503 504
    color: @grayDark;
    border: 1px solid @grayDark;
Pierre's avatar
Pierre committed
505 506 507
    border-radius: 50%;
    font-family: sans-serif;
    height: 200px;
fred's avatar
fred committed
508
    padding: 2px 4px 4px;
Pierre's avatar
Pierre committed
509 510
    width: 200px;
}
Pierre's avatar
Pierre committed
511 512 513 514 515 516 517 518 519 520
#navred .circle {
    background: inherit;
    border-color: #ccc;
    color: #ccc;
}
#navred .circle:hover {
    background: @black;
    border-color: #ccc;
    color: #ccc;
}
Pierre's avatar
Pierre committed
521
.circle:hover {
Pierre's avatar
Pierre committed
522
    color: @footerBackground;
Pierre's avatar
Pierre committed
523
    border: 1px solid @black;
Pierre's avatar
Pierre committed
524
}