#HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15} #HTTP_HEADER{Vary: Accept-Encoding} [(#REM) ACS (Plugin Spip) http://acs.geomaticien.org Copyright Daniel FAIVRE, 2007-2022 Copyleft: licence GPL - Cf. LICENCES.txt Ce squelette definit les styles de l'espace prive pour ACS Note: l'entete "Vary:" sert a repousser l'entete par defaut "Vary: Cookie,Accept-Encoding", qui est (un peu) genant en cas de "rotation du cookie de session" apres un changement d'IP (effet de clignotement). ATTENTION: il faut absolument le charset sinon Firefox croit que c'est du text/html ! ]#CACHE{3600*100,cache-client} #SET{claire,##ENV{couleur_claire,dfdfdf}} #SET{foncee,##ENV{couleur_foncee,3874b0}} [(#REM) On DOIT redéfinir la couleur du body pour overrider la couleur définie dans la feuille de style du set, qui est chargée. ]body.acs { background: #ffffff; } [(#REM) override de la largeur "large" de SPIP 3 & 4 ].acs #page div.largeur { width: 100%; } .acs .barre_onglet { margin-bottom: 0; padding-bottom: 0; } .acs table { margin: 0; padding: 0; border-collapse: collapse; border-spacing:0; border: 1px;} .acs table caption, .acs table th,.acs table tr, .acs table td {padding:0; background:none;} .acs table.centered {margin: 0 auto; text-align:center} [(#REM) override des coloriages de lignes de tables ].acs tbody tr:nth-child(even) td, .acs tbody tr.even td, .acs tbody tr:nth-child(even) th, .acs tbody tr.even th {background-color:transparent;} .acs img { margin: 0; padding: 0; border: none;} .acs hr, .editeur_composant hr {height: 1px; margin:3px; border:0; background: #GET{claire};} .alert{ color: red; } .acs_dep_ok:after { content: url(#CHEMIN{images/coche_ok.jpg}); } .alert_box { display: block; background: #efefff; border: 1px solid darkred; border-radius: 5px; box-shadow: 2px 2px 8px #dfdfdf; padding: 5px; } [(#REM) Mise en page en colonnes - ne PAS mettre margin/padding là-dedans ! ] .acs_colonnes { display: block; padding: 0; margin: 0; padding-left: 10px; padding-right: 10px; margin-bottom: 10px; } .acs_col1, .acs_col2, .acs_col3 { padding: 0; margin: 0; } .acs_col1, .acs_col3 { width: 25%; } .acs_col1 { float: #LANG_LEFT; } .acs_col2 { float: #LANG_LEFT; } .acs_col3 { float: #LANG_RIGHT; } /* contenu des colonnes */ .acs_col { padding: 10px; } .acs_box { position: relative; border: thin solid #GET{foncee}; [(#MODELE{c_css_border-radius}{r=10px})] background: #fff; margin-top: 14px; width: 100%; } .acs_box_titre { background: #GET{foncee}; padding-#LANG_LEFT: 40px; padding-#LANG_RIGHT: 4px; padding-top: 2px; padding-bottom: 2px;[ (#MODELE{c_css_border-radius}{r=10px}{sauf=bottom})] color: #ffffff; font-family: verdana,arial,helvetica,sans; font-size: 12px; font-weight: bold; } .acs_box_titre td { vertical-align: middle; } .acs_box_titre2 { float:right; } .acs_box_titre a { font-weight: normal; color: #ffffff; } .acs_box_texte { padding: 8px; text-align: #LANG_LEFT;[ (#MODELE{c_css_border-radius}{r=10px}{sauf=top})] color: #000000; overflow: auto; } .acs_box_pages .acs_box_texte { max-height: 600px; overflow: auto; } .acs_box_composants { width: 208px; } .acs_box_composants_hidden { position: absolute; display : none; } fieldset.apercu { margin: 0; margin-bottom: 5px; padding: 0; left: -1px; top:-1px; border: thin inset #GET{claire}; [background-color: (#VAR{acsFondColor, #ffffff});] [background-image: url((#ACS_CHEMIN{fond/#VAR{acsFondImage}}));] background-repeat: repeat; } .apercu legend { margin-left: 10px; padding-left: 5px; padding-right: 5px; background: #fff; border: thin inset #GET{claire}; [(#MODELE{c_css_border-radius}{r=8px})] } .forml { padding:0; padding-left:2px; position: relative; width: 100%; } .formc { padding: 0; line-height: 1em; background: #e4e4e4; border: 1px solid #GET{claire}; font-size: 12px; font-family: Verdana,Arial,Sans,sans-serif; width: 100%; } .led { border: 1px solid #GET{foncee}; width: 1.15em; height: 1.15em; cursor:pointer; } .icon { width: 1.27em; height: 1.27em; cursor:pointer; } .liste_pages tr { vertical-align: top; } .liste_pages td { text-align: justify; } .liste_pages_sep { height: 0.5em; } .spip_params { line-height: 1em; color: #3874b0; margin-bottom: 2px; } .centre { text-align: center; } .btc_0 { background: #f2fff2; } .btc_1 { background: #ffe; } .btc_2 { background: #fff8f8; } .btc_3 { background: #f2f8ff; } .btc_4 { background: #f8fff2; } .nompage { color: black; } .nompage:hover { color: blue; } .widgets { width: 200px; max-height : 400px; overflow: auto; } .widgets_filter_bar { display: none; } .widgets_filter_bar a { display: inline-block; border: 1px outset #GET{foncee}; background: #GET{claire}; text-align: center; width: 28px; height: 28px; line-height: 28px; border-radius: 5px 5px 0 0; } .widgets_filter_bar a.survol { background: none; border: 1px inset #GET{foncee}; } .widgets_filter_bar a img { width: 24px; height: 24px; vertical-align: middle; } .widget, .widgy { text-align: center; color: #444; [(#MODELE{c_css_border-radius}{r=12px})] } .widget:hover, .widgy:hover { color: black; } a.widgy { padding-#LANG_LEFT: 5px; padding-#LANG_RIGHT: 15px; background: #e5f6e8; border: 1px outset #GET{foncee}; white-space: nowrap; } a.widgy:hover { background: #b4e9b4; border: 1px inset #GET{foncee}; } a.widgy_overriden { background: #ffe5b1; } a.widgy_overriden:hover { background: #fed991; } a.widgy_unused { background: #dfdfdf; } a.widgy_ghost { background: #ef8f8f; animation: blinkingAlert 2s infinite; } @keyframes blinkingAlert{ 0% { background-color: #f44;} 25% { background-color: #fed;} 50% { background-color: #fff;} 75% { background-color: #fed;} 100% { background-color: #f44;} } .acs .widgy_included { border: 0; background: none; vertical-align: top; } .widgy_included_label { text-align : right; vertical-align: top; } .acs caption.wcap { margin: 1px; } .acs caption.wcapv { text-align: left; } .acs caption.wcaph { text-align: center; border-top: thin dotted #GET{foncee}; border-bottom: thin dotted #GET{claire}; } .acs table.wcontainerh { border: 0; border-bottom: thin dotted #GET{foncee}; } .acs .widgy img { vertical-align:middle; } .widget { font-weight: bold; font-size: 10px; cursor: pointer; height: 24px; width: 180px; margin: 0; line-height: 10px; background: url(#CHEMIN{images/composant.png}) no-repeat; z-index: 998; } .widget_move { cursor: move; z-index: 999; } .widget:hover { color: black; background: url(#CHEMIN{images/composant_hover.png}) no-repeat; } .widget_overriden { background: url(#CHEMIN{images/composant_overide.png}) no-repeat; } .widget_overriden:hover { background: url(#CHEMIN{images/composant_overide_hover.png}) no-repeat; } .widget_unused { background: url(#CHEMIN{images/composant_inactif.png}) no-repeat; } .widget_unused:hover { background: url(#CHEMIN{images/composant_inactif_hover.png}) no-repeat; } .widget img { vertical-align:middle; width: 20px; height: 20px; margin-left: 5px; margin-right: 5px; cursor:move; } .widget_unused img { cursor:pointer; } .widget a, .widgy a { color: black; } .widget a:hover, .widgy a:hover { color: darkgreen; } .widget table { width: 100%; height: 100%; } .widget table tr { vertical-align: middle; } .widget div { overflow:hidden; text-align:center; } .widget div a { display: block; } .ctlWidget { width: 180px; height: 24px; text-align: center; border: 1px inset #GET{foncee}; background: #f0f0f8; display: inline-block; vertical-align: middle; } .ctlWidget, .c_config .ctlWidget_droppable_active, .c_config .ctlWidget_droppable_over, .c_config .ctlWidget_droppable_drop { border-radius: 12px; -moz-outline-radius: 12px; } .ctlWidget_droppable_active { outline: thin dashed #dfdfdf; } .ctlWidget_droppable_over { outline: 3px dotted lightgreen; } .ctlWidget_droppable_drop { outline: 3px dotted orange; } .select_widget { position:absolute; width: 160px; height: 18px; margin-left:10px; margin-top:2px; left:0; right:0; } [(#REM) Coloration syntaxique acs-spip ] .spip_source { overflow: auto; max-height: 600px; border: 1px inset #dfdfdf; } .col_MODELE { color: darkblue; } .col_BOUCLE, .col_FIN_BOUCLE, .col_B, .col_FIN_B { color: darkviolet; } .col_REM { color: grey; } .col_TRAD { color: brown; } .col_INCLURE { color: blue; } .col_VAR { color: #00228f; } .col_BALISE { color: #005d00; } [(#REM) Styles des pinceaux ACS. Les types autres que crayon permettent d'utiliser des controleurs spécifiques ] .crayon-icones em.crayon-pinceau { position : relative; background: url(#CHEMIN{images/pinceau.png}) no-repeat; height: 20px; width: 20px; top: -10px; right: 10px; cursor: pointer; display: none; } .shift > .crayon-icones em.crayon-pinceau { top: -15px; #LANG_RIGHT: -15px; } .crayon-hover>.crayon-icones span,.crayon-hover>.crayon-icones em.crayon-pinceau {display: block !important;} .crayon-changed em.crayon-pinceau { display: none; } .edit_composant { z-index: 9000; position: absolute; display: block; height: auto; width: auto; } .editeur_composant .acs_box_texte{ padding: 0; background: #f4f4f4; border: thin outset; font-size: 10px; box-shadow: 2px 2px 5px #cfcfcf; min-height: 200px; } .editeur_composant .c_config { padding :8px; max-height:400px; min-width: 600px; overflow:auto; } .editeur_composant .select_widget { position:relative; width: 160px; } .editeur_composant .pinceau-boutons { position:relative; height: 3em; margin: 0 10px 10px; } div.acsPanel { display: none; } div.acsPanelOn { display: block; } a.acsTabOn { font-weight: bold; } .c_config table { width: auto; text-align: #LANG_RIGHT; } .c_config td { vertical-align: middle; text-align: #LANG_RIGHT; } ul.grclist { list-style: none; margin: 0; padding: 0; } .grclist li{ margin: 0; } [(#REM) Controles ] span.ctrl { position: relative; text-align: #LANG_RIGHT; vertical-align: middle; display: inline-block; margin: 1px; } span.ctrl img { vertical-align: middle; } input.acsColorCtl { float: #LANG_RIGHT; cursor: pointer; border: 0; padding: 0; width: 15px; } img.bouton_edit_composant { background: #e6f6e6; border: 2px outset #88af88; height:24px; width: 24px; padding: 2px;[ (#MODELE{c_css_border-radius}{r=4px})] } img.bouton_edit_composant:hover { background: #ffefaf; } .acsVarControleur { position: absolute; top: 0; left: 0; min-height: 34px; display: block; z-index: 9990; background: #efefdf; border : [(#GET{foncee})] 1px solid; vertical-align: middle;[ (#MODELE{c_css_border-radius}{r=0})] } div.acsVarControleur div.crayon-boutons { bottom: 2px; right: 2px; } .acsVarColorBlock { float: right; border:thin inset #000; height:10px; width:10px; margin: 1px; } [(#REM) Position de l'image signalant un chargement en ajax ].image_loading { position: absolute; } .onlinehelp { color: #GET{foncee}; cursor: default; } .onlinehelp .onlinehelplayer { font-style: normal; } .onlinehelp .triangle { vertical-align: top; cursor:pointer; } .contexthelp { z-index: 9998; #LANG_RIGHT: 0; margin: 0; margin-left: 10px; margin-right: 10px; padding: 5px; background: #fffefd; border: thin outset #GET{foncee};[ (#MODELE{c_css_border-radius}{r=5px}{sauf=top})] -webkit-box-shadow: 2px 2px 5px #dfdfdf; -moz-box-shadow: 2px 2px 5px #dfdfdf; box-shadow: 2px 2px 5px #dfdfdf; } [(#REM) liste déroulante des valeurs de variables similaires déjà définies pour d'autres instances du composant ] .acs_var_vals { position: absolute; z-index: 9995; background-color: #fff; border: thin inset #GET{foncee}; border-top: 0; overflow: auto; max-height: 200px; cursor: pointer; -webkit-box-shadow: 2px 2px 5px #dfdfdf; -moz-box-shadow: 2px 2px 5px #dfdfdf; box-shadow: 2px 2px 5px #dfdfdf; } .acs_var_vals ul { list-style: none; margin: 0; padding: 0; } .acs_var_vals li { padding-left: 5px; padding-right: 5px; } .acs_var_vals li:hover { background-color: #GET{claire}; } [(#REM) plieurs ] .acs_plieur {[ background-image: url((#CHEMIN{images/deplierhaut.gif})); background-repeat: no-repeat; background-position: 0 center;] padding-#LANG_LEFT: 15px; } .acs_plieur.plon {[ background-image: url((#CHEMIN{images/deplierbas.gif}));] } [(#REM) jQueryUI settings ] .ui-tooltip { white-space: pre-wrap; }