feat(main): Add base theme: This is the falcon theme out of the box.

This is falcon v3.1.2

falcon/_dev/css/listing/_index.scss

@@ -0,0 +1,2 @@
+@import "vendors/index";
+@import "components/index";

falcon/_dev/css/listing/components/_index.scss

@@ -0,0 +1,2 @@
+@import "listing-display/index";
+@import "filters/index";

falcon/_dev/css/listing/components/filters/_index.scss

@@ -0,0 +1 @@
+@import "search-filters";

falcon/_dev/css/listing/components/filters/_search-filters.scss

@@ -0,0 +1,6 @@
+.search-filters {
+  @include media-breakpoint-down(sm) {
+    border: 0;
+    border-radius: 0;
+  }
+}

falcon/_dev/css/listing/components/listing-display/_display-toggle.scss

@@ -0,0 +1,28 @@
+.display-toggle {
+
+  &__link {
+    width: 1.7em;
+    height: 1.7em;
+    font-size: rem-calc(18px);
+    line-height: 1.7em;
+    color: $gray-900;
+    text-align: center;
+    background: $gray-100;
+    border-radius: 50%;
+
+    @include hover-focus() {
+      color: $gray-900;
+      background: $gray-200;
+    }
+
+    &.active {
+      color: $white;
+      background: $primary;
+    }
+  }
+
+  &__icon {
+    font-size: inherit;
+    line-height: inherit;
+  }
+}

falcon/_dev/css/listing/components/listing-display/_index.scss

@@ -0,0 +1 @@
+@import "display-toggle";

falcon/_dev/css/listing/vendors/_index.scss

@@ -0,0 +1 @@
+@import "nouislider/index";

falcon/_dev/css/listing/vendors/nouislider/_index.scss

@@ -0,0 +1,4 @@
+@import "nouislider.vars";
+@import "nouislider.core";
+@import "nouislider.pips";
+@import "nouislider.tooltips";

falcon/_dev/css/listing/vendors/nouislider/_nouislider.core.scss

@@ -0,0 +1,161 @@
+@use "sass:math";
+
+.noUi-target,
+.noUi-target * {
+  box-sizing: border-box;
+  /* stylelint-disable */
+  touch-action: none;
+  /* stylelint-enable */
+  user-select: none;
+  -webkit-touch-callout: none;
+  -webkit-tap-highlight-color: none;
+}
+
+.noUi-base,
+.noUi-connects {
+  position: relative;
+  z-index: 1;
+  width: 100%;
+  height: 100%;
+}
+
+/* Wrapper for all connect elements.
+  */
+.noUi-connects {
+  z-index: 0;
+  overflow: hidden;
+  border-radius: $nouislider-connects-border-radius;
+}
+
+.noUi-connect,
+.noUi-origin {
+  position: absolute;
+  top: 0;
+  right: 0;
+  z-index: 1;
+  transform-origin: 0 0;
+  will-change: transform;
+  transform-style: preserve-3d;
+  transform-style: flat;
+}
+
+.noUi-connect {
+  width: 100%;
+  height: 100%;
+  background: $nouislider-connects-background-color;
+}
+
+.noUi-origin {
+  width: 10%;
+  height: 10%;
+}
+
+/* Give origins 0 height/width so they don't interfere with clicking the
+  * connect elements.
+  */
+.noUi-vertical .noUi-origin {
+  width: 0;
+}
+
+.noUi-horizontal .noUi-origin {
+  height: 0;
+}
+
+.noUi-touch-area {
+  width: 100%;
+  height: 100%;
+}
+
+.noUi-state-tap .noUi-connect,
+.noUi-state-tap .noUi-origin {
+  transition: transform 0.3s;
+}
+
+/* Offset direction
+*/
+.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin {
+  right: auto;
+  left: 0;
+}
+
+.noUi-state-drag * {
+  /* stylelint-disable */
+  cursor: inherit !important;
+  /* stylelint-enable */
+}
+
+/* Slider size and handle placement;
+  */
+.noUi-horizontal {
+  height: $nouislider-horizontal-height;
+  margin: 0 math.div($nouislider-horizontal-handler-width, 2);
+}
+
+.noUi-handle {
+  position: absolute;
+  cursor: default;
+  background: $nouislider-handle-background-color;
+  border: $nouislider-handle-border-width solid $nouislider-handle-border-color;
+  border-radius: $nouislider-handle-border-radius;
+  outline: none;
+  box-shadow: $nouislider-handle-shadow;
+  backface-visibility: hidden;
+}
+
+.noUi-horizontal .noUi-handle {
+  top: -#{math.div($nouislider-horizontal-handler-height - $nouislider-horizontal-height, 2) + $nouislider-target-border-width};
+  right: -#{math.div($nouislider-horizontal-handler-width, 2)};
+  width: $nouislider-horizontal-handler-width;
+  height: $nouislider-horizontal-handler-height;
+}
+
+.noUi-vertical {
+  width: $nouislider-vertical-width;
+  margin: math.div($nouislider-vertical-handler-height, 2) 0;
+}
+
+.noUi-vertical .noUi-handle {
+  top: -#{math.div($nouislider-vertical-handler-height, 2)};
+  right: -#{math.div($nouislider-horizontal-handler-width - $nouislider-vertical-width, 2) + $nouislider-target-border-width};
+  width: $nouislider-vertical-handler-width;
+  height: $nouislider-vertical-handler-height;
+}
+
+/* Styling;
+  * Giving the connect element a border radius causes issues with using transform: scale
+  */
+.noUi-target {
+  position: relative;
+  background: $nouislider-target-background-color;
+  border: $nouislider-target-border-width solid $nouislider-target-border-color;
+  border-radius: $nouislider-target-border-radius;
+  box-shadow: $nouislider-target-shadow;
+}
+
+/* Handles and cursors;
+  */
+.noUi-draggable {
+  cursor: ew-resize;
+}
+
+.noUi-vertical .noUi-draggable {
+  cursor: ns-resize;
+}
+
+.noUi-active {
+  background: $nouislider-handle-active-background-color;
+  box-shadow: $nouislider-handle-active-shadow;
+}
+
+/* Disabled state;
+  */
+
+[disabled] .noUi-connect {
+  background: $nouislider-connects-disabled-background-color;
+}
+
+[disabled].noUi-target,
+[disabled].noUi-handle,
+[disabled] .noUi-handle {
+  cursor: not-allowed;
+}

falcon/_dev/css/listing/vendors/nouislider/_nouislider.pips.scss

@@ -0,0 +1,110 @@
+@use "sass:math";
+
+/* Base;
+ *
+ */
+.noUi-pips,
+.noUi-pips * {
+  box-sizing: border-box;
+}
+
+.noUi-pips {
+  position: absolute;
+  color: $nouislider-pips-color;
+}
+
+/* Values;
+  *
+  */
+.noUi-value {
+  position: absolute;
+  text-align: center;
+  white-space: nowrap;
+}
+
+.noUi-value-sub {
+  font-size: $nouislider-pips-value-font-size;
+  color: $nouislider-pips-value-color;
+}
+
+/* Markings;
+  *
+  */
+.noUi-marker {
+  position: absolute;
+  background: $nouislider-marker-background-color;
+}
+
+.noUi-marker-sub {
+  background: $nouislider-marker-sub-background-color;
+}
+
+.noUi-marker-large {
+  background: $nouislider-marker-large-background-color;
+}
+
+/* Horizontal layout;
+  *
+  */
+.noUi-pips-horizontal {
+  top: 100%;
+  left: 0;
+  width: 100%;
+  height: $nouislider-pips-horizontal-height;
+  padding: $nouislider-pips-horizontal-spacing;
+}
+
+.noUi-value-horizontal {
+  transform: translate(-50%, 50%);
+
+  .noUi-rtl & {
+    transform: translate(50%, 50%);
+  }
+}
+
+.noUi-marker-horizontal.noUi-marker {
+  width: $nouislider-marker-horizontal-width;
+  height: $nouislider-marker-horizontal-height;
+  margin-left: -#{math.div($nouislider-marker-horizontal-width, 2)};
+}
+
+.noUi-marker-horizontal.noUi-marker-sub {
+  height: $nouislider-marker-sub-horizontal-height;
+}
+
+.noUi-marker-horizontal.noUi-marker-large {
+  height: $nouislider-marker-large-horizontal-height;
+}
+
+/* Vertical layout;
+  *
+  */
+.noUi-pips-vertical {
+  top: 0;
+  left: 100%;
+  height: 100%;
+  padding: $nouislider-pips-vertical-spacing;
+}
+
+.noUi-value-vertical {
+  padding-left: 25px;
+  transform: translate(0, -50%);
+
+  .noUi-rtl & {
+    transform: translate(0, 50%);
+  }
+}
+
+.noUi-marker-vertical.noUi-marker {
+  width: $nouislider-marker-vertical-width;
+  height: $nouislider-marker-vertical-height;
+  margin-top: -#{math.div($nouislider-marker-vertical-height, 2)};
+}
+
+.noUi-marker-vertical.noUi-marker-sub {
+  width: $nouislider-marker-sub-vertical-width;
+}
+
+.noUi-marker-vertical.noUi-marker-large {
+  width: $nouislider-marker-large-vertical-width;
+}

falcon/_dev/css/listing/vendors/nouislider/_nouislider.tooltips.scss

@@ -0,0 +1,37 @@
+.noUi-tooltip {
+  position: absolute;
+  display: block;
+  padding: $nouislider-tooltips-padding;
+  font-size: $nouislider-tooltips-font-size;
+  font-weight: $nouislider-tooltips-font-weight;
+  color: $nouislider-tooltips-color;
+  text-align: center;
+  white-space: nowrap;
+  background: $nouislider-tooltips-background-color;
+  border: $nouislider-tooltips-border-width solid $nouislider-tooltips-border-color;
+  border-radius: $nouislider-tooltips-border-radius;
+}
+
+.noUi-horizontal .noUi-tooltip {
+  bottom: 120%;
+  left: 50%;
+  transform: translate(-50%, 0);
+}
+
+.noUi-vertical .noUi-tooltip {
+  top: 50%;
+  right: 120%;
+  transform: translate(0, -50%);
+}
+
+.noUi-horizontal .noUi-origin > .noUi-tooltip {
+  bottom: 10px;
+  left: auto;
+  transform: translate(50%, 0);
+}
+
+.noUi-vertical .noUi-origin > .noUi-tooltip {
+  top: auto;
+  right: 28px;
+  transform: translate(0, -18px);
+}

falcon/_dev/css/listing/vendors/nouislider/_nouislider.vars.scss

@@ -0,0 +1,73 @@
+@use "sass:color";
+
+// Slider target
+$nouislider-target-border-width: 0;
+$nouislider-target-border-color: $gray-300;
+$nouislider-target-border-radius: $border-radius;
+$nouislider-target-background-color: $gray-200;
+$nouislider-target-shadow: null;
+
+// Slider handle basic styles
+$nouislider-handle-border-radius: 50%;
+$nouislider-handle-border-color: $primary;
+$nouislider-handle-border-width: 1px;
+$nouislider-handle-background-color: $primary;
+$nouislider-handle-shadow: null;
+// Slider handle active styles
+$nouislider-handle-active-shadow: null;
+$nouislider-handle-active-background-color: color.adjust($primary, $lightness: -10%);
+
+// Slider bar horizontal
+$nouislider-horizontal-height: 8px;
+$nouislider-horizontal-handler-width: 16px;
+$nouislider-horizontal-handler-height: 16px;
+
+// Slider bar vertical
+$nouislider-vertical-width: 8px;
+$nouislider-vertical-handler-width: 16px;
+$nouislider-vertical-handler-height: 16px;
+
+// Slider connect
+$nouislider-connects-background-color: color.adjust($primary, $lightness: 20%);
+$nouislider-connects-border-radius: $border-radius;
+$nouislider-connects-disabled-background-color: $gray-200;
+
+// Slider pips
+$nouislider-pips-color: #999;
+$nouislider-pips-value-color: #ccc;
+$nouislider-pips-value-font-size: 10px;
+
+// Slider pips horizontal
+$nouislider-pips-horizontal-spacing: 10px 0;
+$nouislider-pips-horizontal-height: 80px;
+
+// Slider pips vertical
+$nouislider-pips-vertical-spacing: 0 10px;
+$nouislider-pips-vertical-height: 80px;
+
+//Slider marker
+$nouislider-marker-background-color: #ccc;
+$nouislider-marker-sub-background-color: #aaa;
+$nouislider-marker-large-background-color: #aaa;
+
+//Slider marker horizontal
+$nouislider-marker-horizontal-width: 2px;
+$nouislider-marker-horizontal-height: 5px;
+$nouislider-marker-sub-horizontal-height: 10px;
+$nouislider-marker-large-horizontal-height: 15px;
+
+//Slider marker vertical
+$nouislider-marker-vertical-height: 2px;
+$nouislider-marker-vertical-width: 5px;
+$nouislider-marker-sub-vertical-width: 10px;
+$nouislider-marker-large-vertical-width: 15px;
+
+//Slider tooltips base
+$nouislider-tooltips-border-color: $border-color;
+$nouislider-tooltips-border-width: 1px;
+$nouislider-tooltips-border-radius: $border-radius;
+$nouislider-tooltips-background-color: #fff;
+$nouislider-tooltips-color: $gray-900;
+$nouislider-tooltips-padding: 1px 5px;
+$nouislider-tooltips-font-size: 12px;
+$nouislider-tooltips-font-weight: 600;