progress on migrating to heex templates and font-icons
This commit is contained in:
parent
d43daafdb7
commit
3eff955672
21793 changed files with 2161968 additions and 16895 deletions
35
assets_old/css/_bs-colors.scss
Normal file
35
assets_old/css/_bs-colors.scss
Normal file
|
|
@ -0,0 +1,35 @@
|
|||
// Colors
|
||||
$primary: #662c91;
|
||||
$secondary: #ee6c4d;
|
||||
$success: #3f784c;
|
||||
$info: #3f84e5;
|
||||
$warning: #ffec51;
|
||||
$light: $gray-200;
|
||||
$dark: $gray-800;
|
||||
|
||||
// Create your own map
|
||||
$custom-colors: (
|
||||
"primary": $primary,
|
||||
"secondary": $secondary,
|
||||
"success": $success,
|
||||
"info": $info,
|
||||
"warning": $warning,
|
||||
"danger": $danger,
|
||||
"light": $light,
|
||||
"dark": $dark,
|
||||
"gray": $gray-500,
|
||||
);
|
||||
|
||||
// $custom-colors: (
|
||||
// "custom-color": #900
|
||||
// );
|
||||
|
||||
// Merge the maps
|
||||
$theme-colors: map-merge($theme-colors, $custom-colors);
|
||||
|
||||
// misc
|
||||
$navbar-dark-color: rgba($white, 0.75);
|
||||
$navbar-dark-hover-color: rgba($white, 0.9);
|
||||
$navbar-dark-active-color: $white;
|
||||
$navbar-dark-disabled-color: rgba($white, 0.45);
|
||||
$navbar-dark-toggler-border-color: rgba($white, 0.3);
|
||||
16
assets_old/css/_bs-custom.scss
Normal file
16
assets_old/css/_bs-custom.scss
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
/* Bootstrap custom variable overrides */
|
||||
|
||||
// Typography
|
||||
//
|
||||
// Font, line-height, and color for body text, headings, and more.
|
||||
|
||||
// stylelint-disable value-keyword-case
|
||||
$font-family-sans-serif: Lato, system-ui, -apple-system, "Segoe UI", Roboto,
|
||||
"Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif,
|
||||
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
|
||||
// $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas,
|
||||
// "Liberation Mono", "Courier New", monospace !important;
|
||||
|
||||
// Features
|
||||
$enable-shadows: true;
|
||||
$enable-negative-margins: true;
|
||||
50
assets_old/css/_bs-load.scss
Normal file
50
assets_old/css/_bs-load.scss
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
/* Bootstrap custom variable overrides */
|
||||
@import "bs-custom";
|
||||
|
||||
// Required || Configuration
|
||||
@import "../node_modules/bootstrap/scss/functions";
|
||||
@import "../node_modules/bootstrap/scss/variables";
|
||||
|
||||
/* Bootstrap custom variable overrides */
|
||||
@import "bs-colors";
|
||||
|
||||
// Required || Configuration -- CONTINUED
|
||||
@import "../node_modules/bootstrap/scss/mixins";
|
||||
@import "../node_modules/bootstrap/scss/utilities";
|
||||
|
||||
// Optional || Layout & components
|
||||
@import "../node_modules/bootstrap/scss/root";
|
||||
@import "../node_modules/bootstrap/scss/reboot";
|
||||
@import "../node_modules/bootstrap/scss/type";
|
||||
@import "../node_modules/bootstrap/scss/images";
|
||||
@import "../node_modules/bootstrap/scss/containers";
|
||||
@import "../node_modules/bootstrap/scss/grid";
|
||||
@import "../node_modules/bootstrap/scss/tables";
|
||||
@import "../node_modules/bootstrap/scss/forms";
|
||||
@import "../node_modules/bootstrap/scss/buttons";
|
||||
@import "../node_modules/bootstrap/scss/transitions";
|
||||
@import "../node_modules/bootstrap/scss/dropdown";
|
||||
// @import "../node_modules/bootstrap/scss/button-group";
|
||||
@import "../node_modules/bootstrap/scss/nav";
|
||||
@import "../node_modules/bootstrap/scss/navbar";
|
||||
@import "../node_modules/bootstrap/scss/card";
|
||||
@import "../node_modules/bootstrap/scss/accordion";
|
||||
// @import "../node_modules/bootstrap/scss/breadcrumb";
|
||||
@import "../node_modules/bootstrap/scss/pagination";
|
||||
@import "../node_modules/bootstrap/scss/badge";
|
||||
@import "../node_modules/bootstrap/scss/alert";
|
||||
@import "../node_modules/bootstrap/scss/progress";
|
||||
// @import "../node_modules/bootstrap/scss/list-group";
|
||||
@import "../node_modules/bootstrap/scss/close";
|
||||
// @import "../node_modules/bootstrap/scss/toasts";
|
||||
@import "../node_modules/bootstrap/scss/modal";
|
||||
// @import "../node_modules/bootstrap/scss/tooltip";
|
||||
// @import "../node_modules/bootstrap/scss/popover";
|
||||
// @import "../node_modules/bootstrap/scss/carousel";
|
||||
@import "../node_modules/bootstrap/scss/spinners";
|
||||
|
||||
// Helpers
|
||||
@import "../node_modules/bootstrap/scss/helpers";
|
||||
|
||||
// Utilities
|
||||
@import "../node_modules/bootstrap/scss/utilities/api";
|
||||
11
assets_old/css/_fonts.scss
Normal file
11
assets_old/css/_fonts.scss
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
/* Fontsource Lato */
|
||||
// @import "../node_modules/@fontsource/lato/100.css"; /* thin | normal */
|
||||
// @import "../node_modules/@fontsource/lato/100-italic.css"; /* thin | italic */
|
||||
@import "../node_modules/@fontsource/lato/300.css"; /* light | normal */
|
||||
// @import "../node_modules/@fontsource/lato/300-italic.css"; /* light | italic */
|
||||
@import "../node_modules/@fontsource/lato/400.css"; /* normal | normal */
|
||||
// @import "../node_modules/@fontsource/lato/400-italic.css"; /* normal | italic */
|
||||
@import "../node_modules/@fontsource/lato/700.css"; /* bold | normal */
|
||||
// @import "../node_modules/@fontsource/lato/700-italic.css"; /* bold | italic */
|
||||
// @import "../node_modules/@fontsource/lato/900.css"; /* black | normal */
|
||||
// @import "../node_modules/@fontsource/lato/900-italic.css"; /* black | italic */
|
||||
56
assets_old/css/_nav-burger.scss
Normal file
56
assets_old/css/_nav-burger.scss
Normal file
|
|
@ -0,0 +1,56 @@
|
|||
/* Hamburger settings overrides */
|
||||
$hamburger-padding-x: 0.95rem !default;
|
||||
$hamburger-padding-y: 0.625rem !default;
|
||||
$hamburger-layer-width: 1.5rem !default;
|
||||
$hamburger-layer-height: 2px !default;
|
||||
$hamburger-layer-spacing: 6px !default;
|
||||
// * skipping default color, using color from bootstrap instead, below
|
||||
// $hamburger-layer-color: rgba(0, 0, 0, 0.55) !default;
|
||||
$hamburger-layer-border-radius: 0.25rem !default;
|
||||
$hamburger-hover-opacity: 0.7 !default;
|
||||
// * skipping default color, using color from bootstrap instead, below
|
||||
// $hamburger-active-layer-color: $hamburger-layer-color !default;
|
||||
$hamburger-active-hover-opacity: $hamburger-hover-opacity !default;
|
||||
|
||||
/* import hamburgers sass */
|
||||
@import "../node_modules/hamburgers/_sass/hamburgers/hamburgers.scss";
|
||||
|
||||
/* correct colors to match bootstrap defaults */
|
||||
.navbar-light {
|
||||
.hamburger {
|
||||
&.navbar-toggler {
|
||||
border: 1px $navbar-light-toggler-border-color solid !important;
|
||||
.hamburger-inner {
|
||||
&,
|
||||
&::before,
|
||||
&::after {
|
||||
background-color: $navbar-light-color;
|
||||
}
|
||||
}
|
||||
&.is-active {
|
||||
.hamburger-inner::after {
|
||||
background-color: $navbar-light-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.navbar-dark {
|
||||
.hamburger {
|
||||
&.navbar-toggler {
|
||||
border: 1px $navbar-dark-toggler-border-color solid !important;
|
||||
.hamburger-inner {
|
||||
&,
|
||||
&::before,
|
||||
&::after {
|
||||
background-color: $navbar-dark-color;
|
||||
}
|
||||
}
|
||||
&.is-active {
|
||||
.hamburger-inner::after {
|
||||
background-color: $navbar-dark-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
43
assets_old/css/_phx-liveview.scss
Normal file
43
assets_old/css/_phx-liveview.scss
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
/* LiveView specific classes for your customizations */
|
||||
|
||||
/* hides the feedback field help if liveview indicates field not touched yet */
|
||||
.phx-no-feedback.invalid-feedback,
|
||||
.phx-no-feedback .invalid-feedback,
|
||||
.phx-orphaned-feedback.phx-no-feedback .invalid-feedback {
|
||||
display: none;
|
||||
}
|
||||
.phx-orphaned-feedback .invalid-feedback {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
/* sets default bootstrap form-control styles if field not touched yet */
|
||||
.phx-no-feedback .form-control.is-valid,
|
||||
.phx-no-feedback .form-control.is-invalid {
|
||||
border: $input-border-width solid $input-border-color;
|
||||
background-image: none;
|
||||
|
||||
&:focus {
|
||||
color: $input-focus-color;
|
||||
background-color: $input-focus-bg;
|
||||
border-color: $input-focus-border-color;
|
||||
outline: 0;
|
||||
@if $enable-shadows {
|
||||
@include box-shadow($input-box-shadow, $input-focus-box-shadow);
|
||||
} @else {
|
||||
// Avoid using mixin so we can pass custom focus shadow properly
|
||||
box-shadow: $input-focus-box-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.phx-click-loading {
|
||||
opacity: 0.5;
|
||||
transition: opacity 1s ease-out;
|
||||
}
|
||||
|
||||
.phx-disconnected {
|
||||
cursor: wait;
|
||||
}
|
||||
.phx-disconnected * {
|
||||
pointer-events: none;
|
||||
}
|
||||
132
assets_old/css/_s73k-calendar.scss
Normal file
132
assets_old/css/_s73k-calendar.scss
Normal file
|
|
@ -0,0 +1,132 @@
|
|||
/* calendar table rounded */
|
||||
table.table.table-calendar span.badge {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: clip;
|
||||
white-space: nowrap;
|
||||
padding-right: 0.7em;
|
||||
border-right: 0.7em solid transparent;
|
||||
margin-bottom: 0.1em;
|
||||
}
|
||||
table.table.table-calendar thead tr th,
|
||||
table.table.table-calendar tbody tr td {
|
||||
width: 2.5rem;
|
||||
max-width: 2.5rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
table.table.table-calendar tbody tr td {
|
||||
font-size: $font-size-sm;
|
||||
height: 4.1rem;
|
||||
padding: 0.2rem 0.4rem;
|
||||
@include media-breakpoint-up(sm) {
|
||||
height: 4.3rem;
|
||||
padding: 0.2rem 0.5rem;
|
||||
}
|
||||
@include media-breakpoint-up(md) {
|
||||
height: 4.7rem;
|
||||
padding: 0.2rem 0.5rem;
|
||||
}
|
||||
@include media-breakpoint-up(lg) {
|
||||
font-size: $font-size-base;
|
||||
height: 5.5rem;
|
||||
padding: 0.3rem 0.5rem;
|
||||
}
|
||||
@include media-breakpoint-up(xl) {
|
||||
height: 6.5rem;
|
||||
padding: 0.35rem 0.5rem;
|
||||
}
|
||||
@include media-breakpoint-up(xxl) {
|
||||
height: 7.5rem;
|
||||
padding: 0.4rem 0.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
table.table.table-rounded > :not(:last-child) > :last-child > * {
|
||||
border-bottom-color: $dark;
|
||||
}
|
||||
table.table.table-rounded {
|
||||
border-collapse: separate;
|
||||
border-spacing: 0;
|
||||
border-style: hidden;
|
||||
border-top-left-radius: $border-radius;
|
||||
border-top-right-radius: $border-radius;
|
||||
border-bottom-left-radius: $border-radius;
|
||||
border-bottom-right-radius: $border-radius;
|
||||
thead {
|
||||
tr {
|
||||
th {
|
||||
border-top: 1px solid $table-border-color;
|
||||
border-right: 1px solid $table-border-color;
|
||||
// border-bottom: 2px solid $dark !important;
|
||||
border-left: none;
|
||||
&:first-child {
|
||||
border-top-left-radius: $border-radius;
|
||||
border-left: 1px solid $table-border-color;
|
||||
}
|
||||
&:last-child {
|
||||
border-top-right-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
tbody {
|
||||
tr {
|
||||
td {
|
||||
border-top: none;
|
||||
border-right: 1px solid $table-border-color;
|
||||
border-bottom: 1px solid $table-border-color !important;
|
||||
border-left: none;
|
||||
&:first-child {
|
||||
border-left: 1px solid $table-border-color;
|
||||
}
|
||||
}
|
||||
&:last-child {
|
||||
td:first-child {
|
||||
border-bottom-left-radius: $border-radius;
|
||||
}
|
||||
td:last-child {
|
||||
border-bottom-right-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* selected days background triangle color */
|
||||
.bg-triangle-primary {
|
||||
background: linear-gradient(
|
||||
to bottom right,
|
||||
$primary 0%,
|
||||
$primary 50%,
|
||||
$secondary 50%,
|
||||
$secondary 100%
|
||||
);
|
||||
}
|
||||
.bg-triangle-info {
|
||||
background: linear-gradient(
|
||||
to bottom right,
|
||||
$info 0%,
|
||||
$info 50%,
|
||||
$secondary 50%,
|
||||
$secondary 100%
|
||||
);
|
||||
}
|
||||
.bg-triangle-light {
|
||||
background: linear-gradient(
|
||||
to bottom right,
|
||||
$light 0%,
|
||||
$light 50%,
|
||||
$secondary 50%,
|
||||
$secondary 100%
|
||||
);
|
||||
}
|
||||
.bg-triangle-white {
|
||||
background: linear-gradient(
|
||||
to bottom right,
|
||||
$white 0%,
|
||||
$white 50%,
|
||||
$secondary 50%,
|
||||
$secondary 100%
|
||||
);
|
||||
}
|
||||
21
assets_old/css/_svg-icons.scss
Normal file
21
assets_old/css/_svg-icons.scss
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
/*
|
||||
SVG ICON SYSTEM
|
||||
per https://blog.prototypr.io/align-svg-icons-to-text-and-say-goodbye-to-font-icons-d44b3d7b26b4
|
||||
*/
|
||||
.icon {
|
||||
display: inline-flex;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.icon svg,
|
||||
.icon img {
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
.icon.baseline svg,
|
||||
.icon img {
|
||||
top: 0.125em;
|
||||
position: relative;
|
||||
}
|
||||
78
assets_old/css/app.scss
Normal file
78
assets_old/css/app.scss
Normal file
|
|
@ -0,0 +1,78 @@
|
|||
/* Fonts */
|
||||
@import "fonts";
|
||||
|
||||
/* Load Bootstrap v5 and customizations */
|
||||
@import "bs-load";
|
||||
|
||||
/*SVG ICON SYSTEM*/
|
||||
@import "svg-icons";
|
||||
|
||||
/* LiveView specific CSS */
|
||||
@import "phx-liveview";
|
||||
|
||||
/* Navbar toggler icon override */
|
||||
@import "nav-burger";
|
||||
|
||||
/* Shift73k shift-assign calendar styling */
|
||||
@import "s73k-calendar";
|
||||
|
||||
/* extra */
|
||||
.was-validated .no-valid-style .form-check-input:valid,
|
||||
.form-check-input.is-valid {
|
||||
border-color: inherit !important;
|
||||
}
|
||||
.was-validated .no-valid-style .form-check-input:valid ~ .form-check-label,
|
||||
.no-valid-style .form-check-input.is-valid ~ .form-check-label {
|
||||
color: inherit !important;
|
||||
}
|
||||
.table-nonfluid {
|
||||
width: auto !important;
|
||||
}
|
||||
.cursor-pointer {
|
||||
cursor: pointer !important;
|
||||
}
|
||||
|
||||
/*
|
||||
icons in input fields
|
||||
*/
|
||||
/* enable absolute positioning */
|
||||
.inner-addon {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* style icon */
|
||||
.inner-addon > .icon {
|
||||
position: absolute;
|
||||
padding: 0.5625rem 0.5rem;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* align icon */
|
||||
.inner-addon > .icon.is-left {
|
||||
left: 0px;
|
||||
}
|
||||
.inner-addon > .icon.is-right {
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
/* add padding */
|
||||
.left-addon input,
|
||||
.left-addon select {
|
||||
padding-left: 2rem;
|
||||
}
|
||||
.right-addon input,
|
||||
.right-addon select {
|
||||
padding-right: 2rem;
|
||||
}
|
||||
|
||||
.shift-description p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
fix readonly form background
|
||||
*/
|
||||
.form-control[readonly] {
|
||||
background-color: $input-disabled-bg;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue