css

css, theming...

Modifier les CSS de corporateclean

Avec Corporateclean version 7.x-2.3 et la création manuelle du sous-thème mycorpo2 en v2.3.

Création de mystyle1.css, ajouté à mycorpo2.info (après la ligne "stylesheets[all][] = color/colors.css" : stylesheets[all][] = mystyle1.css)

Exemples simples de modif CSS drupal 7

Ckeditor: comment ajouter ses CSS perso ?

Fonctionne avec CKeditor 4.2.1 et CKeditor 7.x-1.13  +   CKEditor 7.x-1.16 (et lib ckeditor 4.4.5)

Créer ces 2 fichiers avant de configurer la partie Options avancées de admin/config/content/ckeditor/edit/Full.
Puis, configurer ACR.

Fichier attachéTaille
Fichier test.rar1.34 Ko

RWD - % placeholder selectors et @extend

Source: http://thesassway.com/intermediate/understanding-placeholder-selectors

Sass fournit un certain nombre de façons différentes de partager le code entre les règles CSS: mixins (pour insérer de nouvelles propriétés et / ou des règles CSS dans votre CSS) et  @extend pour partager des propriétés CSS entre les sélecteurs.
Sass 3.2 introduit un nouveau concept appelé "espaces réservés" qui optimise la sortie CSS de la directive @extend

  • La directive @extend : par ex .error-icon et .info-icon héritent des propriétés de .icon
  • Les sélecteurs d'espaces réservés, commencent par % et n'apparaissent pas dans le css généré
  • Comparaison de @extend  et mixins (et css généré pour le meme exemple)
  • Les limites de @extend

Media Queries

Source: http://fr.slideshare.net/ucbdrupal/bdug-responsive-webtheming20120723

CSS3 étend les fonctions des requètes médias (media queries):

  • vérification des fonctions (d'un média particulier) comme largeur, hauteur et couleur (width, height, color)
  • styles sur mesure pour des devices

règle @import : par ex   @import url(style480min.css) screen and (min-width: 480px);

Zen 7x-5.5

Update : depuis le 1er décembre, la version officielle pour dupal 7 est Zen 7.x-5.6. Pas de maj de la db à faire (update.php). Ne pas oublier de copier les modifs faites sur starterkit.

Zen 7x-5.5 a shiv HTML 5 inclus et responsive. Avec Fences (qui semble peu maintenu) il est plus facile de thémer les champs Fields et avoir du HTML 5 sémantique.

Module color (core drupal 7)

Le module color est intégré au core de drupal 7.

Il génère copie les fichiers styles du thème, les modifie et les copie sites/nom-site/files/

=> si on modifie ces feuilles de styles du thème, aller sauver à admin/appearance/settings/monsoustheme -meme si l'on n'a pas modifié les couleurs - mais pour que color regénère ces feuilles de styles.
ex: on veux modifier un color.css en sites/mon-site/files/color/theme-hdsgf/color.css?jkhg

aligner 3 div

Drupal for firebug

Pour utilisation de la partie "drupal" du plugin de Firefox (ou celui de Chrome), il faut installer ce module sur le site drupal.

Installer avec drush drush @sitet dl drupalforfirebug && drush @sitet en drupalforfirebug

Les 2 perms, Access et Execute Firebug PHP sont à admin/people/permissions#module-drupalforfirebug

d'où vient cette mise en forme ?

Identifier d'où vient cette mise en forme

css 2.1

.info liste les css perso. Syntaxe clé[propriétés media]= chemin relatif   
Un ex: stylesheets[all][]=css/colors.css   ou   stylesheets[print][]=css/print.css

Pages

S'abonner à RSS - css