elabs 4.0.0 → 5.0.0

data/app/assets/stylesheets/elabs/lib/_license_icons.scss

@@ -0,0 +1,121 @@
+/* stylelint-disable */
+$li-agpl: "\ea01";
+$li-apache: "\ea02";
+$li-bsd: "\ea03";
+$li-cc: "\ea04";
+$li-cc-0: "\ea05";
+$li-cc-pd: "\ea06";
+$li-copyright: "\ea07";
+$li-gpl: "\ea08";
+$li-lgpl: "\ea09";
+$li-mit: "\ea0a";
+$li-mpl: "\ea0b";
+$li-whitespace: "\ea0c";
+$li-wtfpl: "\ea0d";
+
+@font-face {
+    font-family: license-icons;
+    src: font-url("elabs/license-icons/license-icons.eot");
+    src: font-url("elabs/license-icons/license-icons.eot?#iefix") format("embedded-opentype"),
+         font-url("elabs/license-icons/license-icons.woff2") format("woff2"),
+         font-url("elabs/license-icons/license-icons.woff") format("woff"),
+         font-url("elabs/license-icons/license-icons.ttf") format("truetype"),
+         font-url("elabs/license-icons/license-icons.svg#license-icons") format("svg");
+    font-style: normal;
+    font-weight: 400;
+}
+
+%li {
+    display: inline-block;
+    transform: translate(0, 0);
+    text-rendering: auto;
+    font: normal normal 400 12px/1 license-icons;
+    font-size: 1.3em;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    vertical-align: -15%;
+}
+
+.li {
+    @extend %li;
+}
+
+.li-lg {
+    vertical-align: -15%;
+    line-height: 0.75em;
+    font-size: 1.33333333em;
+}
+
+.li-2x {
+    font-size: 2em;
+}
+
+.li-3x {
+    font-size: 3em;
+}
+
+.li-4x {
+    font-size: 4em;
+}
+
+.li-5x {
+    font-size: 5em;
+}
+
+.li-fw {
+    width: 1.28571429em;
+    text-align: center;
+}
+
+.li-agpl::before {
+    content: "\ea01";
+}
+
+.li-apache::before {
+    content: "\ea02";
+}
+
+.li-bsd::before {
+    content: "\ea03";
+}
+
+.li-cc::before {
+    content: "\ea04";
+}
+
+.li-cc-0::before {
+    content: "\ea05";
+}
+
+.li-cc-pd::before {
+    content: "\ea06";
+}
+
+.li-copyright::before {
+    content: "\ea07";
+}
+
+.li-gpl::before {
+    content: "\ea08";
+}
+
+.li-lgpl::before {
+    content: "\ea09";
+}
+
+.li-mit::before {
+    content: "\ea0a";
+}
+
+.li-mpl::before {
+    content: "\ea0b";
+}
+
+.li-whitespace::before {
+    content: "\ea0c";
+}
+
+.li-wtfpl::before {
+    content: "\ea0d";
+}
+/* stylelint-enable */

data/app/assets/stylesheets/elabs/lib/fontawesome/_fontawesome.scss

@@ -22,7 +22,7 @@
 .fab {
   font-family: 'Font Awesome 5 Brands';
 }
-@import '@fortawesome/fontawesome-free/scss/variables';
+//@import '@fortawesome/fontawesome-free/scss/variables';
 @import '@fortawesome/fontawesome-free/scss/mixins';
 @import '@fortawesome/fontawesome-free/scss/core';
 @import '@fortawesome/fontawesome-free/scss/larger';

data/app/assets/stylesheets/elabs/lib/fontawesome/_fonts.scss

@@ -7,36 +7,36 @@
   font-family: 'Font Awesome 5 Free';
   font-style: normal;
   font-weight: 900;
-  src: url('#{$fa-font-path}/fa-solid-900.eot');
-  src: url('#{$fa-font-path}/fa-solid-900.eot?#iefix') format('embedded-opentype'),
-  url('#{$fa-font-path}/fa-solid-900.woff2') format('woff2'),
-  url('#{$fa-font-path}/fa-solid-900.woff') format('woff'),
-  url('#{$fa-font-path}/fa-solid-900.ttf') format('truetype'),
-  url('#{$fa-font-path}/fa-solid-900.svg#fontawesome') format('svg');
+  src: font-url('#{$fa-font-path}/FontAwesome/fa-solid-900.eot');
+  src: font-url('#{$fa-font-path}/FontAwesome/fa-solid-900.eot?#iefix') format('embedded-opentype'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-solid-900.woff2') format('woff2'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-solid-900.woff') format('woff'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-solid-900.ttf') format('truetype'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-solid-900.svg#fontawesome') format('svg');
 }
 
 @font-face {
   font-family: 'Font Awesome 5 Free';
   font-style: normal;
   font-weight: 400;
-  src: url('#{$fa-font-path}/fa-regular-400.eot');
-  src: url('#{$fa-font-path}/fa-regular-400.eot?#iefix') format('embedded-opentype'),
-  url('#{$fa-font-path}/fa-regular-400.woff2') format('woff2'),
-  url('#{$fa-font-path}/fa-regular-400.woff') format('woff'),
-  url('#{$fa-font-path}/fa-regular-400.ttf') format('truetype'),
-  url('#{$fa-font-path}/fa-regular-400.svg#fontawesome') format('svg');
+  src: font-url('#{$fa-font-path}/FontAwesome/fa-regular-400.eot');
+  src: font-url('#{$fa-font-path}/FontAwesome/fa-regular-400.eot?#iefix') format('embedded-opentype'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-regular-400.woff2') format('woff2'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-regular-400.woff') format('woff'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-regular-400.ttf') format('truetype'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-regular-400.svg#fontawesome') format('svg');
 }
 
 @font-face {
   font-family: 'Font Awesome 5 Brands';
   font-style: normal;
   font-weight: normal;
-  src: url('#{$fa-font-path}/fa-brands-400.eot');
-  src: url('#{$fa-font-path}/fa-brands-400.eot?#iefix') format('embedded-opentype'),
-  url('#{$fa-font-path}/fa-brands-400.woff2') format('woff2'),
-  url('#{$fa-font-path}/fa-brands-400.woff') format('woff'),
-  url('#{$fa-font-path}/fa-brands-400.ttf') format('truetype'),
-  url('#{$fa-font-path}/fa-brands-400.svg#fontawesome') format('svg');
+  src: font-url('#{$fa-font-path}/FontAwesome/fa-brands-400.eot');
+  src: font-url('#{$fa-font-path}/FontAwesome/fa-brands-400.eot?#iefix') format('embedded-opentype'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-brands-400.woff2') format('woff2'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-brands-400.woff') format('woff'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-brands-400.ttf') format('truetype'),
+  font-url('#{$fa-font-path}/FontAwesome/fa-brands-400.svg#fontawesome') format('svg');
 }
 
 /* stylelint-enable */

data/app/assets/stylesheets/elabs/lib/knacss/_knacss.scss

@@ -53,7 +53,7 @@
 //@import "knacss/sass/components/tabs";       // tabs styles
 //@import "knacss/sass/components/arrows";     // arrows styles
 //@import "knacss/sass/components/tags";       // tags styles
-@import "knacss/sass/components/badges";     // badges styles
+//@import "knacss/sass/components/badges";     // badges styles
 @import "knacss/sass/components/alerts";     // alerts styles
 
 /* stylelint-enable */

data/app/assets/stylesheets/elabs/lib/knacss/_knacss_variables.scss

@@ -0,0 +1,227 @@
+// NOTE:
+// Most of the Knacss vars names are used directly as variable names
+// for the application in 'variables.scss'.
+// Here are all the Knacss variables with "!default" added at the end
+// so they can be overridden.
+// Ina ddition, some of the vars here takes values from Elabs vars.
+// Config file and project variables
+
+// ----------------
+// Breakpoints zone
+// ----------------
+
+// Warning: you should use your own values, regardless of the devices
+// Best practice is Mobile First: (min-width: $breakpoint)
+$tiny        : 480px !default; // or 'em' if you prefer, of course
+$small       : 576px !default;
+$medium      : 768px !default;
+$large       : 992px !default;
+$extra-large : 1200px !default;
+
+// ----------
+// Fonts zone
+// ----------
+
+// Font families
+$font-family-base      : -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !default; // system font stack
+$font-family-headings  : sans-serif !default; // font for h1, h2.. h6
+$font-family-monospace : consolas, courier, monospace !default; // font for code and samples
+
+// Font sizes (1.6rem value is "16px" equivalent)
+$font-size-base : 1.6rem !default;
+
+$font-sizes: (
+  base: (
+    mobile  : 1.4rem,
+    desktop : $font-size-base
+  ),
+  h1: (
+    mobile  : 2.8rem,
+    desktop : 3.2rem
+  ),
+  h2: (
+    mobile  : 2.4rem,
+    desktop : 2.8rem
+  ),
+  h3: (
+    mobile  : 2.0rem,
+    desktop : 2.4rem
+  ),
+  h4: (
+    mobile  : 1.8rem,
+    desktop : 2.0rem
+  ),
+  h5: (
+    mobile  : 1.6rem,
+    desktop : 1.8rem
+  ),
+  h6: (
+    mobile  : 1.4rem,
+    desktop : 1.6rem
+  )
+) !default;
+
+// Line heights
+$line-height-s    : 1.3 !default;
+$line-height-base : 1.5 !default;
+$line-height-l    : 1.7 !default;
+
+// Default margin-bottom
+$margin-bottom-base     : 1rem !default;
+$headings-margin-bottom : $margin-bottom-base /2 !default;
+$paragraph-margin-bottom: $margin-bottom-base !default;
+
+// Font weights
+$weight-light   : 200 !default;
+$weight-book    : 300 !default;
+$weight-regular : 400 !default;
+$weight-medium  : 500 !default;
+$weight-bold    : 700 !default;
+
+// Activate hyphenation on small screens
+$hyphens: false !default;
+
+// ------------
+// Spacing zone
+// ------------
+
+// Number of grid-columns
+$cols: 12;
+
+// Grid gutters (for .has-gutter-* classes)
+$grid-gutters: (
+  '': 1rem,
+  '-l': 2rem,
+  '-xl': 4rem
+) !default;
+
+// Spacings
+$spacer-tiny             : .5rem  !default;
+$spacer-tiny-plus        : .7rem !default;
+$spacer-small            : 1rem !default;
+$spacer-small-plus       : 1.5rem !default;
+$spacer-medium           : 2rem !default;
+$spacer-medium-plus      : 3rem !default;
+$spacer-large            : 4rem !default;
+$spacer-large-plus       : 6rem !default;
+$spacer-extra-large      : 8rem !default;
+$spacer-extra-large-plus : 12rem !default;
+$spacer-ultra-large      : 16rem !default;
+$spacer-ultra-large-plus : 20rem !default;
+
+// z-indexes
+$zindex-navigation   : 1000 !default;
+$zindex-dropdown     : 2000 !default;
+$zindex-popover      : 3000 !default;
+$zindex-tooltip      : 4000 !default;
+$zindex-modal        : 5000 !default;
+$zindex-notification : 6000 !default;
+$zindex-debug        : 7000 !default;
+
+// ----------
+// Color zone
+// ----------
+
+// Color names - Overriden with Elabs vars
+$white    : $color-white;
+$gray-100 : $color-grey-100;
+$gray-200 : $color-grey-200;
+$gray-300 : $color-grey-300;
+$gray-400 : $color-grey-400;
+$gray-500 : $color-grey-500;
+$gray-600 : $color-grey-600;
+$gray-700 : $color-grey-700;
+$gray-800 : $color-grey-800;
+$gray-900 : $color-grey-900;
+$black    : $color-black;
+
+$blue-300   : $color-blue-300;
+$blue-500   : $color-blue-500;
+$green-500  : $color-green-500;
+$orange-500 : $color-orange-500;
+$red-500    : $color-red-500;
+
+// Semantic colors
+$color-brand    : $green-500 !default;
+$color-primary  : $blue-500 !default;
+$color-success  : $green-500 !default;
+$color-info     : $blue-300 !default;
+$color-warning  : $orange-500 !default;
+$color-danger   : $red-500 !default;
+$color-inverse  : $gray-800 !default;
+$color-ghost    : transparent !default;
+$color-muted    : $gray-200 !default;
+
+$color-base      : $color-base;
+$background-base : $color-background-base;
+
+$forms-color     : $form-input-color;
+
+// ---------------
+// Components zone
+// ---------------
+
+// Component: links
+$link-color            : $gray-800 !default;
+$link-color-hover      : darken($link-color, 15%) !default;
+$link-decoration       : underline !default;
+$link-decoration-hover : underline !default;
+
+// Global border-radius
+$border-radius: 0 !default;
+
+// Component: quotes
+$quote-color     : $gray-200 !default;
+
+// Component: arrows
+$arrow-color     : $black !default;
+
+// Components: checkboxes, radios, switches
+$checkbox-color: $white !default;
+$checkbox-background: $gray-800 !default;
+$checkbox-size: 2rem !default;
+$checkbox-border-radius: 4px !default;
+$radio-color: $gray-800 !default;
+$radio-background: $white !default;
+$switch-color: $white !default;
+$switch-background: $gray-800 !default;
+$switch-size: 2rem !default;
+$switch-border-radius: 3em !default;
+
+// Component: tables
+$table-border               : $gray-500 !default;
+$table-caption-color        : $gray-800 !default;
+$table-background           : transparent !default;
+$table-head-color           : $color-base !default;
+$table-head-background      : transparent !default;
+$table-footer-color         : $color-base !default;
+$table-footer-background    : transparent !default;
+
+// Components: buttons, badges, alerts color variants list
+// Convention is: name - background-color - color - border
+$variants-list: (
+  (primary,    $color-primary,    $white,    none),
+  (success,    $color-success,    $white,    none),
+  (info,       $color-info,       $black,    none),
+  (warning,    $color-warning,    $black,    none),
+  (danger,     $color-danger,     $white,    none),
+  (inverse,    $color-inverse,    $white,    none),
+  (ghost,      $color-ghost,      $white,    0 0 0 1px $white inset)
+) !default;
+
+// Component: tabs
+$tabs-border            : $gray-200 !default;
+$tabs-active-border     : $gray-800 !default;
+$tabs-color             : $color-base !default;
+$tabs-active-color      : $gray-800 !default;
+$tabs-background        : transparent !default;
+$tabs-active-background : transparent !default;
+$tabs-border-radius     : 0 !default;
+
+// Component: nav burger button
+$burger-color             : $gray-800 !default;
+$burger-background        : transparent !default;
+$burger-hover-background  : transparent !default;
+$burger-size              : 2.6rem !default;
+$burger-weight            : 5px !default; // size of stripes
+$burger-padding           : 0 !default;

data/app/assets/stylesheets/elabs/style.scss

@@ -1,83 +1,88 @@
 /* ------------------
    Elabs variables
 ------------------ */
-@import 'colors';
+@import 'fonts';
+@import 'lib/colors_reference';
+@import '@fortawesome/fontawesome-free/scss/variables';
 @import 'variables';
 
-// Mixins
-@import 'app/mixins/classifier-card';
-@import 'app/mixins/content-card';
-@import 'app/mixins/content-full';
-@import 'app/mixins/content-inline';
-@import 'app/mixins/icon';
-
 /* ------------------
    Libraries
 ------------------ */
-@import 'lib/knacss/knacss-variables';
+@import 'lib/knacss/knacss_variables';
 @import 'lib/knacss/knacss';
 @import 'lib/fontawesome/fonts';
 @import 'lib/fontawesome/fontawesome';
-@import 'lib/fontawesome/icons';
-@import 'icons';
+@import 'lib/license_icons';
+@import 'codemirror/lib/codemirror';
+@import 'codemirror/theme/base16-light';
+
+// Mixins -----------------------------
+@import 'app/mixins/classifier_card';
+@import 'app/mixins/content_card';
+@import 'app/mixins/content_full';
+@import 'app/mixins/content_inline';
+@import 'app/mixins/icon';
 
 /* ------------------
    Elabs elements
 ------------------ */
 
-// Helpers
-@import 'app/helpers';
-
-// App specific components
-@import 'app/components/cards';
-@import 'app/components/container';
-
-// App specific areas
-@import 'app/areas/devise';
+// Helpers (to be extended) -----------
+@import 'app/helpers/cards';
+@import 'app/helpers/containers';
+@import 'app/helpers/states';
+@import 'app/helpers/typo';
 
-// App specific elements
-@import 'app/acts';
-@import 'app/alerts';
-@import 'app/badges';
-@import 'app/buttons';
-@import 'app/comments';
-@import 'app/content';
-@import 'app/content_statuses';
-@import 'app/content_uploads';
-@import 'app/empty';
-@import 'app/errors';
-@import 'app/filter_links';
-@import 'app/forms';
-@import 'app/languages';
-@import 'app/layout';
-@import 'app/licenses';
-@import 'app/link-to-top';
-@import 'app/medias';
-@import 'app/modals';
-@import 'app/pagination';
-@import 'app/tables';
-@import 'app/tabs';
-@import 'app/tags';
-@import 'app/toolbars';
-@import 'app/typo';
-@import 'app/users';
+// App elements -----------------------
+@import 'app/elements/alerts';
+@import 'app/elements/badges';
+@import 'app/elements/buttons';
+@import 'app/elements/dropdowns';
+@import 'app/elements/empty';
+@import 'app/elements/errors';
+@import 'app/elements/filter_link';
+@import 'app/elements/fixed_links';
+@import 'app/elements/forms';
+@import 'app/elements/icons';
+@import 'app/elements/medias';
+@import 'app/elements/modals';
+@import 'app/elements/nsfw';
+@import 'app/elements/pagination';
+@import 'app/elements/tables';
+@import 'app/elements/tabs';
 
-// Widgets
-@import 'app/widgets/git-cards';
+// App layouts ------------------------
+@import 'app/layouts/acts';
+@import 'app/layouts/classifiers';
+@import 'app/layouts/comments';
+@import 'app/layouts/devise';
+@import 'app/layouts/layout';
+@import 'app/layouts/page';
+@import 'app/layouts/page_content';
+@import 'app/layouts/page_footer';
+@import 'app/layouts/page_header';
+@import 'app/layouts/page_menu';
+@import 'app/layouts/page_messages';
+@import 'app/layouts/private_layout';
+@import 'app/layouts/typo';
 
-// Admin zone
-@import 'app/admin-members/forms';
-@import 'app/admin-members/indexes';
-@import 'app/admin-members/layout';
+// App components ---------------------
+@import 'app/components/act';
+@import 'app/components/announcement';
+@import 'app/components/classifier_types';
+@import 'app/components/comment';
+@import 'app/components/content_relations';
+@import 'app/components/content_statuses';
+@import 'app/components/content_types';
+@import 'app/components/git_cards';
 
 // Other manually downloaded libraries
-@import 'codemirror-5.39.2/lib/codemirror';
-@import 'codemirror-5.39.2/theme/base16-light';
-@import 'highlight.js-9.12.0/styles/atelier-sulphurpool-light';
+@import 'highlight.js-9.13.1/styles/atelier-sulphurpool-light';
 
-// Overrides
+// Overrides --------------------------
 @import 'lib/codemirror';
 @import 'lib/hljs';
 
-// Fixes
+// Fixes ------------------------------
 @import 'fixes';