consul/nairobi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compile vendored CSS in a different stylesheet

Browse Source 
With this change, on my browser, reloading a page in development after
changing a CSS file is about 10%-15% faster.

On the minus side, this change results in an extra request when browsing
the page; AFAIK it isn't that big of a deal, even when the server isn't
using HTTP/2.
This commit is contained in:
Javi Martín
2024-03-24 04:26:38 +01:00
parent b6ffeeca62
commit 4646c056a7
6 changed files with 60 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/config/manifest.js
View File

@@ -4,6 +4,8 @@
//= link_tree ../images
//= link application.css
//= link application-rtl.css
//= link vendored.css
//= link vendored-rtl.css
//= link application.js
//
//= link ckeditor/config.js

12
app/assets/stylesheets/application.scss
View File

@@ -1,20 +1,8 @@
@import "amsify.suggestags";
@import "annotator.min";
@import "c3";
@import "social-share-button";
@import "font-awesome-sprockets";
@import "font-awesome/variables";
@import "font-awesome/path";
@import "font-awesome/mixins";
@import "font-awesome/core";
@import "jquery-ui/themes/base/theme";
@import "jquery-ui/themes/base/autocomplete";
@import "jquery-ui/themes/base/datepicker";
@import "jquery-ui/themes/base/sortable";
@import "leaflet/dist/leaflet";
@import "leaflet.markercluster/dist/MarkerCluster";
@import "leaflet.markercluster/dist/MarkerCluster.Default";
@import "foundation_and_overrides";
@import "fonts";
@import "icons";

40
app/assets/stylesheets/foundation_and_overrides.scss
View File

@@ -8,43 +8,3 @@
@import "foundation-sites/scss/foundation";
@import "motion-ui/motion-ui";
@include foundation-global-styles;
// @include foundation-xy-grid-classes;
@include foundation-grid;
// @include foundation-flex-grid;
// @include foundation-flex-classes;
@include foundation-typography;
@include foundation-forms;
@include foundation-button;
@include foundation-accordion;
@include foundation-accordion-menu;
@include foundation-badge;
@include foundation-breadcrumbs;
@include foundation-button-group;
@include foundation-callout;
@include foundation-card;
@include foundation-close-button;
@include foundation-menu;
@include foundation-menu-icon;
@include foundation-drilldown-menu;
@include foundation-dropdown;
@include foundation-dropdown-menu;
@include foundation-responsive-embed;
@include foundation-label;
@include foundation-media-object;
@include foundation-orbit;
@include foundation-pagination;
@include foundation-progress-bar;
@include foundation-slider;
@include foundation-sticky;
@include foundation-reveal;
@include foundation-switch;
@include foundation-table;
@include foundation-tabs;
@include foundation-thumbnail;
@include foundation-tooltip;
@include foundation-visibility-classes;
@include foundation-float-classes;
@include motion-ui-transitions;
@include motion-ui-animations;

3
app/assets/stylesheets/vendored-rtl.scss Normal file
View File

@@ -0,0 +1,3 @@
$global-text-direction: rtl;
@import "vendored";

53
app/assets/stylesheets/vendored.scss Normal file
View File

@@ -0,0 +1,53 @@
@import "amsify.suggestags";
@import "annotator.min";
@import "c3";
@import "social-share-button";
@import "jquery-ui/themes/base/theme";
@import "jquery-ui/themes/base/autocomplete";
@import "jquery-ui/themes/base/datepicker";
@import "jquery-ui/themes/base/sortable";
@import "leaflet/dist/leaflet";
@import "leaflet.markercluster/dist/MarkerCluster";
@import "leaflet.markercluster/dist/MarkerCluster.Default";
@import "foundation_and_overrides";
@include foundation-global-styles;
// @include foundation-xy-grid-classes;
@include foundation-grid;
// @include foundation-flex-grid;
// @include foundation-flex-classes;
@include foundation-typography;
@include foundation-forms;
@include foundation-button;
@include foundation-accordion;
@include foundation-accordion-menu;
@include foundation-badge;
@include foundation-breadcrumbs;
@include foundation-button-group;
@include foundation-callout;
@include foundation-card;
@include foundation-close-button;
@include foundation-menu;
@include foundation-menu-icon;
@include foundation-drilldown-menu;
@include foundation-dropdown;
@include foundation-dropdown-menu;
@include foundation-responsive-embed;
@include foundation-label;
@include foundation-media-object;
@include foundation-orbit;
@include foundation-pagination;
@include foundation-progress-bar;
@include foundation-slider;
@include foundation-sticky;
@include foundation-reveal;
@include foundation-switch;
@include foundation-table;
@include foundation-tabs;
@include foundation-thumbnail;
@include foundation-tooltip;
@include foundation-visibility-classes;
@include foundation-float-classes;
@include motion-ui-transitions;
@include motion-ui-animations;

2
app/views/layouts/_common_head.html.erb
View File

@@ -4,8 +4,10 @@
<meta name="generator" content="Zurb Foundation for Sites 6" class="foundation-mq">
<title><%= content_for?(:title) ? yield(:title) : default_title %></title>
<% if rtl? %>
<%= stylesheet_link_tag "vendored-rtl" %>
<%= stylesheet_link_tag "application-rtl" %>
<% else %>
<%= stylesheet_link_tag "vendored" %>
<%= stylesheet_link_tag "application" %>
<% end %>
<%= javascript_include_tag "application", "data-turbolinks-track" => "reload" %>