Ce fichier liste les classes CSS utilisées par ce site Eleventy. Il y a deux catégories principales:
.njk)core-styles.css, home.css)Le fichier styles.css (1.4 Mo) contient le thème complet Avada qui n'est que partiellement utilisé.
home, wp-singular, page-template, page-template-100-width, page-template-100-width-php, page, page-id-7, custom-background, wp-theme-Avada, fusion-image-hovers, fusion-pagination-sizing, fusion-button_type-flat, fusion-button_span-no, fusion-button_gradient-linear, avada-image-rollover-circle-yes, avada-image-rollover-yes, avada-image-rollover-direction-bottom, fusion-body, ltr, fusion-sticky-header, no-tablet-sticky-header, no-mobile-sticky-header, avada-has-rev-slider-styles, fusion-disable-outline, fusion-sub-menu-fade, mobile-logo-pos-left, layout-wide-mode, avada-responsive, avada-footer-fx-none, avada-menu-highlight-style-bar, fusion-search-form-classic, fusion-main-menu-search-dropdown, fusion-avatar-square, avada-dropdown-styles, avada-blog-layout-large, avada-blog-archive-layout-medium, avada-header-shadow-no, avada-menu-icon-position-left, avada-has-megamenu-shadow, avada-has-mainmenu-dropdown-divider, avada-has-breadcrumb-mobile-hidden, avada-has-titlebar-hide, avada-has-pagination-padding, avada-flyout-menu-direction-fade, avada-ec-views-v1
wrapper, fusion-wrapper, fusion-header-wrapper, fusion-header-v1, fusion-logo-alignment, fusion-logo-left, fusion-sticky-menu, fusion-sticky-logo, fusion-mobile-logo, fusion-mobile-menu-design-modern, fusion-header-sticky-height, fusion-header, fusion-row, fusion-logo, fusion-logo-link, fusion-standard-logo, fusion-main-menu, menu-main-menu, fusion-clearfix, main, width-100, content, full-width, fusion-footer, fusion-footer-widget-area, fusion-widget-area, fusion-columns, fusion-columns-2, fusion-column, col-lg-6, col-md-6, col-sm-6, fusion-footer-widget-column, widget, fusion-column-last
menu-item, menu-item-type-post_type, menu-item-object-page, menu-item-home, menu-item-has-children, fusion-megamenu-menu, fusion-caret, dropdown-arrow, sub-menu, fusion-dropdown-submenu, fusion-bar-highlight, menu-text, fusion-mobile-menu-icons, fusion-icon, mobile-menu-toggle, hamburger-icon, fusion-mobile-nav-holder, fusion-menu, menu-icon
current-menu-item, page_item, current_page_item, current-menu-ancestor, current-menu-parent, current_page_parent, current_page_ancestor
social_links, fusion-social-networks, boxed-icons, fusion-social-networks-wrapper, social-link, linkedin-link, social-icon, widget_text, textwidget, fusion-alignright, fusion-button, button-flat, button-large, button-custom, fusion-button-default, button-1, fusion-button-default-span, fusion-button-default-type, fusion-button-text, awb-button__text, awb-button__text--default
fusion-footer-copyright-area, fusion-copyright-content, fusion-copyright-notice, fusion-legal-info
contact-form-wrapper, contact-form, form-group, form-submit, contact-submit-btn, form-privacy
fusion-wrapper, fusion-body, fusion-header-wrapper, fusion-header-v1, fusion-header, fusion-row, fusion-header-sticky-height, fusion-logo-alignment, fusion-logo, fusion-logo-link, fusion-standard-logo, fusion-main-menu, fusion-menu, fusion-bar-highlight, menu-text, sub-menu, fusion-dropdown-submenu, fusion-megamenu-menu, fusion-caret, dropdown-arrow, fusion-mobile-menu-icons, mobile-menu-toggle, hamburger-icon, fusion-mobile-nav-holder, menu-icon, width-100, full-width, fusion-footer, fusion-footer-widget-area, fusion-columns, fusion-column, fusion-column-last, col-lg-6, col-md-6, col-sm-6, fusion-footer-widget-column, widget, textwidget, fusion-social-networks, fusion-social-networks-wrapper, social-link, social-icon, fusion-button, button-flat, button-large, button-custom, fusion-button-default, fusion-button-default-span, fusion-button-default-type, fusion-button-text, fusion-footer-copyright-area, fusion-copyright-content, fusion-copyright-notice, fusion-legal-info, fusion-alignright, fusion-alignleft, fusion-aligncenter, has-awb-color-4-color, has-awb-color-4-background-color, fusion-content-unboxed, fusion-section, menu-item-has-children
hero-section, hero-overlay, hero-content, about-section, container, about-grid, about-item, about-separator, about-image, content-separator, about-text, quote-section, quote-grid, quote-title, quote-content, services-section, services-content, renovation, rehabilitation, agrandissement, neuf, voirie
| Source | Taille | Classes utilisées |
|---|---|---|
| Templates (.njk) | ~100 KB HTML | ~80 classes |
| core-styles.css | 21 KB | ~60 classes |
| home.css | 9 KB | ~25 classes |
| Total CSS utile | ~30 KB | ~165 classes |
| styles.css (Avada) | 1.4 MB | ~10,000+ classes |
Oui, il y a des risques de rupture ! Le CSS utilise des sélecteurs descendants qui dépendent de classes parentes. Voici les principales dépendances identifiées dans core-styles.css :
.fusion-header-v1.fusion-logo-left .fusion-header
.fusion-logo-left .fusion-logo
.fusion-logo-left .fusion-main-menu
.fusion-mobile-nav-holder .fusion-menu
.fusion-mobile-nav-holder .menu-item
.fusion-mobile-nav-holder .menu-item a
.fusion-mobile-nav-holder .sub-menu
.fusion-main-menu .sub-menu
.fusion-footer-widget-area .fusion-columns
.fusion-footer-widget-area .fusion-columns-2 > .fusion-column
.fusion-footer-widget-area .fusion-column-last
.fusion-footer-widget-area .fusion-alignright
.fusion-footer .fusion-button-wrapper
.fusion-footer .fusion-alignright .fusion-button
.fusion-footer .widget .fusion-social-networks.boxed-icons
.fusion-footer .fusion-columns .fusion-column
.fusion-footer .textwidget
.fusion-footer-copyright-area .fusion-copyright-content
.fusion-legal-info .fusion-copyright-content
.fusion-legal-info .privacy-link
.fusion-legal-info .site-name
Conclusion : Si vous procédez au nettoyage, il FAUT conserver ces styles dépendants sinon le layout va se casser.
La bonne approche serait de :
core-styles.css en entier (~21 KB) - il contient déjà les styles optimiséshome.css en entier (~9 KB)styles.css dans le HTML (qui charge 1.4 MB inutile)Cela représente déjà une économie de ~98% sans risque de casser le design.