From 196a592c470ec956ac0dd547479685af50c28483 Mon Sep 17 00:00:00 2001 From: Neil Brommer Date: Tue, 3 May 2022 14:38:56 -0700 Subject: [PATCH] Use NPM for front-end package management and use the SASS package to compile sass files instead of requiring a global install --- Readme.md | 4 + Start/Client/Sass/Spectre/_accordions.scss | 38 -- Start/Client/Sass/Spectre/_animations.scss | 20 - Start/Client/Sass/Spectre/_asian.scss | 43 -- Start/Client/Sass/Spectre/_autocomplete.scss | 47 -- Start/Client/Sass/Spectre/_avatars.scss | 77 --- Start/Client/Sass/Spectre/_badges.scss | 60 -- Start/Client/Sass/Spectre/_bars.scss | 71 --- Start/Client/Sass/Spectre/_base.scss | 44 -- Start/Client/Sass/Spectre/_breadcrumbs.scss | 29 - Start/Client/Sass/Spectre/_buttons.scss | 193 ------ Start/Client/Sass/Spectre/_calendars.scss | 222 ------- Start/Client/Sass/Spectre/_cards.scss | 43 -- Start/Client/Sass/Spectre/_carousels.scss | 136 ----- Start/Client/Sass/Spectre/_chips.scss | 33 -- Start/Client/Sass/Spectre/_codes.scss | 31 - .../Sass/Spectre/_comparison-sliders.scss | 116 ---- Start/Client/Sass/Spectre/_dropdowns.scss | 36 -- Start/Client/Sass/Spectre/_empty.scss | 21 - Start/Client/Sass/Spectre/_filters.scss | 37 -- Start/Client/Sass/Spectre/_forms.scss | 555 ------------------ Start/Client/Sass/Spectre/_hero.scss | 22 - Start/Client/Sass/Spectre/_icons.scss | 5 - Start/Client/Sass/Spectre/_labels.scss | 34 -- Start/Client/Sass/Spectre/_layout.scss | 446 -------------- Start/Client/Sass/Spectre/_media.scss | 75 --- Start/Client/Sass/Spectre/_menus.scss | 66 --- Start/Client/Sass/Spectre/_meters.scss | 57 -- Start/Client/Sass/Spectre/_mixins.scss | 10 - Start/Client/Sass/Spectre/_modals.scss | 87 --- Start/Client/Sass/Spectre/_navbar.scss | 28 - Start/Client/Sass/Spectre/_navs.scss | 34 -- Start/Client/Sass/Spectre/_normalize.scss | 446 -------------- Start/Client/Sass/Spectre/_off-canvas.scss | 95 --- Start/Client/Sass/Spectre/_pagination.scss | 60 -- Start/Client/Sass/Spectre/_panels.scss | 23 - Start/Client/Sass/Spectre/_parallax.scss | 135 ----- Start/Client/Sass/Spectre/_popovers.scss | 65 -- Start/Client/Sass/Spectre/_progress.scss | 45 -- Start/Client/Sass/Spectre/_sliders.scss | 99 ---- Start/Client/Sass/Spectre/_steps.scss | 71 --- Start/Client/Sass/Spectre/_tables.scss | 57 -- Start/Client/Sass/Spectre/_tabs.scss | 66 --- Start/Client/Sass/Spectre/_tiles.scss | 38 -- Start/Client/Sass/Spectre/_timelines.scss | 56 -- Start/Client/Sass/Spectre/_toasts.scss | 48 -- Start/Client/Sass/Spectre/_tooltips.scss | 79 --- Start/Client/Sass/Spectre/_typography.scss | 129 ---- Start/Client/Sass/Spectre/_utilities.scss | 8 - Start/Client/Sass/Spectre/_variables.scss | 117 ---- Start/Client/Sass/Spectre/_viewer-360.scss | 34 -- .../Sass/Spectre/icons/_icons-action.scss | 315 ---------- .../Sass/Spectre/icons/_icons-core.scss | 54 -- .../Sass/Spectre/icons/_icons-navigation.scss | 127 ---- .../Sass/Spectre/icons/_icons-object.scss | 161 ----- Start/Client/Sass/Spectre/mixins/_avatar.scss | 6 - Start/Client/Sass/Spectre/mixins/_button.scss | 54 -- .../Client/Sass/Spectre/mixins/_clearfix.scss | 8 - Start/Client/Sass/Spectre/mixins/_color.scss | 27 - Start/Client/Sass/Spectre/mixins/_label.scss | 11 - .../Client/Sass/Spectre/mixins/_position.scss | 65 -- Start/Client/Sass/Spectre/mixins/_shadow.scss | 9 - Start/Client/Sass/Spectre/mixins/_text.scss | 6 - Start/Client/Sass/Spectre/mixins/_toast.scss | 5 - Start/Client/Sass/Spectre/spectre-exp.scss | 18 - Start/Client/Sass/Spectre/spectre-icons.scss | 10 - Start/Client/Sass/Spectre/spectre.scss | 49 -- .../Sass/Spectre/utilities/_colors.scss | 31 - .../Sass/Spectre/utilities/_cursors.scss | 24 - .../Sass/Spectre/utilities/_display.scss | 44 -- .../Sass/Spectre/utilities/_divider.scss | 50 -- .../Sass/Spectre/utilities/_loading.scss | 37 -- .../Sass/Spectre/utilities/_position.scss | 54 -- .../Sass/Spectre/utilities/_shapes.scss | 8 - .../Client/Sass/Spectre/utilities/_text.scss | 76 --- Start/Client/Sass/app.scss | 8 +- Start/Client/Sass/dark-mode.scss | 2 +- Start/Client/Start.Client.csproj | 32 +- Start/Client/package-lock.json | 398 +++++++++++++ Start/Client/package.json | 18 + Start/Client/wwwroot/index.html | 3 - 81 files changed, 431 insertions(+), 5670 deletions(-) delete mode 100644 Start/Client/Sass/Spectre/_accordions.scss delete mode 100644 Start/Client/Sass/Spectre/_animations.scss delete mode 100644 Start/Client/Sass/Spectre/_asian.scss delete mode 100644 Start/Client/Sass/Spectre/_autocomplete.scss delete mode 100644 Start/Client/Sass/Spectre/_avatars.scss delete mode 100644 Start/Client/Sass/Spectre/_badges.scss delete mode 100644 Start/Client/Sass/Spectre/_bars.scss delete mode 100644 Start/Client/Sass/Spectre/_base.scss delete mode 100644 Start/Client/Sass/Spectre/_breadcrumbs.scss delete mode 100644 Start/Client/Sass/Spectre/_buttons.scss delete mode 100644 Start/Client/Sass/Spectre/_calendars.scss delete mode 100644 Start/Client/Sass/Spectre/_cards.scss delete mode 100644 Start/Client/Sass/Spectre/_carousels.scss delete mode 100644 Start/Client/Sass/Spectre/_chips.scss delete mode 100644 Start/Client/Sass/Spectre/_codes.scss delete mode 100644 Start/Client/Sass/Spectre/_comparison-sliders.scss delete mode 100644 Start/Client/Sass/Spectre/_dropdowns.scss delete mode 100644 Start/Client/Sass/Spectre/_empty.scss delete mode 100644 Start/Client/Sass/Spectre/_filters.scss delete mode 100644 Start/Client/Sass/Spectre/_forms.scss delete mode 100644 Start/Client/Sass/Spectre/_hero.scss delete mode 100644 Start/Client/Sass/Spectre/_icons.scss delete mode 100644 Start/Client/Sass/Spectre/_labels.scss delete mode 100644 Start/Client/Sass/Spectre/_layout.scss delete mode 100644 Start/Client/Sass/Spectre/_media.scss delete mode 100644 Start/Client/Sass/Spectre/_menus.scss delete mode 100644 Start/Client/Sass/Spectre/_meters.scss delete mode 100644 Start/Client/Sass/Spectre/_mixins.scss delete mode 100644 Start/Client/Sass/Spectre/_modals.scss delete mode 100755 Start/Client/Sass/Spectre/_navbar.scss delete mode 100644 Start/Client/Sass/Spectre/_navs.scss delete mode 100644 Start/Client/Sass/Spectre/_normalize.scss delete mode 100644 Start/Client/Sass/Spectre/_off-canvas.scss delete mode 100644 Start/Client/Sass/Spectre/_pagination.scss delete mode 100644 Start/Client/Sass/Spectre/_panels.scss delete mode 100644 Start/Client/Sass/Spectre/_parallax.scss delete mode 100644 Start/Client/Sass/Spectre/_popovers.scss delete mode 100644 Start/Client/Sass/Spectre/_progress.scss delete mode 100644 Start/Client/Sass/Spectre/_sliders.scss delete mode 100644 Start/Client/Sass/Spectre/_steps.scss delete mode 100644 Start/Client/Sass/Spectre/_tables.scss delete mode 100644 Start/Client/Sass/Spectre/_tabs.scss delete mode 100644 Start/Client/Sass/Spectre/_tiles.scss delete mode 100644 Start/Client/Sass/Spectre/_timelines.scss delete mode 100644 Start/Client/Sass/Spectre/_toasts.scss delete mode 100644 Start/Client/Sass/Spectre/_tooltips.scss delete mode 100644 Start/Client/Sass/Spectre/_typography.scss delete mode 100644 Start/Client/Sass/Spectre/_utilities.scss delete mode 100644 Start/Client/Sass/Spectre/_variables.scss delete mode 100644 Start/Client/Sass/Spectre/_viewer-360.scss delete mode 100644 Start/Client/Sass/Spectre/icons/_icons-action.scss delete mode 100644 Start/Client/Sass/Spectre/icons/_icons-core.scss delete mode 100644 Start/Client/Sass/Spectre/icons/_icons-navigation.scss delete mode 100644 Start/Client/Sass/Spectre/icons/_icons-object.scss delete mode 100644 Start/Client/Sass/Spectre/mixins/_avatar.scss delete mode 100644 Start/Client/Sass/Spectre/mixins/_button.scss delete mode 100644 Start/Client/Sass/Spectre/mixins/_clearfix.scss delete mode 100644 Start/Client/Sass/Spectre/mixins/_color.scss delete mode 100644 Start/Client/Sass/Spectre/mixins/_label.scss delete mode 100644 Start/Client/Sass/Spectre/mixins/_position.scss delete mode 100644 Start/Client/Sass/Spectre/mixins/_shadow.scss delete mode 100644 Start/Client/Sass/Spectre/mixins/_text.scss delete mode 100644 Start/Client/Sass/Spectre/mixins/_toast.scss delete mode 100644 Start/Client/Sass/Spectre/spectre-exp.scss delete mode 100644 Start/Client/Sass/Spectre/spectre-icons.scss delete mode 100644 Start/Client/Sass/Spectre/spectre.scss delete mode 100644 Start/Client/Sass/Spectre/utilities/_colors.scss delete mode 100644 Start/Client/Sass/Spectre/utilities/_cursors.scss delete mode 100644 Start/Client/Sass/Spectre/utilities/_display.scss delete mode 100644 Start/Client/Sass/Spectre/utilities/_divider.scss delete mode 100644 Start/Client/Sass/Spectre/utilities/_loading.scss delete mode 100644 Start/Client/Sass/Spectre/utilities/_position.scss delete mode 100644 Start/Client/Sass/Spectre/utilities/_shapes.scss delete mode 100644 Start/Client/Sass/Spectre/utilities/_text.scss create mode 100644 Start/Client/package-lock.json create mode 100644 Start/Client/package.json diff --git a/Readme.md b/Readme.md index 4b48c9a..14202eb 100644 --- a/Readme.md +++ b/Readme.md @@ -3,6 +3,10 @@ This is a rewrite of my [New Tab Page project](https://github.com/NeilBrommer/NewTabPage) using [Blazor](https://dotnet.microsoft.com/apps/aspnet/web-apps/blazor). +## Requirements + +Node.js must be installed for compiling SASS files. + ## Structure - Bookmark containers (tabs along the top) diff --git a/Start/Client/Sass/Spectre/_accordions.scss b/Start/Client/Sass/Spectre/_accordions.scss deleted file mode 100644 index ee57ac0..0000000 --- a/Start/Client/Sass/Spectre/_accordions.scss +++ /dev/null @@ -1,38 +0,0 @@ -// Accordions -.accordion { - input:checked ~, - &[open] { - & .accordion-header > { - .icon:first-child { - transform: rotate(90deg); - } - } - - & .accordion-body { - max-height: 50rem; - } - } - - .accordion-header { - display: block; - padding: $unit-1 $unit-2; - - .icon { - transition: transform .25s; - } - } - - .accordion-body { - margin-bottom: $layout-spacing; - max-height: 0; - overflow: hidden; - transition: max-height .25s; - } -} - -// Remove default details marker in Webkit -summary.accordion-header { - &::-webkit-details-marker { - display: none; - } -} diff --git a/Start/Client/Sass/Spectre/_animations.scss b/Start/Client/Sass/Spectre/_animations.scss deleted file mode 100644 index e7fde1a..0000000 --- a/Start/Client/Sass/Spectre/_animations.scss +++ /dev/null @@ -1,20 +0,0 @@ -// Animations -@keyframes loading { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - } -} - -@keyframes slide-down { - 0% { - opacity: 0; - transform: translateY(-$unit-8); - } - 100% { - opacity: 1; - transform: translateY(0); - } -} diff --git a/Start/Client/Sass/Spectre/_asian.scss b/Start/Client/Sass/Spectre/_asian.scss deleted file mode 100644 index e426f39..0000000 --- a/Start/Client/Sass/Spectre/_asian.scss +++ /dev/null @@ -1,43 +0,0 @@ -// Optimized for East Asian CJK -html:lang(zh), -html:lang(zh-Hans), -.lang-zh, -.lang-zh-hans { - font-family: $cjk-zh-hans-font-family; -} - -html:lang(zh-Hant), -.lang-zh-hant { - font-family: $cjk-zh-hant-font-family; -} - -html:lang(ja), -.lang-ja { - font-family: $cjk-jp-font-family; -} - -html:lang(ko), -.lang-ko { - font-family: $cjk-ko-font-family; -} - -:lang(zh), -:lang(ja), -.lang-cjk { - ins, - u { - border-bottom: $border-width solid; - text-decoration: none; - } - - del + del, - del + s, - ins + ins, - ins + u, - s + del, - s + s, - u + ins, - u + u { - margin-left: .125em; - } -} diff --git a/Start/Client/Sass/Spectre/_autocomplete.scss b/Start/Client/Sass/Spectre/_autocomplete.scss deleted file mode 100644 index 279fa03..0000000 --- a/Start/Client/Sass/Spectre/_autocomplete.scss +++ /dev/null @@ -1,47 +0,0 @@ -// Autocomplete -.form-autocomplete { - position: relative; - - .form-autocomplete-input { - align-content: flex-start; - display: flex; - flex-wrap: wrap; - height: auto; - min-height: $unit-8; - padding: $unit-h; - - &.is-focused { - @include control-shadow(); - border-color: $primary-color; - } - - .form-input { - border-color: transparent; - box-shadow: none; - display: inline-block; - flex: 1 0 auto; - height: $unit-6; - line-height: $unit-4; - margin: $unit-h; - width: auto; - } - } - - .menu { - left: 0; - position: absolute; - top: 100%; - width: 100%; - } - - &.autocomplete-oneline { - .form-autocomplete-input { - flex-wrap: nowrap; - overflow-x: auto; - } - - .chip { - flex: 1 0 auto; - } - } -} diff --git a/Start/Client/Sass/Spectre/_avatars.scss b/Start/Client/Sass/Spectre/_avatars.scss deleted file mode 100644 index b203aa2..0000000 --- a/Start/Client/Sass/Spectre/_avatars.scss +++ /dev/null @@ -1,77 +0,0 @@ -// Avatars -.avatar { - @include avatar-base(); - background: $primary-color; - border-radius: 50%; - color: rgba($light-color, .85); - display: inline-block; - font-weight: 300; - line-height: 1.25; - margin: 0; - position: relative; - vertical-align: middle; - - &.avatar-xs { - @include avatar-base($unit-4); - } - &.avatar-sm { - @include avatar-base($unit-6); - } - &.avatar-lg { - @include avatar-base($unit-12); - } - &.avatar-xl { - @include avatar-base($unit-16); - } - - img { - border-radius: 50%; - height: 100%; - position: relative; - width: 100%; - z-index: $zindex-0; - } - - .avatar-icon, - .avatar-presence { - background: $bg-color-light; - bottom: 14.64%; - height: 50%; - padding: $border-width-lg; - position: absolute; - right: 14.64%; - transform: translate(50%, 50%); - width: 50%; - z-index: $zindex-0 + 1; - } - - .avatar-presence { - background: $gray-color; - box-shadow: 0 0 0 $border-width-lg $light-color; - border-radius: 50%; - height: .5em; - width: .5em; - - &.online { - background: $success-color; - } - - &.busy { - background: $error-color; - } - - &.away { - background: $warning-color; - } - } - - &[data-initial]::before { - color: currentColor; - content: attr(data-initial); - left: 50%; - position: absolute; - top: 50%; - transform: translate(-50%, -50%); - z-index: $zindex-0; - } -} \ No newline at end of file diff --git a/Start/Client/Sass/Spectre/_badges.scss b/Start/Client/Sass/Spectre/_badges.scss deleted file mode 100644 index d67f6d1..0000000 --- a/Start/Client/Sass/Spectre/_badges.scss +++ /dev/null @@ -1,60 +0,0 @@ -// Badges -.badge { - position: relative; - white-space: nowrap; - - &[data-badge], - &:not([data-badge]) { - &::after { - background: $primary-color; - background-clip: padding-box; - border-radius: .5rem; - box-shadow: 0 0 0 .1rem $bg-color-light; - color: $light-color; - content: attr(data-badge); - display: inline-block; - transform: translate(-.05rem, -.5rem); - } - } - &[data-badge] { - &::after { - font-size: $font-size-sm; - height: .9rem; - line-height: 1; - min-width: .9rem; - padding: .1rem .2rem; - text-align: center; - white-space: nowrap; - } - } - &:not([data-badge]), - &[data-badge=""] { - &::after { - height: 6px; - min-width: 6px; - padding: 0; - width: 6px; - } - } - - // Badges for Buttons - &.btn { - &::after { - position: absolute; - top: 0; - right: 0; - transform: translate(50%, -50%); - } - } - - // Badges for Avatars - &.avatar { - &::after { - position: absolute; - top: 14.64%; - right: 14.64%; - transform: translate(50%, -50%); - z-index: $zindex-1; - } - } -} diff --git a/Start/Client/Sass/Spectre/_bars.scss b/Start/Client/Sass/Spectre/_bars.scss deleted file mode 100644 index 47e21c9..0000000 --- a/Start/Client/Sass/Spectre/_bars.scss +++ /dev/null @@ -1,71 +0,0 @@ -// Bars -.bar { - background: $bg-color-dark; - border-radius: $border-radius; - display: flex; - flex-wrap: nowrap; - height: $unit-4; - width: 100%; - - &.bar-sm { - height: $unit-1; - } - - // TODO: attr() support - .bar-item { - background: $primary-color; - color: $light-color; - display: block; - font-size: $font-size-sm; - flex-shrink: 0; - line-height: $unit-4; - height: 100%; - position: relative; - text-align: center; - width: 0; - - &:first-child { - border-bottom-left-radius: $border-radius; - border-top-left-radius: $border-radius; - } - &:last-child { - border-bottom-right-radius: $border-radius; - border-top-right-radius: $border-radius; - flex-shrink: 1; - } - } -} - -// Slider bar -.bar-slider { - height: $border-width-lg; - margin: $layout-spacing 0; - position: relative; - - .bar-item { - left: 0; - padding: 0; - position: absolute; - &:not(:last-child):first-child { - background: $bg-color-dark; - z-index: $zindex-0; - } - } - - .bar-slider-btn { - background: $primary-color; - border: 0; - border-radius: 50%; - height: $unit-3; - padding: 0; - position: absolute; - right: 0; - top: 50%; - transform: translate(50%, -50%); - width: $unit-3; - - &:active { - box-shadow: 0 0 0 .1rem $primary-color; - } - } -} diff --git a/Start/Client/Sass/Spectre/_base.scss b/Start/Client/Sass/Spectre/_base.scss deleted file mode 100644 index 4e01b20..0000000 --- a/Start/Client/Sass/Spectre/_base.scss +++ /dev/null @@ -1,44 +0,0 @@ -// Base -*, -*::before, -*::after { - box-sizing: inherit; -} - -html { - box-sizing: border-box; - font-size: $html-font-size; - line-height: $html-line-height; - -webkit-tap-highlight-color: transparent; -} - -body { - background: $body-bg; - color: $body-font-color; - font-family: $body-font-family; - font-size: $font-size; - overflow-x: hidden; - text-rendering: optimizeLegibility; -} - -a { - color: $link-color; - outline: none; - text-decoration: none; - - &:focus { - @include control-shadow(); - } - - &:focus, - &:hover, - &:active, - &.active { - color: $link-color-dark; - text-decoration: underline; - } - - &:visited { - color: $link-color-light; - } -} diff --git a/Start/Client/Sass/Spectre/_breadcrumbs.scss b/Start/Client/Sass/Spectre/_breadcrumbs.scss deleted file mode 100644 index 6a5af31..0000000 --- a/Start/Client/Sass/Spectre/_breadcrumbs.scss +++ /dev/null @@ -1,29 +0,0 @@ -// Breadcrumbs -.breadcrumb { - list-style: none; - margin: $unit-1 0; - padding: $unit-1 0; - - .breadcrumb-item { - color: $gray-color-dark; - display: inline-block; - margin: 0; - padding: $unit-1 0; - - &:not(:last-child) { - margin-right: $unit-1; - - a { - color: $gray-color-dark; - } - } - - &:not(:first-child) { - &::before { - color: $gray-color-dark; - content: "/"; - padding-right: $unit-2; - } - } - } -} diff --git a/Start/Client/Sass/Spectre/_buttons.scss b/Start/Client/Sass/Spectre/_buttons.scss deleted file mode 100644 index 9158f0f..0000000 --- a/Start/Client/Sass/Spectre/_buttons.scss +++ /dev/null @@ -1,193 +0,0 @@ -// Buttons -.btn { - appearance: none; - background: $bg-color-light; - border: $border-width solid $primary-color; - border-radius: $border-radius; - color: $primary-color; - cursor: pointer; - display: inline-block; - font-size: $font-size; - height: $control-size; - line-height: $line-height; - outline: none; - padding: $control-padding-y $control-padding-x; - text-align: center; - text-decoration: none; - transition: background .2s, border .2s, box-shadow .2s, color .2s; - user-select: none; - vertical-align: middle; - white-space: nowrap; - &:focus { - @include control-shadow(); - } - &:focus, - &:hover { - background: $secondary-color; - border-color: $primary-color-dark; - text-decoration: none; - } - &:active, - &.active { - background: $primary-color-dark; - border-color: darken($primary-color-dark, 5%); - color: $light-color; - text-decoration: none; - &.loading { - &::after { - border-bottom-color: $light-color; - border-left-color: $light-color; - } - } - } - &[disabled], - &:disabled, - &.disabled { - cursor: default; - opacity: .5; - pointer-events: none; - } - - // Button Primary - &.btn-primary { - background: $primary-color; - border-color: $primary-color-dark; - color: $light-color; - &:focus, - &:hover { - background: darken($primary-color-dark, 2%); - border-color: darken($primary-color-dark, 5%); - color: $light-color; - } - &:active, - &.active { - background: darken($primary-color-dark, 4%); - border-color: darken($primary-color-dark, 7%); - color: $light-color; - } - &.loading { - &::after { - border-bottom-color: $light-color; - border-left-color: $light-color; - } - } - } - - // Button Colors - &.btn-success { - @include button-variant($success-color); - } - - &.btn-error { - @include button-variant($error-color); - } - - // Button Link - &.btn-link { - background: transparent; - border-color: transparent; - color: $link-color; - &:focus, - &:hover, - &:active, - &.active { - color: $link-color-dark; - } - } - - // Button Sizes - &.btn-sm { - font-size: $font-size-sm; - height: $control-size-sm; - padding: $control-padding-y-sm $control-padding-x-sm; - } - - &.btn-lg { - font-size: $font-size-lg; - height: $control-size-lg; - padding: $control-padding-y-lg $control-padding-x-lg; - } - - // Button Block - &.btn-block { - display: block; - width: 100%; - } - - // Button Action - &.btn-action { - width: $control-size; - padding-left: 0; - padding-right: 0; - - &.btn-sm { - width: $control-size-sm; - } - - &.btn-lg { - width: $control-size-lg; - } - } - - // Button Clear - &.btn-clear { - background: transparent; - border: 0; - color: currentColor; - height: $unit-5; - line-height: $unit-4; - margin-left: $unit-1; - margin-right: -2px; - opacity: 1; - padding: $unit-h; - text-decoration: none; - width: $unit-5; - - &:focus, - &:hover { - background: rgba($bg-color, .5); - opacity: .95; - } - - &::before { - content: "\2715"; - } - } -} - -// Button groups -.btn-group { - display: inline-flex; - flex-wrap: wrap; - - .btn { - flex: 1 0 auto; - &:first-child:not(:last-child) { - border-bottom-right-radius: 0; - border-top-right-radius: 0; - } - &:not(:first-child):not(:last-child) { - border-radius: 0; - margin-left: -$border-width; - } - &:last-child:not(:first-child) { - border-bottom-left-radius: 0; - border-top-left-radius: 0; - margin-left: -$border-width; - } - &:focus, - &:hover, - &:active, - &.active { - z-index: $zindex-0; - } - } - - &.btn-group-block { - display: flex; - - .btn { - flex: 1 0 0; - } - } -} diff --git a/Start/Client/Sass/Spectre/_calendars.scss b/Start/Client/Sass/Spectre/_calendars.scss deleted file mode 100644 index 1e9fd15..0000000 --- a/Start/Client/Sass/Spectre/_calendars.scss +++ /dev/null @@ -1,222 +0,0 @@ -// Calendars -.calendar { - border: $border-width solid $border-color; - border-radius: $border-radius; - display: block; - min-width: 280px; - - .calendar-nav { - align-items: center; - background: $bg-color; - border-top-left-radius: $border-radius; - border-top-right-radius: $border-radius; - display: flex; - font-size: $font-size-lg; - padding: $layout-spacing; - } - - .calendar-header, - .calendar-body { - display: flex; - flex-wrap: wrap; - justify-content: center; - padding: $layout-spacing 0; - - .calendar-date { - flex: 0 0 14.28%; // 7 calendar-items each row - max-width: 14.28%; - } - } - - .calendar-header { - background: $bg-color; - border-bottom: $border-width solid $border-color; - color: $gray-color; - font-size: $font-size-sm; - text-align: center; - } - - .calendar-body { - color: $gray-color-dark; - } - - .calendar-date { - border: 0; - padding: $unit-1; - - .date-item { - appearance: none; - background: transparent; - border: $border-width solid transparent; - border-radius: 50%; - color: $gray-color-dark; - cursor: pointer; - font-size: $font-size-sm; - height: $unit-7; - line-height: $unit-5; - outline: none; - padding: $unit-h; - position: relative; - text-align: center; - text-decoration: none; - transition: background .2s, border .2s, box-shadow .2s, color .2s; - vertical-align: middle; - white-space: nowrap; - width: $unit-7; - - &.date-today { - border-color: $secondary-color-dark; - color: $primary-color; - } - - &:focus { - @include control-shadow(); - } - - &:focus, - &:hover { - background: $secondary-color-light; - border-color: $secondary-color-dark; - color: $primary-color; - text-decoration: none; - } - &:active, - &.active { - background: $primary-color-dark; - border-color: darken($primary-color-dark, 5%); - color: $light-color; - } - - // Calendar badge support - &.badge { - &::after { - position: absolute; - top: 3px; - right: 3px; - transform: translate(50%, -50%); - } - } - } - - .date-item, - .calendar-event { - &:disabled, - &.disabled { - cursor: default; - opacity: .25; - pointer-events: none; - } - } - - &.prev-month, - &.next-month { - .date-item, - .calendar-event { - opacity: .25; - } - } - } - - .calendar-range { - position: relative; - - &::before { - background: $secondary-color; - content: ""; - height: $unit-7; - left: 0; - position: absolute; - right: 0; - top: 50%; - transform: translateY(-50%); - } - &.range-start { - &::before { - left: 50%; - } - } - &.range-end { - &::before { - right: 50%; - } - } - - &.range-start, - &.range-end { - .date-item { - background: $primary-color-dark; - border-color: darken($primary-color-dark, 5%); - color: $light-color; - } - } - - .date-item { - color: $primary-color; - } - } - - // Calendars size - &.calendar-lg { - .calendar-body { - padding: 0; - - .calendar-date { - border-bottom: $border-width solid $border-color; - border-right: $border-width solid $border-color; - display: flex; - flex-direction: column; - height: 5.5rem; - padding: 0; - - &:nth-child(7n) { - border-right: 0; - } - &:nth-last-child(-n+7) { - border-bottom: 0; - } - } - } - - .date-item { - align-self: flex-end; - height: $unit-7; - margin-right: $layout-spacing-sm; - margin-top: $layout-spacing-sm; - } - - .calendar-range { - &::before { - top: 19px; - } - &.range-start { - &::before { - left: auto; - width: 19px; - } - } - &.range-end { - &::before { - right: 19px; - } - } - } - - .calendar-events { - flex-grow: 1; - line-height: 1; - overflow-y: auto; - padding: $layout-spacing-sm; - } - - .calendar-event { - border-radius: $border-radius; - font-size: $font-size-sm; - display: block; - margin: $unit-h auto; - overflow: hidden; - padding: 3px 4px; - text-overflow: ellipsis; - white-space: nowrap; - } - } -} diff --git a/Start/Client/Sass/Spectre/_cards.scss b/Start/Client/Sass/Spectre/_cards.scss deleted file mode 100644 index 6b712e1..0000000 --- a/Start/Client/Sass/Spectre/_cards.scss +++ /dev/null @@ -1,43 +0,0 @@ -// Cards -.card { - background: $bg-color-light; - border: $border-width solid $border-color; - border-radius: $border-radius; - display: flex; - flex-direction: column; - - .card-header, - .card-body, - .card-footer { - padding: $layout-spacing-lg; - padding-bottom: 0; - - &:last-child { - padding-bottom: $layout-spacing-lg; - } - } - - .card-body { - flex: 1 1 auto; - } - - .card-image { - padding-top: $layout-spacing-lg; - - &:first-child { - padding-top: 0; - - img { - border-top-left-radius: $border-radius; - border-top-right-radius: $border-radius; - } - } - - &:last-child { - img { - border-bottom-left-radius: $border-radius; - border-bottom-right-radius: $border-radius; - } - } - } -} diff --git a/Start/Client/Sass/Spectre/_carousels.scss b/Start/Client/Sass/Spectre/_carousels.scss deleted file mode 100644 index 66dc51b..0000000 --- a/Start/Client/Sass/Spectre/_carousels.scss +++ /dev/null @@ -1,136 +0,0 @@ -// Carousels -// The number of carousel images -$carousel-number: 8; - -%carousel-image-checked { - animation: carousel-slidein .75s ease-in-out 1; - opacity: 1; - z-index: $zindex-1; -} - -%carousel-nav-checked { - color: $gray-color-light; -} - -.carousel { - background: $bg-color; - display: block; - overflow: hidden; - position: relative; - width: 100%; - -webkit-overflow-scrolling: touch; - z-index: $zindex-0; - - .carousel-container { - height: 100%; - left: 0; - position: relative; - &::before { - content: ""; - display: block; - padding-bottom: 56.25%; - } - - .carousel-item { - animation: carousel-slideout 1s ease-in-out 1; - height: 100%; - left: 0; - margin: 0; - opacity: 0; - position: absolute; - top: 0; - width: 100%; - - &:hover { - .item-prev, - .item-next { - opacity: 1; - } - } - } - - .item-prev, - .item-next { - background: rgba($gray-color-light, .25); - border-color: rgba($gray-color-light, .5); - color: $gray-color-light; - opacity: 0; - position: absolute; - top: 50%; - transition: all .4s; - transform: translateY(-50%); - z-index: $zindex-1; - } - .item-prev { - left: 1rem; - } - .item-next { - right: 1rem; - } - } - - .carousel-locator { - @for $i from 1 through ($carousel-number) { - &:nth-of-type(#{$i}):checked ~ .carousel-container .carousel-item:nth-of-type(#{$i}) { - @extend %carousel-image-checked; - } - } - - @for $i from 1 through ($carousel-number) { - &:nth-of-type(#{$i}):checked ~ .carousel-nav .nav-item:nth-of-type(#{$i}) { - @extend %carousel-nav-checked; - } - } - } - - .carousel-nav { - bottom: $layout-spacing; - display: flex; - justify-content: center; - left: 50%; - position: absolute; - transform: translateX(-50%); - width: 10rem; - z-index: $zindex-1; - - .nav-item { - color: rgba($gray-color-light, .5); - display: block; - flex: 1 0 auto; - height: $unit-8; - margin: $unit-1; - max-width: 2.5rem; - position: relative; - - &::before { - background: currentColor; - content: ""; - display: block; - height: $unit-h; - position: absolute; - top: .5rem; - width: 100%; - } - } - } -} - -@keyframes carousel-slidein { - 0% { - transform: translateX(100%); - } - 100% { - transform: translateX(0); - } -} - -@keyframes carousel-slideout { - 0% { - opacity: 1; - transform: translateX(0); - } - 100% { - opacity: 1; - transform: translateX(-50%); - } -} diff --git a/Start/Client/Sass/Spectre/_chips.scss b/Start/Client/Sass/Spectre/_chips.scss deleted file mode 100644 index 6729c56..0000000 --- a/Start/Client/Sass/Spectre/_chips.scss +++ /dev/null @@ -1,33 +0,0 @@ -// Chips -.chip { - align-items: center; - background: $bg-color-dark; - border-radius: 5rem; - display: inline-flex; - font-size: 90%; - height: $unit-6; - line-height: $unit-4; - margin: $unit-h; - max-width: $control-width-sm; - overflow: hidden; - padding: $unit-1 $unit-2; - text-decoration: none; - text-overflow: ellipsis; - vertical-align: middle; - white-space: nowrap; - - &.active { - background: $primary-color; - color: $light-color; - } - - .avatar { - margin-left: -$unit-2; - margin-right: $unit-1; - } - - .btn-clear { - border-radius: 50%; - transform: scale(.75); - } -} diff --git a/Start/Client/Sass/Spectre/_codes.scss b/Start/Client/Sass/Spectre/_codes.scss deleted file mode 100644 index 817452b..0000000 --- a/Start/Client/Sass/Spectre/_codes.scss +++ /dev/null @@ -1,31 +0,0 @@ -// Codes -code { - @include label-base(); - @include label-variant($code-color, lighten($code-color, 42.5%)); - font-size: 85%; -} - -.code { - border-radius: $border-radius; - color: $body-font-color; - position: relative; - - &::before { - color: $gray-color; - content: attr(data-lang); - font-size: $font-size-sm; - position: absolute; - right: $layout-spacing; - top: $unit-h; - } - - code { - background: $bg-color; - color: inherit; - display: block; - line-height: 1.5; - overflow-x: auto; - padding: 1rem; - width: 100%; - } -} diff --git a/Start/Client/Sass/Spectre/_comparison-sliders.scss b/Start/Client/Sass/Spectre/_comparison-sliders.scss deleted file mode 100644 index ec3609b..0000000 --- a/Start/Client/Sass/Spectre/_comparison-sliders.scss +++ /dev/null @@ -1,116 +0,0 @@ -// Image comparison slider -// Credit: http://codepen.io/solipsistacp/pen/Gpmaq -.comparison-slider { - height: 50vh; - overflow: hidden; - position: relative; - width: 100%; - -webkit-overflow-scrolling: touch; - - .comparison-before, - .comparison-after { - height: 100%; - left: 0; - margin: 0; - overflow: hidden; - position: absolute; - top: 0; - - img { - height: 100%; - object-fit: cover; - object-position: left center; - position: absolute; - width: 100%; - } - } - - .comparison-before { - width: 100%; - z-index: 1; - - .comparison-label { - right: $unit-4; - } - } - - .comparison-after { - max-width: 100%; - min-width: 0; - z-index: 2; - - &::before { - background: transparent; - content: ""; - cursor: default; - height: 100%; - left: 0; - position: absolute; - right: $unit-4; - top: 0; - z-index: $zindex-0; - } - - &::after { - background: currentColor; - border-radius: 50%; - box-shadow: 0 -5px, 0 5px; - color: $light-color; - content: ""; - height: 3px; - pointer-events: none; - position: absolute; - right: $unit-2; - top: 50%; - transform: translate(50%, -50%); - width: 3px; - } - - .comparison-label { - left: $unit-4; - } - } - - .comparison-resizer { - animation: first-run 1.5s 1 ease-in-out; - cursor: ew-resize; - height: $unit-4; - left: 0; - max-width: 100%; - min-width: $unit-4; - opacity: 0; - outline: none; - position: relative; - resize: horizontal; - top: 50%; - transform: translateY(-50%) scaleY(30); - width: 0; - } - - .comparison-label { - background: rgba($dark-color, .5); - bottom: $unit-4; - color: $light-color; - padding: $unit-1 $unit-2; - position: absolute; - user-select: none; - } -} - -@keyframes first-run { - 0% { - width: 0; - } - 25% { - width: $unit-12; - } - 50% { - width: $unit-4; - } - 75% { - width: $unit-6; - } - 100% { - width: 0; - } -} diff --git a/Start/Client/Sass/Spectre/_dropdowns.scss b/Start/Client/Sass/Spectre/_dropdowns.scss deleted file mode 100644 index 324440b..0000000 --- a/Start/Client/Sass/Spectre/_dropdowns.scss +++ /dev/null @@ -1,36 +0,0 @@ -// Dropdown -.dropdown { - display: inline-block; - position: relative; - - .menu { - animation: slide-down .15s ease 1; - display: none; - left: 0; - max-height: 50vh; - overflow-y: auto; - position: absolute; - top: 100%; - } - - &.dropdown-right { - .menu { - left: auto; - right: 0; - } - } - - &.active .menu, - .dropdown-toggle:focus + .menu, - .menu:hover { - display: block; - } - - // Fix dropdown-toggle border radius in button groups - .btn-group { - .dropdown-toggle:nth-last-child(2) { - border-bottom-right-radius: $border-radius; - border-top-right-radius: $border-radius; - } - } -} diff --git a/Start/Client/Sass/Spectre/_empty.scss b/Start/Client/Sass/Spectre/_empty.scss deleted file mode 100644 index accba9c..0000000 --- a/Start/Client/Sass/Spectre/_empty.scss +++ /dev/null @@ -1,21 +0,0 @@ -// Empty states (or Blank slates) -.empty { - background: $bg-color; - border-radius: $border-radius; - color: $gray-color-dark; - text-align: center; - padding: $unit-16 $unit-8; - - .empty-icon { - margin-bottom: $layout-spacing-lg; - } - - .empty-title, - .empty-subtitle { - margin: $layout-spacing auto; - } - - .empty-action { - margin-top: $layout-spacing-lg; - } -} diff --git a/Start/Client/Sass/Spectre/_filters.scss b/Start/Client/Sass/Spectre/_filters.scss deleted file mode 100644 index 37ccc89..0000000 --- a/Start/Client/Sass/Spectre/_filters.scss +++ /dev/null @@ -1,37 +0,0 @@ -// Filters -// The number of filter options -$filter-number: 8 !default; - -%filter-checked-nav { - background: $primary-color; - color: $light-color; -} - -%filter-checked-body { - display: none; -} - -.filter { - .filter-nav { - margin: $layout-spacing 0; - } - - .filter-body { - display: flex; - flex-wrap: wrap; - } - - .filter-tag { - @for $i from 0 through ($filter-number) { - &#tag-#{$i}:checked ~ .filter-nav .chip[for="tag-#{$i}"] { - @extend %filter-checked-nav; - } - } - - @for $i from 1 through ($filter-number) { - &#tag-#{$i}:checked ~ .filter-body .filter-item:not([data-tag~="tag-#{$i}"]) { - @extend %filter-checked-body; - } - } - } -} diff --git a/Start/Client/Sass/Spectre/_forms.scss b/Start/Client/Sass/Spectre/_forms.scss deleted file mode 100644 index 20a6b4f..0000000 --- a/Start/Client/Sass/Spectre/_forms.scss +++ /dev/null @@ -1,555 +0,0 @@ -// Forms -.form-group { - &:not(:last-child) { - margin-bottom: $layout-spacing; - } -} - -fieldset { - margin-bottom: $layout-spacing-lg; -} - -legend { - font-size: $font-size-lg; - font-weight: 500; - margin-bottom: $layout-spacing-lg; -} - -// Form element: Label -.form-label { - display: block; - line-height: $line-height; - padding: $control-padding-y + $border-width 0; - - &.label-sm { - font-size: $font-size-sm; - padding: $control-padding-y-sm + $border-width 0; - } - - &.label-lg { - font-size: $font-size-lg; - padding: $control-padding-y-lg + $border-width 0; - } -} - -// Form element: Input -.form-input { - appearance: none; - background: $bg-color-light; - background-image: none; - border: $border-width solid $border-color-dark; - border-radius: $border-radius; - color: $body-font-color; - display: block; - font-size: $font-size; - height: $control-size; - line-height: $line-height; - max-width: 100%; - outline: none; - padding: $control-padding-y $control-padding-x; - position: relative; - transition: background .2s, border .2s, box-shadow .2s, color .2s; - width: 100%; - &:focus { - @include control-shadow(); - border-color: $primary-color; - } - &::placeholder { - color: $gray-color; - } - - // Input sizes - &.input-sm { - font-size: $font-size-sm; - height: $control-size-sm; - padding: $control-padding-y-sm $control-padding-x-sm; - } - - &.input-lg { - font-size: $font-size-lg; - height: $control-size-lg; - padding: $control-padding-y-lg $control-padding-x-lg; - } - - &.input-inline { - display: inline-block; - vertical-align: middle; - width: auto; - } - - // Input types - &[type="file"] { - height: auto; - } -} - -// Form element: Textarea -textarea.form-input { - &, - &.input-lg, - &.input-sm { - height: auto; - } -} - -// Form element: Input hint -.form-input-hint { - color: $gray-color; - font-size: $font-size-sm; - margin-top: $unit-1; - - .has-success &, - .is-success + & { - color: $success-color; - } - - .has-error &, - .is-error + & { - color: $error-color; - } -} - -// Form element: Select -.form-select { - appearance: none; - border: $border-width solid $border-color-dark; - border-radius: $border-radius; - color: inherit; - font-size: $font-size; - height: $control-size; - line-height: $line-height; - outline: none; - padding: $control-padding-y $control-padding-x; - vertical-align: middle; - width: 100%; - background: $bg-color-light; - &:focus { - @include control-shadow(); - border-color: $primary-color; - } - &::-ms-expand { - display: none; - } - - // Select sizes - &.select-sm { - font-size: $font-size-sm; - height: $control-size-sm; - padding: $control-padding-y-sm ($control-icon-size + $control-padding-x-sm) $control-padding-y-sm $control-padding-x-sm; - } - - &.select-lg { - font-size: $font-size-lg; - height: $control-size-lg; - padding: $control-padding-y-lg ($control-icon-size + $control-padding-x-lg) $control-padding-y-lg $control-padding-x-lg; - } - - // Multiple select - &[size], - &[multiple] { - height: auto; - padding: $control-padding-y $control-padding-x; - - option { - padding: $unit-h $unit-1; - } - } - &:not([multiple]):not([size]) { - background: $bg-color-light url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center / .4rem .5rem; - padding-right: $control-icon-size + $control-padding-x; - } -} - -// Form Icons -.has-icon-left, -.has-icon-right { - position: relative; - - .form-icon { - height: $control-icon-size; - margin: 0 $control-padding-y; - position: absolute; - top: 50%; - transform: translateY(-50%); - width: $control-icon-size; - z-index: $zindex-0 + 1; - } -} - -.has-icon-left { - .form-icon { - left: $border-width; - } - - .form-input { - padding-left: $control-icon-size + $control-padding-y * 2; - } -} - -.has-icon-right { - .form-icon { - right: $border-width; - } - - .form-input { - padding-right: $control-icon-size + $control-padding-y * 2; - } -} - -// Form element: Checkbox and Radio -.form-checkbox, -.form-radio, -.form-switch { - display: block; - line-height: $line-height; - margin: ($control-size - $control-size-sm) / 2 0; - min-height: $control-size-sm; - padding: (($control-size-sm - $line-height) / 2) $control-padding-x (($control-size-sm - $line-height) / 2) ($control-icon-size + $control-padding-x); - position: relative; - - input { - clip: rect(0, 0, 0, 0); - height: 1px; - margin: -1px; - overflow: hidden; - position: absolute; - width: 1px; - &:focus + .form-icon { - @include control-shadow(); - border-color: $primary-color; - } - &:checked + .form-icon { - background: $primary-color; - border-color: $primary-color; - } - } - - .form-icon { - border: $border-width solid $border-color-dark; - cursor: pointer; - display: inline-block; - position: absolute; - transition: background .2s, border .2s, box-shadow .2s, color .2s; - } - - // Input checkbox, radio and switch sizes - &.input-sm { - font-size: $font-size-sm; - margin: 0; - } - - &.input-lg { - font-size: $font-size-lg; - margin: ($control-size-lg - $control-size-sm) / 2 0; - } -} - -.form-checkbox, -.form-radio { - .form-icon { - background: $bg-color-light; - height: $control-icon-size; - left: 0; - top: ($control-size-sm - $control-icon-size) / 2; - width: $control-icon-size; - } - - input { - &:active + .form-icon { - background: $bg-color-dark; - } - } -} -.form-checkbox { - .form-icon { - border-radius: $border-radius; - } - - input { - &:checked + .form-icon { - &::before { - background-clip: padding-box; - border: $border-width-lg solid $light-color; - border-left-width: 0; - border-top-width: 0; - content: ""; - height: 9px; - left: 50%; - margin-left: -3px; - margin-top: -6px; - position: absolute; - top: 50%; - transform: rotate(45deg); - width: 6px; - } - } - &:indeterminate + .form-icon { - background: $primary-color; - border-color: $primary-color; - &::before { - background: $bg-color-light; - content: ""; - height: 2px; - left: 50%; - margin-left: -5px; - margin-top: -1px; - position: absolute; - top: 50%; - width: 10px; - } - } - } -} -.form-radio { - .form-icon { - border-radius: 50%; - } - - input { - &:checked + .form-icon { - &::before { - background: $bg-color-light; - border-radius: 50%; - content: ""; - height: 6px; - left: 50%; - position: absolute; - top: 50%; - transform: translate(-50%, -50%); - width: 6px; - } - } - } -} - -// Form element: Switch -.form-switch { - padding-left: ($unit-8 + $control-padding-x); - - .form-icon { - background: $gray-color; - background-clip: padding-box; - border-radius: $unit-2 + $border-width; - height: $unit-4 + $border-width * 2; - left: 0; - top: ($control-size-sm - $unit-4) / 2 - $border-width; - width: $unit-8; - &::before { - background: $bg-color-light; - border-radius: 50%; - content: ""; - display: block; - height: $unit-4; - left: 0; - position: absolute; - top: 0; - transition: background .2s, border .2s, box-shadow .2s, color .2s, left .2s; - width: $unit-4; - } - } - - input { - &:checked + .form-icon { - &::before { - left: 14px; - } - } - &:active + .form-icon { - &::before { - background: $bg-color; - } - } - } -} - -// Form element: Input groups -.input-group { - display: flex; - - .input-group-addon { - background: $bg-color; - border: $border-width solid $border-color-dark; - border-radius: $border-radius; - line-height: $line-height; - padding: $control-padding-y $control-padding-x; - white-space: nowrap; - - &.addon-sm { - font-size: $font-size-sm; - padding: $control-padding-y-sm $control-padding-x-sm; - } - - &.addon-lg { - font-size: $font-size-lg; - padding: $control-padding-y-lg $control-padding-x-lg; - } - } - - .form-input, - .form-select { - flex: 1 1 auto; - width: 1%; - } - - .input-group-btn { - z-index: $zindex-0; - } - - .form-input, - .form-select, - .input-group-addon, - .input-group-btn { - &:first-child:not(:last-child) { - border-bottom-right-radius: 0; - border-top-right-radius: 0; - } - &:not(:first-child):not(:last-child) { - border-radius: 0; - margin-left: -$border-width; - } - &:last-child:not(:first-child) { - border-bottom-left-radius: 0; - border-top-left-radius: 0; - margin-left: -$border-width; - } - &:focus { - z-index: $zindex-0 + 1; - } - } - - .form-select { - width: auto; - } - - &.input-inline { - display: inline-flex; - } -} - -// Form validation states -.form-input, -.form-select { - .has-success &, - &.is-success { - background: lighten($success-color, 53%); - border-color: $success-color; - &:focus { - @include control-shadow($success-color); - } - } - - .has-error &, - &.is-error { - background: lighten($error-color, 53%); - border-color: $error-color; - &:focus { - @include control-shadow($error-color); - } - } -} - -.form-checkbox, -.form-radio, -.form-switch { - .has-error &, - &.is-error { - .form-icon { - border-color: $error-color; - } - - input { - &:checked + .form-icon { - background: $error-color; - border-color: $error-color; - } - - &:focus + .form-icon { - @include control-shadow($error-color); - border-color: $error-color; - } - } - } -} - -.form-checkbox { - .has-error &, - &.is-error { - input { - &:indeterminate + .form-icon { - background: $error-color; - border-color: $error-color; - } - } - } -} - -// validation based on :placeholder-shown (Edge doesn't support it yet) -.form-input { - &:not(:placeholder-shown) { - &:invalid { - border-color: $error-color; - &:focus { - @include control-shadow($error-color); - background: lighten($error-color, 53%); - } - - & + .form-input-hint { - color: $error-color; - } - } - } -} - -// Form disabled and readonly -.form-input, -.form-select { - &:disabled, - &.disabled { - background-color: $bg-color-dark; - cursor: not-allowed; - opacity: .5; - } -} - -.form-input { - &[readonly] { - background-color: $bg-color; - } -} - -input { - &:disabled, - &.disabled { - & + .form-icon { - background: $bg-color-dark; - cursor: not-allowed; - opacity: .5; - } - } -} - -.form-switch { - input { - &:disabled, - &.disabled { - & + .form-icon::before { - background: $bg-color-light; - } - } - } -} - -// Form horizontal -.form-horizontal { - padding: $layout-spacing 0; - - .form-group { - display: flex; - flex-wrap: wrap; - } -} - -// Form inline -.form-inline { - display: inline-block; -} diff --git a/Start/Client/Sass/Spectre/_hero.scss b/Start/Client/Sass/Spectre/_hero.scss deleted file mode 100644 index 0044461..0000000 --- a/Start/Client/Sass/Spectre/_hero.scss +++ /dev/null @@ -1,22 +0,0 @@ -// Hero -.hero { - display: flex; - flex-direction: column; - justify-content: space-between; - padding-bottom: 4rem; - padding-top: 4rem; - - &.hero-sm { - padding-bottom: 2rem; - padding-top: 2rem; - } - - &.hero-lg { - padding-bottom: 8rem; - padding-top: 8rem; - } - - .hero-body { - padding: $layout-spacing; - } -} \ No newline at end of file diff --git a/Start/Client/Sass/Spectre/_icons.scss b/Start/Client/Sass/Spectre/_icons.scss deleted file mode 100644 index 4f3c5ce..0000000 --- a/Start/Client/Sass/Spectre/_icons.scss +++ /dev/null @@ -1,5 +0,0 @@ -// CSS Icons -@import "icons/icons-core"; -@import "icons/icons-navigation"; -@import "icons/icons-action"; -@import "icons/icons-object"; \ No newline at end of file diff --git a/Start/Client/Sass/Spectre/_labels.scss b/Start/Client/Sass/Spectre/_labels.scss deleted file mode 100644 index ca693cd..0000000 --- a/Start/Client/Sass/Spectre/_labels.scss +++ /dev/null @@ -1,34 +0,0 @@ -// Labels -.label { - @include label-base(); - @include label-variant(lighten($body-font-color, 5%), $bg-color-dark); - display: inline-block; - - // Label rounded - &.label-rounded { - border-radius: 5rem; - padding-left: .4rem; - padding-right: .4rem; - } - - // Label colors - &.label-primary { - @include label-variant($light-color, $primary-color); - } - - &.label-secondary { - @include label-variant($primary-color, $secondary-color); - } - - &.label-success { - @include label-variant($light-color, $success-color); - } - - &.label-warning { - @include label-variant($light-color, $warning-color); - } - - &.label-error { - @include label-variant($light-color, $error-color); - } -} diff --git a/Start/Client/Sass/Spectre/_layout.scss b/Start/Client/Sass/Spectre/_layout.scss deleted file mode 100644 index e6bad9a..0000000 --- a/Start/Client/Sass/Spectre/_layout.scss +++ /dev/null @@ -1,446 +0,0 @@ -// Layout -.container { - margin-left: auto; - margin-right: auto; - padding-left: $layout-spacing; - padding-right: $layout-spacing; - width: 100%; - - $grid-spacing: ($layout-spacing / ($layout-spacing * 0 + 1)) * $html-font-size; - - &.grid-xl { - max-width: $grid-spacing * 2 + $size-xl; - } - - &.grid-lg { - max-width: $grid-spacing * 2 + $size-lg; - } - - &.grid-md { - max-width: $grid-spacing * 2 + $size-md; - } - - &.grid-sm { - max-width: $grid-spacing * 2 + $size-sm; - } - - &.grid-xs { - max-width: $grid-spacing * 2 + $size-xs; - } -} - -// Responsive breakpoint system -.show-xs, -.show-sm, -.show-md, -.show-lg, -.show-xl { - display: none !important; -} - -// Responsive grid system -.cols, -.columns { - display: flex; - flex-wrap: wrap; - margin-left: -$layout-spacing; - margin-right: -$layout-spacing; - - &.col-gapless { - margin-left: 0; - margin-right: 0; - - & > .column { - padding-left: 0; - padding-right: 0; - } - } - &.col-oneline { - flex-wrap: nowrap; - overflow-x: auto; - } -} -[class~="col-"], -.column { - flex: 1; - max-width: 100%; - padding-left: $layout-spacing; - padding-right: $layout-spacing; - - &.col-12, - &.col-11, - &.col-10, - &.col-9, - &.col-8, - &.col-7, - &.col-6, - &.col-5, - &.col-4, - &.col-3, - &.col-2, - &.col-1, - &.col-auto { - flex: none; - } -} -.col-12 { - width: 100%; -} -.col-11 { - width: 91.66666667%; -} -.col-10 { - width: 83.33333333%; -} -.col-9 { - width: 75%; -} -.col-8 { - width: 66.66666667%; -} -.col-7 { - width: 58.33333333%; -} -.col-6 { - width: 50%; -} -.col-5 { - width: 41.66666667%; -} -.col-4 { - width: 33.33333333%; -} -.col-3 { - width: 25%; -} -.col-2 { - width: 16.66666667%; -} -.col-1 { - width: 8.33333333%; -} -.col-auto { - flex: 0 0 auto; - max-width: none; - width: auto; -} -.col-mx-auto { - margin-left: auto; - margin-right: auto; -} -.col-ml-auto { - margin-left: auto; -} -.col-mr-auto { - margin-right: auto; -} -@media (max-width: $size-xl) { - .col-xl-12, - .col-xl-11, - .col-xl-10, - .col-xl-9, - .col-xl-8, - .col-xl-7, - .col-xl-6, - .col-xl-5, - .col-xl-4, - .col-xl-3, - .col-xl-2, - .col-xl-1, - .col-xl-auto { - flex: none; - } - .col-xl-12 { - width: 100%; - } - .col-xl-11 { - width: 91.66666667%; - } - .col-xl-10 { - width: 83.33333333%; - } - .col-xl-9 { - width: 75%; - } - .col-xl-8 { - width: 66.66666667%; - } - .col-xl-7 { - width: 58.33333333%; - } - .col-xl-6 { - width: 50%; - } - .col-xl-5 { - width: 41.66666667%; - } - .col-xl-4 { - width: 33.33333333%; - } - .col-xl-3 { - width: 25%; - } - .col-xl-2 { - width: 16.66666667%; - } - .col-xl-1 { - width: 8.33333333%; - } - .col-xl-auto { - width: auto; - } - .hide-xl { - display: none !important; - } - .show-xl { - display: block !important; - } -} -@media (max-width: $size-lg) { - .col-lg-12, - .col-lg-11, - .col-lg-10, - .col-lg-9, - .col-lg-8, - .col-lg-7, - .col-lg-6, - .col-lg-5, - .col-lg-4, - .col-lg-3, - .col-lg-2, - .col-lg-1, - .col-lg-auto { - flex: none; - } - .col-lg-12 { - width: 100%; - } - .col-lg-11 { - width: 91.66666667%; - } - .col-lg-10 { - width: 83.33333333%; - } - .col-lg-9 { - width: 75%; - } - .col-lg-8 { - width: 66.66666667%; - } - .col-lg-7 { - width: 58.33333333%; - } - .col-lg-6 { - width: 50%; - } - .col-lg-5 { - width: 41.66666667%; - } - .col-lg-4 { - width: 33.33333333%; - } - .col-lg-3 { - width: 25%; - } - .col-lg-2 { - width: 16.66666667%; - } - .col-lg-1 { - width: 8.33333333%; - } - .col-lg-auto { - width: auto; - } - .hide-lg { - display: none !important; - } - .show-lg { - display: block !important; - } -} -@media (max-width: $size-md) { - .col-md-12, - .col-md-11, - .col-md-10, - .col-md-9, - .col-md-8, - .col-md-7, - .col-md-6, - .col-md-5, - .col-md-4, - .col-md-3, - .col-md-2, - .col-md-1, - .col-md-auto { - flex: none; - } - .col-md-12 { - width: 100%; - } - .col-md-11 { - width: 91.66666667%; - } - .col-md-10 { - width: 83.33333333%; - } - .col-md-9 { - width: 75%; - } - .col-md-8 { - width: 66.66666667%; - } - .col-md-7 { - width: 58.33333333%; - } - .col-md-6 { - width: 50%; - } - .col-md-5 { - width: 41.66666667%; - } - .col-md-4 { - width: 33.33333333%; - } - .col-md-3 { - width: 25%; - } - .col-md-2 { - width: 16.66666667%; - } - .col-md-1 { - width: 8.33333333%; - } - .col-md-auto { - width: auto; - } - .hide-md { - display: none !important; - } - .show-md { - display: block !important; - } -} -@media (max-width: $size-sm) { - .col-sm-12, - .col-sm-11, - .col-sm-10, - .col-sm-9, - .col-sm-8, - .col-sm-7, - .col-sm-6, - .col-sm-5, - .col-sm-4, - .col-sm-3, - .col-sm-2, - .col-sm-1, - .col-sm-auto { - flex: none; - } - .col-sm-12 { - width: 100%; - } - .col-sm-11 { - width: 91.66666667%; - } - .col-sm-10 { - width: 83.33333333%; - } - .col-sm-9 { - width: 75%; - } - .col-sm-8 { - width: 66.66666667%; - } - .col-sm-7 { - width: 58.33333333%; - } - .col-sm-6 { - width: 50%; - } - .col-sm-5 { - width: 41.66666667%; - } - .col-sm-4 { - width: 33.33333333%; - } - .col-sm-3 { - width: 25%; - } - .col-sm-2 { - width: 16.66666667%; - } - .col-sm-1 { - width: 8.33333333%; - } - .col-sm-auto { - width: auto; - } - .hide-sm { - display: none !important; - } - .show-sm { - display: block !important; - } -} -@media (max-width: $size-xs) { - .col-xs-12, - .col-xs-11, - .col-xs-10, - .col-xs-9, - .col-xs-8, - .col-xs-7, - .col-xs-6, - .col-xs-5, - .col-xs-4, - .col-xs-3, - .col-xs-2, - .col-xs-1, - .col-xs-auto { - flex: none; - } - .col-xs-12 { - width: 100%; - } - .col-xs-11 { - width: 91.66666667%; - } - .col-xs-10 { - width: 83.33333333%; - } - .col-xs-9 { - width: 75%; - } - .col-xs-8 { - width: 66.66666667%; - } - .col-xs-7 { - width: 58.33333333%; - } - .col-xs-6 { - width: 50%; - } - .col-xs-5 { - width: 41.66666667%; - } - .col-xs-4 { - width: 33.33333333%; - } - .col-xs-3 { - width: 25%; - } - .col-xs-2 { - width: 16.66666667%; - } - .col-xs-1 { - width: 8.33333333%; - } - .col-xs-auto { - width: auto; - } - .hide-xs { - display: none !important; - } - .show-xs { - display: block !important; - } -} diff --git a/Start/Client/Sass/Spectre/_media.scss b/Start/Client/Sass/Spectre/_media.scss deleted file mode 100644 index 4029e4c..0000000 --- a/Start/Client/Sass/Spectre/_media.scss +++ /dev/null @@ -1,75 +0,0 @@ -// Media -// Image responsive -.img-responsive { - display: block; - height: auto; - max-width: 100%; -} - -// object-fit support is coming to Microsoft Edge -// https://developer.microsoft.com/en-us/microsoft-edge/platform/status/objectfitandobjectposition/ -.img-fit-cover { - object-fit: cover; -} - -.img-fit-contain { - object-fit: contain; -} - -// Video responsive -.video-responsive { - display: block; - overflow: hidden; - padding: 0; - position: relative; - width: 100%; - &::before { - content: ""; - display: block; - padding-bottom: 56.25%; // Default ratio 16:9, you can calculate this value by dividing 9 by 16 - } - - iframe, - object, - embed { - border: 0; - bottom: 0; - height: 100%; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - } -} - -video.video-responsive { - height: auto; - max-width: 100%; - - &::before { - content: none; - } -} - -.video-responsive-4-3 { - &::before { - padding-bottom: 75%; // Ratio 4:3 - } -} - -.video-responsive-1-1 { - &::before { - padding-bottom: 100%; // Ratio 1:1 - } -} - -// Figure -.figure { - margin: 0 0 $layout-spacing 0; - - .figure-caption { - color: $gray-color-dark; - margin-top: $layout-spacing; - } -} diff --git a/Start/Client/Sass/Spectre/_menus.scss b/Start/Client/Sass/Spectre/_menus.scss deleted file mode 100644 index 411cada..0000000 --- a/Start/Client/Sass/Spectre/_menus.scss +++ /dev/null @@ -1,66 +0,0 @@ -// Menus -.menu { - @include shadow-variant(.05rem); - background: $bg-color-light; - border-radius: $border-radius; - list-style: none; - margin: 0; - min-width: $control-width-xs; - padding: $unit-2; - transform: translateY($layout-spacing-sm); - z-index: $zindex-3; - - &.menu-nav { - background: transparent; - box-shadow: none; - } - - .menu-item { - margin-top: 0; - padding: 0 $unit-2; - position: relative; - text-decoration: none; - - & > a { - border-radius: $border-radius; - color: inherit; - display: block; - margin: 0 (-$unit-2); - padding: $unit-1 $unit-2; - text-decoration: none; - &:focus, - &:hover { - background: $secondary-color; - color: $primary-color; - } - &:active, - &.active { - background: $secondary-color; - color: $primary-color; - } - } - - .form-checkbox, - .form-radio, - .form-switch { - margin: $unit-h 0; - } - - & + .menu-item { - margin-top: $unit-1; - } - } - - .menu-badge { - align-items: center; - display: flex; - height: 100%; - position: absolute; - right: 0; - top: 0; - - .label { - margin-right: $unit-2; - } - } -} \ No newline at end of file diff --git a/Start/Client/Sass/Spectre/_meters.scss b/Start/Client/Sass/Spectre/_meters.scss deleted file mode 100644 index 9fd98b0..0000000 --- a/Start/Client/Sass/Spectre/_meters.scss +++ /dev/null @@ -1,57 +0,0 @@ -// Meters -// Credit: https://css-tricks.com/html5-meter-element/ -.meter { - appearance: none; - background: $bg-color; - border: 0; - border-radius: $border-radius; - display: block; - width: 100%; - height: $unit-4; - - &::-webkit-meter-inner-element { - display: block; - } - - &::-webkit-meter-bar, - &::-webkit-meter-optimum-value, - &::-webkit-meter-suboptimum-value, - &::-webkit-meter-even-less-good-value { - border-radius: $border-radius; - } - - &::-webkit-meter-bar { - background: $bg-color; - } - - &::-webkit-meter-optimum-value { - background: $success-color; - } - - &::-webkit-meter-suboptimum-value { - background: $warning-color; - } - - &::-webkit-meter-even-less-good-value { - background: $error-color; - } - - &::-moz-meter-bar, - &:-moz-meter-optimum, - &:-moz-meter-sub-optimum, - &:-moz-meter-sub-sub-optimum { - border-radius: $border-radius; - } - - &:-moz-meter-optimum::-moz-meter-bar { - background: $success-color; - } - - &:-moz-meter-sub-optimum::-moz-meter-bar { - background: $warning-color; - } - - &:-moz-meter-sub-sub-optimum::-moz-meter-bar { - background: $error-color; - } -} diff --git a/Start/Client/Sass/Spectre/_mixins.scss b/Start/Client/Sass/Spectre/_mixins.scss deleted file mode 100644 index d3a28d5..0000000 --- a/Start/Client/Sass/Spectre/_mixins.scss +++ /dev/null @@ -1,10 +0,0 @@ -// Mixins -@import "mixins/avatar"; -@import "mixins/button"; -@import "mixins/clearfix"; -@import "mixins/color"; -@import "mixins/label"; -@import "mixins/position"; -@import "mixins/shadow"; -@import "mixins/text"; -@import "mixins/toast"; \ No newline at end of file diff --git a/Start/Client/Sass/Spectre/_modals.scss b/Start/Client/Sass/Spectre/_modals.scss deleted file mode 100644 index a7b3f10..0000000 --- a/Start/Client/Sass/Spectre/_modals.scss +++ /dev/null @@ -1,87 +0,0 @@ -// Modals -.modal { - align-items: center; - bottom: 0; - display: none; - justify-content: center; - left: 0; - opacity: 0; - overflow: hidden; - padding: $layout-spacing; - position: fixed; - right: 0; - top: 0; - - &:target, - &.active { - display: flex; - opacity: 1; - z-index: $zindex-4; - - .modal-overlay { - background: rgba($bg-color, .75); - bottom: 0; - cursor: default; - display: block; - left: 0; - position: absolute; - right: 0; - top: 0; - } - - .modal-container { - animation: slide-down .2s ease 1; - z-index: $zindex-0; - } - } - - &.modal-sm { - .modal-container { - max-width: $control-width-sm; - padding: 0 $unit-2; - } - } - - &.modal-lg { - .modal-overlay { - background: $bg-color-light; - } - - .modal-container { - box-shadow: none; - max-width: $control-width-lg; - } - } -} - -.modal-container { - @include shadow-variant(.2rem); - background: $bg-color-light; - border-radius: $border-radius; - display: flex; - flex-direction: column; - max-height: 75vh; - max-width: $control-width-md; - padding: 0 $unit-4; - width: 100%; - - &.modal-fullheight { - max-height: 100vh; - } - - .modal-header { - color: $dark-color; - padding: $unit-4; - } - - .modal-body { - overflow-y: auto; - padding: $unit-4; - position: relative; - } - - .modal-footer { - padding: $unit-4; - text-align: right; - } -} diff --git a/Start/Client/Sass/Spectre/_navbar.scss b/Start/Client/Sass/Spectre/_navbar.scss deleted file mode 100755 index 1164296..0000000 --- a/Start/Client/Sass/Spectre/_navbar.scss +++ /dev/null @@ -1,28 +0,0 @@ -// Navbar -.navbar { - align-items: stretch; - display: flex; - flex-wrap: wrap; - justify-content: space-between; - - .navbar-section { - align-items: center; - display: flex; - flex: 1 0 0; - - &:not(:first-child):last-child { - justify-content: flex-end; - } - } - - .navbar-center { - align-items: center; - display: flex; - flex: 0 0 auto; - } - - .navbar-brand { - font-size: $font-size-lg; - text-decoration: none; - } -} diff --git a/Start/Client/Sass/Spectre/_navs.scss b/Start/Client/Sass/Spectre/_navs.scss deleted file mode 100644 index 4bedc27..0000000 --- a/Start/Client/Sass/Spectre/_navs.scss +++ /dev/null @@ -1,34 +0,0 @@ -// Navs -.nav { - display: flex; - flex-direction: column; - list-style: none; - margin: $unit-1 0; - - .nav-item { - a { - color: $gray-color-dark; - padding: $unit-1 $unit-2; - text-decoration: none; - &:focus, - &:hover { - color: $primary-color; - } - } - &.active { - & > a { - color: darken($gray-color-dark, 10%); - font-weight: bold; - &:focus, - &:hover { - color: $primary-color; - } - } - } - } - - & .nav { - margin-bottom: $unit-2; - margin-left: $unit-4; - } -} diff --git a/Start/Client/Sass/Spectre/_normalize.scss b/Start/Client/Sass/Spectre/_normalize.scss deleted file mode 100644 index a098a84..0000000 --- a/Start/Client/Sass/Spectre/_normalize.scss +++ /dev/null @@ -1,446 +0,0 @@ -/* Manually forked from Normalize.css */ -/* normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ - -/** - * 1. Change the default font family in all browsers (opinionated). - * 2. Correct the line height in all browsers. - * 3. Prevent adjustments of font size after orientation changes in - * IE on Windows Phone and in iOS. - */ - -/* Document - ========================================================================== */ - -html { - font-family: sans-serif; /* 1 */ - -ms-text-size-adjust: 100%; /* 3 */ - -webkit-text-size-adjust: 100%; /* 3 */ -} - -/* Sections - ========================================================================== */ - -/** - * Remove the margin in all browsers (opinionated). - */ - -body { - margin: 0; -} - -/** - * Add the correct display in IE 9-. - */ - -article, -aside, -footer, -header, -nav, -section { - display: block; -} - -/** - * Correct the font size and margin on `h1` elements within `section` and - * `article` contexts in Chrome, Firefox, and Safari. - */ - -h1 { - font-size: 2em; - margin: 0.67em 0; -} - -/* Grouping content - ========================================================================== */ - -/** - * Add the correct display in IE 9-. - * 1. Add the correct display in IE. - */ - -figcaption, -figure, -main { /* 1 */ - display: block; -} - -/** - * Add the correct margin in IE 8 (removed). - */ - -/** - * 1. Add the correct box sizing in Firefox. - * 2. Show the overflow in Edge and IE. - */ - -hr { - box-sizing: content-box; /* 1 */ - height: 0; /* 1 */ - overflow: visible; /* 2 */ -} - -/** - * 1. Correct the inheritance and scaling of font size in all browsers. (removed) - * 2. Correct the odd `em` font sizing in all browsers. - */ - -/* Text-level semantics - ========================================================================== */ - -/** - * 1. Remove the gray background on active links in IE 10. - * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. - */ - -a { - background-color: transparent; /* 1 */ - -webkit-text-decoration-skip: objects; /* 2 */ -} - -/** - * Remove the outline on focused links when they are also active or hovered - * in all browsers (opinionated). - */ - -a:active, -a:hover { - outline-width: 0; -} - -/** - * Modify default styling of address. - */ - -address { - font-style: normal; -} - -/** - * 1. Remove the bottom border in Firefox 39-. - * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. (removed) - */ - -/** - * Prevent the duplicate application of `bolder` by the next rule in Safari 6. - */ - -b, -strong { - font-weight: inherit; -} - -/** - * Add the correct font weight in Chrome, Edge, and Safari. - */ - -b, -strong { - font-weight: bolder; -} - -/** - * 1. Correct the inheritance and scaling of font size in all browsers. - * 2. Correct the odd `em` font sizing in all browsers. - */ - -code, -kbd, -pre, -samp { - font-family: $mono-font-family; /* 1 (changed) */ - font-size: 1em; /* 2 */ -} - -/** - * Add the correct font style in Android 4.3-. - */ - -dfn { - font-style: italic; -} - -/** - * Add the correct background and color in IE 9-. (Removed) - */ - -/** - * Add the correct font size in all browsers. - */ - -small { - font-size: 80%; - font-weight: 400; /* (added) */ -} - -/** - * Prevent `sub` and `sup` elements from affecting the line height in - * all browsers. - */ - -sub, -sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; -} - -sub { - bottom: -0.25em; -} - -sup { - top: -0.5em; -} - -/* Embedded content - ========================================================================== */ - -/** - * Add the correct display in IE 9-. - */ - -audio, -video { - display: inline-block; -} - -/** - * Add the correct display in iOS 4-7. - */ - -audio:not([controls]) { - display: none; - height: 0; -} - -/** - * Remove the border on images inside links in IE 10-. - */ - -img { - border-style: none; -} - -/** - * Hide the overflow in IE. - */ - -svg:not(:root) { - overflow: hidden; -} - -/* Forms - ========================================================================== */ - -/** - * 1. Change the font styles in all browsers (opinionated). - * 2. Remove the margin in Firefox and Safari. - */ - -button, -input, -optgroup, -select, -textarea { - font-family: inherit; /* 1 (changed) */ - font-size: inherit; /* 1 (changed) */ - line-height: inherit; /* 1 (changed) */ - margin: 0; /* 2 */ -} - -/** - * Show the overflow in IE. - * 1. Show the overflow in Edge. - */ - -button, -input { /* 1 */ - overflow: visible; -} - -/** - * Remove the inheritance of text transform in Edge, Firefox, and IE. - * 1. Remove the inheritance of text transform in Firefox. - */ - -button, -select { /* 1 */ - text-transform: none; -} - -/** - * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` - * controls in Android 4. - * 2. Correct the inability to style clickable types in iOS and Safari. - */ - -button, -html [type="button"], /* 1 */ -[type="reset"], -[type="submit"] { - -webkit-appearance: button; /* 2 */ -} - -/** - * Remove the inner border and padding in Firefox. - */ - -button::-moz-focus-inner, -[type="button"]::-moz-focus-inner, -[type="reset"]::-moz-focus-inner, -[type="submit"]::-moz-focus-inner { - border-style: none; - padding: 0; -} - -/** - * Restore the focus styles unset by the previous rule (removed). - */ - - -/** - * Change the border, margin, and padding in all browsers (opinionated) (changed). - */ - -fieldset { - border: 0; - margin: 0; - padding: 0; -} - -/** - * 1. Correct the text wrapping in Edge and IE. - * 2. Correct the color inheritance from `fieldset` elements in IE. - * 3. Remove the padding so developers are not caught out when they zero out - * `fieldset` elements in all browsers. - */ - -legend { - box-sizing: border-box; /* 1 */ - color: inherit; /* 2 */ - display: table; /* 1 */ - max-width: 100%; /* 1 */ - padding: 0; /* 3 */ - white-space: normal; /* 1 */ -} - -/** - * 1. Add the correct display in IE 9-. - * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. - */ - -progress { - display: inline-block; /* 1 */ - vertical-align: baseline; /* 2 */ -} - -/** - * Remove the default vertical scrollbar in IE. - */ - -textarea { - overflow: auto; -} - -/** - * 1. Add the correct box sizing in IE 10-. - * 2. Remove the padding in IE 10-. - */ - -[type="checkbox"], -[type="radio"] { - box-sizing: border-box; /* 1 */ - padding: 0; /* 2 */ -} - -/** - * Correct the cursor style of increment and decrement buttons in Chrome. - */ - -[type="number"]::-webkit-inner-spin-button, -[type="number"]::-webkit-outer-spin-button { - height: auto; -} - -/** - * 1. Correct the odd appearance in Chrome and Safari. - * 2. Correct the outline style in Safari. - */ - -[type="search"] { - -webkit-appearance: textfield; /* 1 */ - outline-offset: -2px; /* 2 */ -} - -/** - * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. - */ - -[type="search"]::-webkit-search-cancel-button, -[type="search"]::-webkit-search-decoration { - -webkit-appearance: none; -} - -/** - * 1. Correct the inability to style clickable types in iOS and Safari. - * 2. Change font properties to `inherit` in Safari. - */ - -::-webkit-file-upload-button { - -webkit-appearance: button; /* 1 */ - font: inherit; /* 2 */ -} - -/* Interactive - ========================================================================== */ - -/* - * Add the correct display in IE 9-. - * 1. Add the correct display in Edge, IE, and Firefox. - */ - -details, /* 1 */ -menu { - display: block; -} - -/* - * Add the correct display in all browsers. - */ - -summary { - display: list-item; - outline: none; -} - -/* Scripting - ========================================================================== */ - -/** - * Add the correct display in IE 9-. - */ - -canvas { - display: inline-block; -} - -/** - * Add the correct display in IE. - */ - -template { - display: none; -} - -/* Hidden - ========================================================================== */ - -/** - * Add the correct display in IE 10-. - */ - -[hidden] { - display: none; -} diff --git a/Start/Client/Sass/Spectre/_off-canvas.scss b/Start/Client/Sass/Spectre/_off-canvas.scss deleted file mode 100644 index f3b8b9f..0000000 --- a/Start/Client/Sass/Spectre/_off-canvas.scss +++ /dev/null @@ -1,95 +0,0 @@ -// Off canvas menus -$off-canvas-breakpoint: $size-lg !default; - -.off-canvas { - display: flex; - flex-flow: nowrap; - height: 100%; - position: relative; - width: 100%; - - .off-canvas-toggle { - display: block; - position: absolute; - top: $layout-spacing; - transition: none; - z-index: $zindex-0; - @if $rtl == true { - right: $layout-spacing; - } @else { - left: $layout-spacing; - } - } - - .off-canvas-sidebar { - background: $bg-color; - bottom: 0; - min-width: 10rem; - overflow-y: auto; - position: fixed; - top: 0; - transition: transform .25s; - z-index: $zindex-2; - @if $rtl == true { - right: 0; - transform: translateX(100%); - } @else { - left: 0; - transform: translateX(-100%); - } - } - - .off-canvas-content { - flex: 1 1 auto; - height: 100%; - padding: $layout-spacing $layout-spacing $layout-spacing 4rem; - } - - .off-canvas-overlay { - background: rgba($dark-color, .1); - border-color: transparent; - border-radius: 0; - bottom: 0; - display: none; - height: 100%; - left: 0; - position: fixed; - right: 0; - top: 0; - width: 100%; - } - - .off-canvas-sidebar { - &:target, - &.active { - transform: translateX(0); - } - - &:target ~ .off-canvas-overlay, - &.active ~ .off-canvas-overlay { - display: block; - z-index: $zindex-1; - } - } -} - -// Responsive layout -@media (min-width: $off-canvas-breakpoint) { - .off-canvas { - &.off-canvas-sidebar-show { - .off-canvas-toggle { - display: none; - } - - .off-canvas-sidebar { - flex: 0 0 auto; - position: relative; - transform: none; - } - - .off-canvas-overlay { - display: none !important; - } - } - } -} diff --git a/Start/Client/Sass/Spectre/_pagination.scss b/Start/Client/Sass/Spectre/_pagination.scss deleted file mode 100644 index 4c0e011..0000000 --- a/Start/Client/Sass/Spectre/_pagination.scss +++ /dev/null @@ -1,60 +0,0 @@ -// Pagination -.pagination { - display: flex; - list-style: none; - margin: $unit-1 0; - padding: $unit-1 0; - - .page-item { - margin: $unit-1 $unit-o; - - span { - display: inline-block; - padding: $unit-1 $unit-1; - } - - a { - border-radius: $border-radius; - display: inline-block; - padding: $unit-1 $unit-2; - text-decoration: none; - &:focus, - &:hover { - color: $primary-color; - } - } - - &.disabled { - a { - cursor: default; - opacity: .5; - pointer-events: none; - } - } - - &.active { - a { - background: $primary-color; - color: $light-color; - } - } - - &.page-prev, - &.page-next { - flex: 1 0 50%; - } - - &.page-next { - text-align: right; - } - - .page-item-title { - margin: 0; - } - - .page-item-subtitle { - margin: 0; - opacity: .5; - } - } -} diff --git a/Start/Client/Sass/Spectre/_panels.scss b/Start/Client/Sass/Spectre/_panels.scss deleted file mode 100644 index 386f96e..0000000 --- a/Start/Client/Sass/Spectre/_panels.scss +++ /dev/null @@ -1,23 +0,0 @@ -// Panels -.panel { - border: $border-width solid $border-color; - border-radius: $border-radius; - display: flex; - flex-direction: column; - - .panel-header, - .panel-footer { - flex: 0 0 auto; - padding: $layout-spacing-lg; - } - - .panel-nav { - flex: 0 0 auto; - } - - .panel-body { - flex: 1 1 auto; - overflow-y: auto; - padding: 0 $layout-spacing-lg; - } -} diff --git a/Start/Client/Sass/Spectre/_parallax.scss b/Start/Client/Sass/Spectre/_parallax.scss deleted file mode 100644 index ea244e5..0000000 --- a/Start/Client/Sass/Spectre/_parallax.scss +++ /dev/null @@ -1,135 +0,0 @@ -// Parallax -$parallax-deg: 3deg !default; -$parallax-offset: 4.5px !default; -$parallax-offset-z: 50px !default; -$parallax-perspective: 1000px !default; -$parallax-scale: .95 !default; -$parallax-fade-color: rgba(255, 255, 255, .35) !default; - -// Mixin: Parallax direction -@mixin parallax-dir() { - height: 50%; - outline: none; - position: absolute; - width: 50%; - z-index: $zindex-1; -} - -.parallax { - display: block; - height: auto; - position: relative; - width: auto; - - .parallax-content { - @include shadow-variant(1rem); - height: auto; - transform: perspective($parallax-perspective); - transform-style: preserve-3d; - transition: all .4s ease; - width: 100%; - - &::before { - content: ""; - display: block; - height: 100%; - left: 0; - position: absolute; - top: 0; - width: 100%; - } - } - - .parallax-front { - align-items: center; - color: $light-color; - display: flex; - height: 100%; - justify-content: center; - left: 0; - position: absolute; - text-align: center; - text-shadow: 0 0 20px rgba($dark-color, .75); - top: 0; - transform: translateZ($parallax-offset-z) scale($parallax-scale); - transition: transform .4s; - width: 100%; - z-index: $zindex-0; - } - - .parallax-top-left { - @include parallax-dir(); - left: 0; - top: 0; - - &:focus ~ .parallax-content, - &:hover ~ .parallax-content { - transform: perspective($parallax-perspective) rotateX($parallax-deg) rotateY(-$parallax-deg); - - &::before { - background: linear-gradient(135deg, $parallax-fade-color 0%, transparent 50%); - } - - .parallax-front { - transform: translate3d($parallax-offset, $parallax-offset, $parallax-offset-z) scale($parallax-scale); - } - } - } - - .parallax-top-right { - @include parallax-dir(); - right: 0; - top: 0; - - &:focus ~ .parallax-content, - &:hover ~ .parallax-content { - transform: perspective($parallax-perspective) rotateX($parallax-deg) rotateY($parallax-deg); - - &::before { - background: linear-gradient(-135deg, $parallax-fade-color 0%, transparent 50%); - } - - .parallax-front { - transform: translate3d(-$parallax-offset, $parallax-offset, $parallax-offset-z) scale($parallax-scale); - } - } - } - - .parallax-bottom-left { - @include parallax-dir(); - bottom: 0; - left: 0; - - &:focus ~ .parallax-content, - &:hover ~ .parallax-content { - transform: perspective($parallax-perspective) rotateX(-$parallax-deg) rotateY(-$parallax-deg); - - &::before { - background: linear-gradient(45deg, $parallax-fade-color 0%, transparent 50%); - } - - .parallax-front { - transform: translate3d($parallax-offset, -$parallax-offset, $parallax-offset-z) scale($parallax-scale); - } - } - } - - .parallax-bottom-right { - @include parallax-dir(); - bottom: 0; - right: 0; - - &:focus ~ .parallax-content, - &:hover ~ .parallax-content { - transform: perspective($parallax-perspective) rotateX(-$parallax-deg) rotateY($parallax-deg); - - &::before { - background: linear-gradient(-45deg, $parallax-fade-color 0%, transparent 50%); - } - - .parallax-front { - transform: translate3d(-$parallax-offset, -$parallax-offset, $parallax-offset-z) scale($parallax-scale); - } - } - } -} diff --git a/Start/Client/Sass/Spectre/_popovers.scss b/Start/Client/Sass/Spectre/_popovers.scss deleted file mode 100644 index 35b6bcd..0000000 --- a/Start/Client/Sass/Spectre/_popovers.scss +++ /dev/null @@ -1,65 +0,0 @@ -// Popovers -.popover { - display: inline-block; - position: relative; - - .popover-container { - left: 50%; - opacity: 0; - padding: $layout-spacing; - position: absolute; - top: 0; - transform: translate(-50%, -50%) scale(0); - transition: transform .2s; - width: $control-width-sm; - z-index: $zindex-3; - } - - *:focus + .popover-container, - &:hover .popover-container { - display: block; - opacity: 1; - transform: translate(-50%, -100%) scale(1); - } - - &.popover-right { - .popover-container { - left: 100%; - top: 50%; - } - - *:focus + .popover-container, - &:hover .popover-container { - transform: translate(0, -50%) scale(1); - } - } - - &.popover-bottom { - .popover-container { - left: 50%; - top: 100%; - } - - *:focus + .popover-container, - &:hover .popover-container { - transform: translate(-50%, 0) scale(1); - } - } - - &.popover-left { - .popover-container { - left: 0; - top: 50%; - } - - *:focus + .popover-container, - &:hover .popover-container { - transform: translate(-100%, -50%) scale(1); - } - } - - .card { - @include shadow-variant(.2rem); - border: 0; - } -} diff --git a/Start/Client/Sass/Spectre/_progress.scss b/Start/Client/Sass/Spectre/_progress.scss deleted file mode 100644 index f173772..0000000 --- a/Start/Client/Sass/Spectre/_progress.scss +++ /dev/null @@ -1,45 +0,0 @@ -// Progress -// Credit: https://css-tricks.com/html5-progress-element/ -.progress { - appearance: none; - background: $bg-color-dark; - border: 0; - border-radius: $border-radius; - color: $primary-color; - height: $unit-1; - position: relative; - width: 100%; - - &::-webkit-progress-bar { - background: transparent; - border-radius: $border-radius; - } - - &::-webkit-progress-value { - background: $primary-color; - border-radius: $border-radius; - } - - &::-moz-progress-bar { - background: $primary-color; - border-radius: $border-radius; - } - - &:indeterminate { - animation: progress-indeterminate 1.5s linear infinite; - background: $bg-color-dark linear-gradient(to right, $primary-color 30%, $bg-color-dark 30%) top left / 150% 150% no-repeat; - - &::-moz-progress-bar { - background: transparent; - } - } -} - -@keyframes progress-indeterminate { - 0% { - background-position: 200% 0; - } - 100% { - background-position: -200% 0; - } -} diff --git a/Start/Client/Sass/Spectre/_sliders.scss b/Start/Client/Sass/Spectre/_sliders.scss deleted file mode 100644 index 3ff38e8..0000000 --- a/Start/Client/Sass/Spectre/_sliders.scss +++ /dev/null @@ -1,99 +0,0 @@ -// Sliders -// Credit: https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/ -.slider { - appearance: none; - background: transparent; - display: block; - width: 100%; - height: $unit-6; - - &:focus { - @include control-shadow(); - outline: none; - } - - &.tooltip:not([data-tooltip]) { - &::after { - content: attr(value); - } - } - - // Slider Thumb - &::-webkit-slider-thumb { - -webkit-appearance: none; - background: $primary-color; - border: 0; - border-radius: 50%; - height: $unit-3; - margin-top: -($unit-3 - $unit-h) / 2; - transition: transform .2s; - width: $unit-3; - } - &::-moz-range-thumb { - background: $primary-color; - border: 0; - border-radius: 50%; - height: $unit-3; - transition: transform .2s; - width: $unit-3; - } - &::-ms-thumb { - background: $primary-color; - border: 0; - border-radius: 50%; - height: $unit-3; - transition: transform .2s; - width: $unit-3; - } - - &:active { - &::-webkit-slider-thumb { - transform: scale(1.25); - } - &::-moz-range-thumb { - transform: scale(1.25); - } - &::-ms-thumb { - transform: scale(1.25); - } - } - - &:disabled, - &.disabled { - &::-webkit-slider-thumb { - background: $gray-color-light; - transform: scale(1); - } - &::-moz-range-thumb { - background: $gray-color-light; - transform: scale(1); - } - &::-ms-thumb { - background: $gray-color-light; - transform: scale(1); - } - } - - // Slider Track - &::-webkit-slider-runnable-track { - background: $bg-color-dark; - border-radius: $border-radius; - height: $unit-h; - width: 100%; - } - &::-moz-range-track { - background: $bg-color-dark; - border-radius: $border-radius; - height: $unit-h; - width: 100%; - } - &::-ms-track { - background: $bg-color-dark; - border-radius: $border-radius; - height: $unit-h; - width: 100%; - } - &::-ms-fill-lower { - background: $primary-color; - } -} diff --git a/Start/Client/Sass/Spectre/_steps.scss b/Start/Client/Sass/Spectre/_steps.scss deleted file mode 100644 index f642ff8..0000000 --- a/Start/Client/Sass/Spectre/_steps.scss +++ /dev/null @@ -1,71 +0,0 @@ -// Steps -.step { - display: flex; - flex-wrap: nowrap; - list-style: none; - margin: $unit-1 0; - width: 100%; - - .step-item { - flex: 1 1 0; - margin-top: 0; - min-height: 1rem; - text-align: center; - position: relative; - - &:not(:first-child)::before { - background: $primary-color; - content: ""; - height: 2px; - left: -50%; - position: absolute; - top: 9px; - width: 100%; - } - - a { - color: $primary-color; - display: inline-block; - padding: 20px 10px 0; - text-decoration: none; - - &::before { - background: $primary-color; - border: $border-width-lg solid $light-color; - border-radius: 50%; - content: ""; - display: block; - height: $unit-3; - left: 50%; - position: absolute; - top: $unit-1; - transform: translateX(-50%); - width: $unit-3; - z-index: $zindex-0; - } - } - - &.active { - a { - &::before { - background: $light-color; - border: $border-width-lg solid $primary-color; - } - } - - & ~ .step-item { - &::before { - background: $border-color; - } - - a { - color: $gray-color; - - &::before { - background: $border-color; - } - } - } - } - } -} diff --git a/Start/Client/Sass/Spectre/_tables.scss b/Start/Client/Sass/Spectre/_tables.scss deleted file mode 100644 index 656c03e..0000000 --- a/Start/Client/Sass/Spectre/_tables.scss +++ /dev/null @@ -1,57 +0,0 @@ -// Tables -.table { - border-collapse: collapse; - border-spacing: 0; - width: 100%; - @if $rtl == true { - text-align: right; - } @else { - text-align: left; - } - - &.table-striped { - tbody { - tr:nth-of-type(odd) { - background: $bg-color; - } - } - } - - &, - &.table-striped { - tbody { - tr { - &.active { - background: $bg-color-dark; - } - } - } - } - - &.table-hover { - tbody { - tr { - &:hover { - background: $bg-color-dark; - } - } - } - } - - // Scollable tables - &.table-scroll { - display: block; - overflow-x: auto; - padding-bottom: .75rem; - white-space: nowrap; - } - - td, - th { - border-bottom: $border-width solid $border-color; - padding: $unit-3 $unit-2; - } - th { - border-bottom-width: $border-width-lg; - } -} diff --git a/Start/Client/Sass/Spectre/_tabs.scss b/Start/Client/Sass/Spectre/_tabs.scss deleted file mode 100644 index 0dcbaf3..0000000 --- a/Start/Client/Sass/Spectre/_tabs.scss +++ /dev/null @@ -1,66 +0,0 @@ -// Tabs -.tab { - align-items: center; - border-bottom: $border-width solid $border-color; - display: flex; - flex-wrap: wrap; - list-style: none; - margin: $unit-1 0 ($unit-1 - $border-width) 0; - - .tab-item { - margin-top: 0; - - a { - border-bottom: $border-width-lg solid transparent; - color: inherit; - display: block; - margin: 0 $unit-2 0 0; - padding: $unit-2 $unit-1 $unit-2 - $border-width-lg $unit-1; - text-decoration: none; - &:focus, - &:hover { - color: $link-color; - } - } - &.active a, - a.active { - border-bottom-color: $primary-color; - color: $link-color; - } - - &.tab-action { - flex: 1 0 auto; - text-align: right; - } - - .btn-clear { - margin-top: -$unit-1; - } - } - - &.tab-block { - .tab-item { - flex: 1 0 0; - text-align: center; - - a { - margin: 0; - } - - .badge { - &[data-badge]::after { - position: absolute; - right: $unit-h; - top: $unit-h; - transform: translate(0, 0); - } - } - } - } - - &:not(.tab-block) { - .badge { - padding-right: 0; - } - } -} diff --git a/Start/Client/Sass/Spectre/_tiles.scss b/Start/Client/Sass/Spectre/_tiles.scss deleted file mode 100644 index 742bbae..0000000 --- a/Start/Client/Sass/Spectre/_tiles.scss +++ /dev/null @@ -1,38 +0,0 @@ -// Tiles -.tile { - align-content: space-between; - align-items: flex-start; - display: flex; - - .tile-icon, - .tile-action { - flex: 0 0 auto; - } - .tile-content { - flex: 1 1 auto; - &:not(:first-child) { - padding-left: $unit-2; - } - &:not(:last-child) { - padding-right: $unit-2; - } - } - .tile-title, - .tile-subtitle { - line-height: $line-height; - } - - &.tile-centered { - align-items: center; - - .tile-content { - overflow: hidden; - } - - .tile-title, - .tile-subtitle { - @include text-ellipsis(); - margin-bottom: 0; - } - } -} diff --git a/Start/Client/Sass/Spectre/_timelines.scss b/Start/Client/Sass/Spectre/_timelines.scss deleted file mode 100644 index c56746d..0000000 --- a/Start/Client/Sass/Spectre/_timelines.scss +++ /dev/null @@ -1,56 +0,0 @@ -// Timelines -.timeline { - .timeline-item { - display: flex; - margin-bottom: $unit-6; - position: relative; - &::before { - background: $border-color; - content: ""; - height: 100%; - left: 11px; - position: absolute; - top: $unit-6; - width: 2px; - } - - .timeline-left { - flex: 0 0 auto; - } - - .timeline-content { - flex: 1 1 auto; - padding: 2px 0 2px $layout-spacing-lg; - } - - .timeline-icon { - align-items: center; - border-radius: 50%; - color: $light-color; - display: flex; - height: $unit-6; - justify-content: center; - text-align: center; - width: $unit-6; - &::before { - border: $border-width-lg solid $primary-color; - border-radius: 50%; - content: ""; - display: block; - height: $unit-2; - left: $unit-2; - position: absolute; - top: $unit-2; - width: $unit-2; - } - - &.icon-lg { - background: $primary-color; - line-height: $line-height; - &::before { - content: none; - } - } - } - } -} diff --git a/Start/Client/Sass/Spectre/_toasts.scss b/Start/Client/Sass/Spectre/_toasts.scss deleted file mode 100644 index fef15f8..0000000 --- a/Start/Client/Sass/Spectre/_toasts.scss +++ /dev/null @@ -1,48 +0,0 @@ -// Toasts -.toast { - @include toast-variant($dark-color); - border: $border-width solid $dark-color; - border-radius: $border-radius; - color: $light-color; - display: block; - padding: $layout-spacing; - width: 100%; - - &.toast-primary { - @include toast-variant($primary-color); - } - - &.toast-success { - @include toast-variant($success-color); - } - - &.toast-warning { - @include toast-variant($warning-color); - } - - &.toast-error { - @include toast-variant($error-color); - } - - a { - color: $light-color; - text-decoration: underline; - - &:focus, - &:hover, - &:active, - &.active { - opacity: .75; - } - } - - .btn-clear { - margin: $unit-h; - } - - p { - &:last-child { - margin-bottom: 0; - } - } -} diff --git a/Start/Client/Sass/Spectre/_tooltips.scss b/Start/Client/Sass/Spectre/_tooltips.scss deleted file mode 100644 index 8693b67..0000000 --- a/Start/Client/Sass/Spectre/_tooltips.scss +++ /dev/null @@ -1,79 +0,0 @@ -// Tooltips -.tooltip { - position: relative; - &::after { - background: rgba($dark-color, .95); - border-radius: $border-radius; - bottom: 100%; - color: $light-color; - content: attr(data-tooltip); - display: block; - font-size: $font-size-sm; - left: 50%; - max-width: $control-width-sm; - opacity: 0; - overflow: hidden; - padding: $unit-1 $unit-2; - pointer-events: none; - position: absolute; - text-overflow: ellipsis; - transform: translate(-50%, $unit-2); - transition: opacity .2s, transform .2s; - white-space: pre; - z-index: $zindex-3; - } - &:focus, - &:hover { - &::after { - opacity: 1; - transform: translate(-50%, -$unit-1); - } - } - &[disabled], - &.disabled { - pointer-events: auto; - } - - &.tooltip-right { - &::after { - bottom: 50%; - left: 100%; - transform: translate(-$unit-1, 50%); - } - &:focus, - &:hover { - &::after { - transform: translate($unit-1, 50%); - } - } - } - - &.tooltip-bottom { - &::after { - bottom: auto; - top: 100%; - transform: translate(-50%, -$unit-2); - } - &:focus, - &:hover { - &::after { - transform: translate(-50%, $unit-1); - } - } - } - - &.tooltip-left { - &::after { - bottom: 50%; - left: auto; - right: 100%; - transform: translate($unit-2, 50%); - } - &:focus, - &:hover { - &::after { - transform: translate(-$unit-1, 50%); - } - } - } -} diff --git a/Start/Client/Sass/Spectre/_typography.scss b/Start/Client/Sass/Spectre/_typography.scss deleted file mode 100644 index bbeb876..0000000 --- a/Start/Client/Sass/Spectre/_typography.scss +++ /dev/null @@ -1,129 +0,0 @@ -// Typography -// Headings -h1, -h2, -h3, -h4, -h5, -h6 { - color: inherit; - font-weight: 500; - line-height: 1.2; - margin-bottom: .5em; - margin-top: 0; -} -.h1, -.h2, -.h3, -.h4, -.h5, -.h6 { - font-weight: 500; -} -h1, -.h1 { - font-size: 2rem; -} -h2, -.h2 { - font-size: 1.6rem; -} -h3, -.h3 { - font-size: 1.4rem; -} -h4, -.h4 { - font-size: 1.2rem; -} -h5, -.h5 { - font-size: 1rem; -} -h6, -.h6 { - font-size: .8rem; -} - -// Paragraphs -p { - margin: 0 0 $line-height; -} - -// Semantic text elements -a, -ins, -u { - text-decoration-skip: ink edges; -} - -abbr[title] { - border-bottom: $border-width dotted; - cursor: help; - text-decoration: none; -} - -kbd { - @include label-base(); - @include label-variant($light-color, $dark-color); - font-size: $font-size-sm; -} - -mark { - @include label-variant($body-font-color, $highlight-color); - border-bottom: $unit-o solid darken($highlight-color, 15%); - border-radius: $border-radius; - padding: $unit-o $unit-h 0; -} - -// Blockquote -blockquote { - border-left: $border-width-lg solid $border-color; - margin-left: 0; - padding: $unit-2 $unit-4; - - p:last-child { - margin-bottom: 0; - } -} - -// Lists -ul, -ol { - margin: $unit-4 0 $unit-4 $unit-4; - padding: 0; - - ul, - ol { - margin: $unit-4 0 $unit-4 $unit-4; - } - - li { - margin-top: $unit-2; - } -} - -ul { - list-style: disc inside; - - ul { - list-style-type: circle; - } -} - -ol { - list-style: decimal inside; - - ol { - list-style-type: lower-alpha; - } -} - -dl { - dt { - font-weight: bold; - } - dd { - margin: $unit-2 0 $unit-4 0; - } -} diff --git a/Start/Client/Sass/Spectre/_utilities.scss b/Start/Client/Sass/Spectre/_utilities.scss deleted file mode 100644 index 80f1e0b..0000000 --- a/Start/Client/Sass/Spectre/_utilities.scss +++ /dev/null @@ -1,8 +0,0 @@ -@import "utilities/colors"; -@import "utilities/cursors"; -@import "utilities/display"; -@import "utilities/divider"; -@import "utilities/loading"; -@import "utilities/position"; -@import "utilities/shapes"; -@import "utilities/text"; diff --git a/Start/Client/Sass/Spectre/_variables.scss b/Start/Client/Sass/Spectre/_variables.scss deleted file mode 100644 index 604c006..0000000 --- a/Start/Client/Sass/Spectre/_variables.scss +++ /dev/null @@ -1,117 +0,0 @@ -// Core variables -$version: "0.5.9"; - -// Core features -$rtl: false !default; - -// Core colors -$primary-color: #5755d9 !default; -$primary-color-dark: darken($primary-color, 3%) !default; -$primary-color-light: lighten($primary-color, 3%) !default; -$secondary-color: lighten($primary-color, 37.5%) !default; -$secondary-color-dark: darken($secondary-color, 3%) !default; -$secondary-color-light: lighten($secondary-color, 3%) !default; - -// Gray colors -$dark-color: #303742 !default; -$light-color: #fff !default; -$gray-color: lighten($dark-color, 55%) !default; -$gray-color-dark: darken($gray-color, 30%) !default; -$gray-color-light: lighten($gray-color, 20%) !default; - -$border-color: lighten($dark-color, 65%) !default; -$border-color-dark: darken($border-color, 10%) !default; -$border-color-light: lighten($border-color, 8%) !default; -$bg-color: lighten($dark-color, 75%) !default; -$bg-color-dark: darken($bg-color, 3%) !default; -$bg-color-light: $light-color !default; - -// Control colors -$success-color: #32b643 !default; -$warning-color: #ffb700 !default; -$error-color: #e85600 !default; - -// Other colors -$code-color: #d73e48 !default; -$highlight-color: #ffe9b3 !default; -$body-bg: $bg-color-light !default; -$body-font-color: lighten($dark-color, 5%) !default; -$link-color: $primary-color !default; -$link-color-dark: darken($link-color, 10%) !default; -$link-color-light: lighten($link-color, 10%) !default; - -// Fonts -// Credit: https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/ -$base-font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto !default; -$mono-font-family: "SF Mono", "Segoe UI Mono", "Roboto Mono", Menlo, Courier, monospace !default; -$fallback-font-family: "Helvetica Neue", sans-serif !default; -$cjk-zh-hans-font-family: $base-font-family, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", $fallback-font-family !default; -$cjk-zh-hant-font-family: $base-font-family, "PingFang TC", "Hiragino Sans CNS", "Microsoft JhengHei", $fallback-font-family !default; -$cjk-jp-font-family: $base-font-family, "Hiragino Sans", "Hiragino Kaku Gothic Pro", "Yu Gothic", YuGothic, Meiryo, $fallback-font-family !default; -$cjk-ko-font-family: $base-font-family, "Malgun Gothic", $fallback-font-family !default; -$body-font-family: $base-font-family, $fallback-font-family !default; - -// Unit sizes -$unit-o: .05rem !default; -$unit-h: .1rem !default; -$unit-1: .2rem !default; -$unit-2: .4rem !default; -$unit-3: .6rem !default; -$unit-4: .8rem !default; -$unit-5: 1rem !default; -$unit-6: 1.2rem !default; -$unit-7: 1.4rem !default; -$unit-8: 1.6rem !default; -$unit-9: 1.8rem !default; -$unit-10: 2rem !default; -$unit-12: 2.4rem !default; -$unit-16: 3.2rem !default; - -// Font sizes -$html-font-size: 20px !default; -$html-line-height: 1.5 !default; -$font-size: .8rem !default; -$font-size-sm: .7rem !default; -$font-size-lg: .9rem !default; -$line-height: 1.2rem !default; - -// Sizes -$layout-spacing: $unit-2 !default; -$layout-spacing-sm: $unit-1 !default; -$layout-spacing-lg: $unit-4 !default; -$border-radius: $unit-h !default; -$border-width: $unit-o !default; -$border-width-lg: $unit-h !default; -$control-size: $unit-9 !default; -$control-size-sm: $unit-7 !default; -$control-size-lg: $unit-10 !default; -$control-padding-x: $unit-2 !default; -$control-padding-x-sm: $unit-2 * .75 !default; -$control-padding-x-lg: $unit-2 * 1.5 !default; -$control-padding-y: ($control-size - $line-height) / 2 - $border-width !default; -$control-padding-y-sm: ($control-size-sm - $line-height) / 2 - $border-width !default; -$control-padding-y-lg: ($control-size-lg - $line-height) / 2 - $border-width !default; -$control-icon-size: .8rem !default; - -$control-width-xs: 180px !default; -$control-width-sm: 320px !default; -$control-width-md: 640px !default; -$control-width-lg: 960px !default; -$control-width-xl: 1280px !default; - -// Responsive breakpoints -$size-xs: 480px !default; -$size-sm: 600px !default; -$size-md: 840px !default; -$size-lg: 960px !default; -$size-xl: 1280px !default; -$size-2x: 1440px !default; - -$responsive-breakpoint: $size-xs !default; - -// Z-index -$zindex-0: 1 !default; -$zindex-1: 100 !default; -$zindex-2: 200 !default; -$zindex-3: 300 !default; -$zindex-4: 400 !default; diff --git a/Start/Client/Sass/Spectre/_viewer-360.scss b/Start/Client/Sass/Spectre/_viewer-360.scss deleted file mode 100644 index c1b8928..0000000 --- a/Start/Client/Sass/Spectre/_viewer-360.scss +++ /dev/null @@ -1,34 +0,0 @@ -// 360 Degree Viewer - -// Mixin: Viewer slider sizes -@mixin viewer-slider-size($image-number: 36) { - @for $s from 1 through ($image-number) { - .viewer-slider[max='#{$image-number}'][value='#{$s}'] + .viewer-image { - background-position-y: percentage((($s)-1) * 1/(($image-number)-1)); - } - } -} - -.viewer-360 { - align-items: center; - display: flex; - flex-direction: column; - - // Copy and add more numbers if you need - @include viewer-slider-size(36); - - .viewer-slider { - cursor: ew-resize; - margin: 1rem; - order: 2; - width: 60%; - } - - .viewer-image { - background-position-y: 0; - background-repeat: no-repeat; - background-size: 100%; - max-width: 100%; - order: 1; - } -} \ No newline at end of file diff --git a/Start/Client/Sass/Spectre/icons/_icons-action.scss b/Start/Client/Sass/Spectre/icons/_icons-action.scss deleted file mode 100644 index 1b952ea..0000000 --- a/Start/Client/Sass/Spectre/icons/_icons-action.scss +++ /dev/null @@ -1,315 +0,0 @@ -// Icon resize -.icon-resize-horiz, -.icon-resize-vert { - &::before, - &::after { - border: $icon-border-width solid currentColor; - border-bottom: 0; - border-right: 0; - height: .45em; - width: .45em; - } - &::before { - transform: translate(-50%, -90%) rotate(45deg); - } - &::after { - transform: translate(-50%, -10%) rotate(225deg); - } -} - -.icon-resize-horiz { - &::before { - transform: translate(-90%, -50%) rotate(-45deg); - } - &::after { - transform: translate(-10%, -50%) rotate(135deg); - } -} - -// Icon more -.icon-more-horiz, -.icon-more-vert { - &::before { - background: currentColor; - box-shadow: -.4em 0, .4em 0; - border-radius: 50%; - height: 3px; - width: 3px; - } -} - -.icon-more-vert { - &::before { - box-shadow: 0 -.4em, 0 .4em; - } -} - -// Icon plus, minus, cross -.icon-plus, -.icon-minus, -.icon-cross { - &::before { - background: currentColor; - height: $icon-border-width; - width: 100%; - } -} - -.icon-plus, -.icon-cross { - &::after { - background: currentColor; - height: 100%; - width: $icon-border-width; - } -} - -.icon-cross { - &::before { - width: 100%; - } - &::after { - height: 100%; - } - &::before, - &::after { - transform: translate(-50%, -50%) rotate(45deg); - } -} - -// Icon check -.icon-check { - &::before { - border: $icon-border-width solid currentColor; - border-right: 0; - border-top: 0; - height: .5em; - width: .9em; - transform: translate(-50%, -75%) rotate(-45deg); - } -} - -// Icon stop -.icon-stop { - border: $icon-border-width solid currentColor; - border-radius: 50%; - &::before { - background: currentColor; - height: $icon-border-width; - transform: translate(-50%, -50%) rotate(45deg); - width: 1em; - } -} - -// Icon shutdown -.icon-shutdown { - border: $icon-border-width solid currentColor; - border-radius: 50%; - border-top-color: transparent; - &::before { - background: currentColor; - content: ""; - height: .5em; - top: .1em; - width: $icon-border-width; - } -} - -// Icon refresh -.icon-refresh { - &::before { - border: $icon-border-width solid currentColor; - border-radius: 50%; - border-right-color: transparent; - height: 1em; - width: 1em; - } - &::after { - border: .2em solid currentColor; - border-top-color: transparent; - border-left-color: transparent; - height: 0; - left: 80%; - top: 20%; - width: 0; - } -} - -// Icon search -.icon-search { - &::before { - border: $icon-border-width solid currentColor; - border-radius: 50%; - height: .75em; - left: 5%; - top: 5%; - transform: translate(0, 0) rotate(45deg); - width: .75em; - } - &::after { - background: currentColor; - height: $icon-border-width; - left: 80%; - top: 80%; - transform: translate(-50%, -50%) rotate(45deg); - width: .4em; - } -} - -// Icon edit -.icon-edit { - &::before { - border: $icon-border-width solid currentColor; - height: .4em; - transform: translate(-40%, -60%) rotate(-45deg); - width: .85em; - } - &::after { - border: .15em solid currentColor; - border-top-color: transparent; - border-right-color: transparent; - height: 0; - left: 5%; - top: 95%; - transform: translate(0, -100%); - width: 0; - } -} - -// Icon delete -.icon-delete { - &::before { - border: $icon-border-width solid currentColor; - border-bottom-left-radius: $border-radius; - border-bottom-right-radius: $border-radius; - border-top: 0; - height: .75em; - top: 60%; - width: .75em; - } - &::after { - background: currentColor; - box-shadow: -.25em .2em, .25em .2em; - height: $icon-border-width; - top: $icon-border-width/2; - width: .5em; - } -} - -// Icon share -.icon-share { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; - border-right: 0; - border-top: 0; - &::before { - border: $icon-border-width solid currentColor; - border-left: 0; - border-top: 0; - height: .4em; - left: 100%; - top: .25em; - transform: translate(-125%, -50%) rotate(-45deg); - width: .4em; - } - &::after { - border: $icon-border-width solid currentColor; - border-bottom: 0; - border-right: 0; - border-radius: 75% 0; - height: .5em; - width: .6em; - } -} - -// Icon flag -.icon-flag { - &::before { - background: currentColor; - height: 1em; - left: 15%; - width: $icon-border-width; - } - &::after { - border: $icon-border-width solid currentColor; - border-bottom-right-radius: $border-radius; - border-left: 0; - border-top-right-radius: $border-radius; - height: .65em; - top: 35%; - left: 60%; - width: .8em; - } -} - -// Icon bookmark -.icon-bookmark { - &::before { - border: $icon-border-width solid currentColor; - border-bottom: 0; - border-top-left-radius: $border-radius; - border-top-right-radius: $border-radius; - height: .9em; - width: .8em; - } - &::after { - border: $icon-border-width solid currentColor; - border-bottom: 0; - border-left: 0; - border-radius: $border-radius; - height: .5em; - transform: translate(-50%, 35%) rotate(-45deg) skew(15deg, 15deg); - width: .5em; - } -} - -// Icon download & upload -.icon-download, -.icon-upload { - border-bottom: $icon-border-width solid currentColor; - &::before { - border: $icon-border-width solid currentColor; - border-bottom: 0; - border-right: 0; - height: .5em; - width: .5em; - transform: translate(-50%, -60%) rotate(-135deg); - } - &::after { - background: currentColor; - height: .6em; - top: 40%; - width: $icon-border-width; - } -} - -.icon-upload { - &::before { - transform: translate(-50%, -60%) rotate(45deg); - } - &::after { - top: 50%; - } -} - -// Icon copy -.icon-copy { - &::before { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; - border-right: 0; - border-bottom: 0; - height: .8em; - left: 40%; - top: 35%; - width: .8em; - } - &::after { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; - height: .8em; - left: 60%; - top: 60%; - width: .8em; - } -} \ No newline at end of file diff --git a/Start/Client/Sass/Spectre/icons/_icons-core.scss b/Start/Client/Sass/Spectre/icons/_icons-core.scss deleted file mode 100644 index 9a67ae4..0000000 --- a/Start/Client/Sass/Spectre/icons/_icons-core.scss +++ /dev/null @@ -1,54 +0,0 @@ -// Icon variables -$icon-border-width: $border-width-lg; -$icon-prefix: "icon"; - -// Icon base style -.#{$icon-prefix} { - box-sizing: border-box; - display: inline-block; - font-size: inherit; - font-style: normal; - height: 1em; - position: relative; - text-indent: -9999px; - vertical-align: middle; - width: 1em; - &::before, - &::after { - content: ""; - display: block; - left: 50%; - position: absolute; - top: 50%; - transform: translate(-50%, -50%); - } - - // Icon sizes - &.icon-2x { - font-size: 1.6rem; - } - - &.icon-3x { - font-size: 2.4rem; - } - - &.icon-4x { - font-size: 3.2rem; - } -} - -// Component icon support -.accordion, -.btn, -.toast, -.menu { - .#{$icon-prefix} { - vertical-align: -10%; - } -} - -.btn-lg { - .#{$icon-prefix} { - vertical-align: -15%; - } -} diff --git a/Start/Client/Sass/Spectre/icons/_icons-navigation.scss b/Start/Client/Sass/Spectre/icons/_icons-navigation.scss deleted file mode 100644 index 92ab231..0000000 --- a/Start/Client/Sass/Spectre/icons/_icons-navigation.scss +++ /dev/null @@ -1,127 +0,0 @@ -// Icon arrows -.icon-arrow-down, -.icon-arrow-left, -.icon-arrow-right, -.icon-arrow-up, -.icon-downward, -.icon-back, -.icon-forward, -.icon-upward { - &::before { - border: $icon-border-width solid currentColor; - border-bottom: 0; - border-right: 0; - height: .65em; - width: .65em; - } -} - -.icon-arrow-down { - &::before { - transform: translate(-50%, -75%) rotate(225deg); - } -} - -.icon-arrow-left { - &::before { - transform: translate(-25%, -50%) rotate(-45deg); - } -} - -.icon-arrow-right { - &::before { - transform: translate(-75%, -50%) rotate(135deg); - } -} - -.icon-arrow-up { - &::before { - transform: translate(-50%, -25%) rotate(45deg); - } -} - -.icon-back, -.icon-forward { - &::after { - background: currentColor; - height: $icon-border-width; - width: .8em; - } -} - -.icon-downward, -.icon-upward { - &::after { - background: currentColor; - height: .8em; - width: $icon-border-width; - } -} - -.icon-back { - &::after { - left: 55%; - } - &::before { - transform: translate(-50%, -50%) rotate(-45deg); - } -} - -.icon-downward { - &::after { - top: 45%; - } - &::before { - transform: translate(-50%, -50%) rotate(-135deg); - } -} - -.icon-forward { - &::after { - left: 45%; - } - &::before { - transform: translate(-50%, -50%) rotate(135deg); - } -} - -.icon-upward { - &::after { - top: 55%; - } - &::before { - transform: translate(-50%, -50%) rotate(45deg); - } -} - -// Icon caret -.icon-caret { - &::before { - border-top: .3em solid currentColor; - border-right: .3em solid transparent; - border-left: .3em solid transparent; - height: 0; - transform: translate(-50%, -25%); - width: 0; - } -} - -// Icon menu -.icon-menu { - &::before { - background: currentColor; - box-shadow: 0 -.35em, 0 .35em; - height: $icon-border-width; - width: 100%; - } -} - -// Icon apps -.icon-apps { - &::before { - background: currentColor; - box-shadow: -.35em -.35em, -.35em 0, -.35em .35em, 0 -.35em, 0 .35em, .35em -.35em, .35em 0, .35em .35em; - height: 3px; - width: 3px; - } -} diff --git a/Start/Client/Sass/Spectre/icons/_icons-object.scss b/Start/Client/Sass/Spectre/icons/_icons-object.scss deleted file mode 100644 index 00597d8..0000000 --- a/Start/Client/Sass/Spectre/icons/_icons-object.scss +++ /dev/null @@ -1,161 +0,0 @@ -// Icon time -.icon-time { - border: $icon-border-width solid currentColor; - border-radius: 50%; - &::before { - background: currentColor; - height: .4em; - transform: translate(-50%, -75%); - width: $icon-border-width; - } - &::after { - background: currentColor; - height: .3em; - transform: translate(-50%, -75%) rotate(90deg); - transform-origin: 50% 90%; - width: $icon-border-width; - } -} - -// Icon mail -.icon-mail { - &::before { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; - height: .8em; - width: 1em; - } - &::after { - border: $icon-border-width solid currentColor; - border-right: 0; - border-top: 0; - height: .5em; - transform: translate(-50%, -90%) rotate(-45deg) skew(10deg, 10deg); - width: .5em; - } -} - -// Icon people -.icon-people { - &::before { - border: $icon-border-width solid currentColor; - border-radius: 50%; - height: .45em; - top: 25%; - width: .45em; - } - &::after { - border: $icon-border-width solid currentColor; - border-radius: 50% 50% 0 0; - height: .4em; - top: 75%; - width: .9em; - } -} - -// Icon message -.icon-message { - border: $icon-border-width solid currentColor; - border-bottom: 0; - border-radius: $border-radius; - border-right: 0; - &::before { - border: $icon-border-width solid currentColor; - border-bottom-right-radius: $border-radius; - border-left: 0; - border-top: 0; - height: .8em; - left: 65%; - top: 40%; - width: .7em; - } - &::after { - background: currentColor; - border-radius: $border-radius; - height: .3em; - left: 10%; - top: 100%; - transform: translate(0, -90%) rotate(45deg); - width: $icon-border-width; - } -} - -// Icon photo -.icon-photo { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; - &::before { - border: $icon-border-width solid currentColor; - border-radius: 50%; - height: .25em; - left: 35%; - top: 35%; - width: .25em; - } - &::after { - border: $icon-border-width solid currentColor; - border-bottom: 0; - border-left: 0; - height: .5em; - left: 60%; - transform: translate(-50%, 25%) rotate(-45deg); - width: .5em; - } -} - -// Icon link -.icon-link { - &::before, - &::after { - border: $icon-border-width solid currentColor; - border-radius: 5em 0 0 5em; - border-right: 0; - height: .5em; - width: .75em; - } - &::before { - transform: translate(-70%, -45%) rotate(-45deg); - } - &::after { - transform: translate(-30%, -55%) rotate(135deg); - } -} - -// Icon location -.icon-location { - &::before { - border: $icon-border-width solid currentColor; - border-radius: 50% 50% 50% 0; - height: .8em; - transform: translate(-50%, -60%) rotate(-45deg); - width: .8em; - } - &::after { - border: $icon-border-width solid currentColor; - border-radius: 50%; - height: .2em; - transform: translate(-50%, -80%); - width: .2em; - } -} - -// Icon emoji -.icon-emoji { - border: $icon-border-width solid currentColor; - border-radius: 50%; - &::before { - border-radius: 50%; - box-shadow: -.17em -.1em, .17em -.1em; - height: .15em; - width: .15em; - } - &::after { - border: $icon-border-width solid currentColor; - border-bottom-color: transparent; - border-radius: 50%; - border-right-color: transparent; - height: .5em; - transform: translate(-50%, -40%) rotate(-135deg); - width: .5em; - } -} diff --git a/Start/Client/Sass/Spectre/mixins/_avatar.scss b/Start/Client/Sass/Spectre/mixins/_avatar.scss deleted file mode 100644 index 14617ad..0000000 --- a/Start/Client/Sass/Spectre/mixins/_avatar.scss +++ /dev/null @@ -1,6 +0,0 @@ -// Avatar mixin -@mixin avatar-base($size: $unit-8) { - font-size: $size / 2; - height: $size; - width: $size; -} diff --git a/Start/Client/Sass/Spectre/mixins/_button.scss b/Start/Client/Sass/Spectre/mixins/_button.scss deleted file mode 100644 index c90a94b..0000000 --- a/Start/Client/Sass/Spectre/mixins/_button.scss +++ /dev/null @@ -1,54 +0,0 @@ -// Button variant mixin -@mixin button-variant($color: $primary-color) { - background: $color; - border-color: darken($color, 3%); - color: $light-color; - &:focus { - @include control-shadow($color); - } - &:focus, - &:hover { - background: darken($color, 2%); - border-color: darken($color, 5%); - color: $light-color; - } - &:active, - &.active { - background: darken($color, 7%); - border-color: darken($color, 10%); - color: $light-color; - } - &.loading { - &::after { - border-bottom-color: $light-color; - border-left-color: $light-color; - } - } -} - -@mixin button-outline-variant($color: $primary-color) { - background: $light-color; - border-color: $color; - color: $color; - &:focus { - @include control-shadow($color); - } - &:focus, - &:hover { - background: lighten($color, 50%); - border-color: darken($color, 2%); - color: $color; - } - &:active, - &.active { - background: $color; - border-color: darken($color, 5%); - color: $light-color; - } - &.loading { - &::after { - border-bottom-color: $color; - border-left-color: $color; - } - } -} diff --git a/Start/Client/Sass/Spectre/mixins/_clearfix.scss b/Start/Client/Sass/Spectre/mixins/_clearfix.scss deleted file mode 100644 index db6895f..0000000 --- a/Start/Client/Sass/Spectre/mixins/_clearfix.scss +++ /dev/null @@ -1,8 +0,0 @@ -// Clearfix mixin -@mixin clearfix() { - &::after { - clear: both; - content: ""; - display: table; - } -} diff --git a/Start/Client/Sass/Spectre/mixins/_color.scss b/Start/Client/Sass/Spectre/mixins/_color.scss deleted file mode 100644 index 697d0c3..0000000 --- a/Start/Client/Sass/Spectre/mixins/_color.scss +++ /dev/null @@ -1,27 +0,0 @@ -// Background color utility mixin -@mixin bg-color-variant($name: ".bg-primary", $color: $primary-color) { - #{$name} { - background: $color !important; - - @if (lightness($color) < 60) { - color: $light-color; - } - } -} - -// Text color utility mixin -@mixin text-color-variant($name: ".text-primary", $color: $primary-color) { - #{$name} { - color: $color !important; - } - - a#{$name} { - &:focus, - &:hover { - color: darken($color, 5%); - } - &:visited { - color: lighten($color, 5%); - } - } -} diff --git a/Start/Client/Sass/Spectre/mixins/_label.scss b/Start/Client/Sass/Spectre/mixins/_label.scss deleted file mode 100644 index 1574f02..0000000 --- a/Start/Client/Sass/Spectre/mixins/_label.scss +++ /dev/null @@ -1,11 +0,0 @@ -// Label base style -@mixin label-base() { - border-radius: $border-radius; - line-height: 1.25; - padding: .1rem .2rem; -} - -@mixin label-variant($color: $light-color, $bg-color: $primary-color) { - background: $bg-color; - color: $color; -} diff --git a/Start/Client/Sass/Spectre/mixins/_position.scss b/Start/Client/Sass/Spectre/mixins/_position.scss deleted file mode 100644 index 98b5cfc..0000000 --- a/Start/Client/Sass/Spectre/mixins/_position.scss +++ /dev/null @@ -1,65 +0,0 @@ -// Margin utility mixin -@mixin margin-variant($id: 1, $size: $unit-1) { - .m-#{$id} { - margin: $size !important; - } - - .mb-#{$id} { - margin-bottom: $size !important; - } - - .ml-#{$id} { - margin-left: $size !important; - } - - .mr-#{$id} { - margin-right: $size !important; - } - - .mt-#{$id} { - margin-top: $size !important; - } - - .mx-#{$id} { - margin-left: $size !important; - margin-right: $size !important; - } - - .my-#{$id} { - margin-bottom: $size !important; - margin-top: $size !important; - } -} - -// Padding utility mixin -@mixin padding-variant($id: 1, $size: $unit-1) { - .p-#{$id} { - padding: $size !important; - } - - .pb-#{$id} { - padding-bottom: $size !important; - } - - .pl-#{$id} { - padding-left: $size !important; - } - - .pr-#{$id} { - padding-right: $size !important; - } - - .pt-#{$id} { - padding-top: $size !important; - } - - .px-#{$id} { - padding-left: $size !important; - padding-right: $size !important; - } - - .py-#{$id} { - padding-bottom: $size !important; - padding-top: $size !important; - } -} diff --git a/Start/Client/Sass/Spectre/mixins/_shadow.scss b/Start/Client/Sass/Spectre/mixins/_shadow.scss deleted file mode 100644 index 7984449..0000000 --- a/Start/Client/Sass/Spectre/mixins/_shadow.scss +++ /dev/null @@ -1,9 +0,0 @@ -// Component focus shadow -@mixin control-shadow($color: $primary-color) { - box-shadow: 0 0 0 .1rem rgba($color, .2); -} - -// Shadow mixin -@mixin shadow-variant($offset) { - box-shadow: 0 $offset ($offset + .05rem) * 2 rgba($dark-color, .3); -} diff --git a/Start/Client/Sass/Spectre/mixins/_text.scss b/Start/Client/Sass/Spectre/mixins/_text.scss deleted file mode 100644 index 97dc99d..0000000 --- a/Start/Client/Sass/Spectre/mixins/_text.scss +++ /dev/null @@ -1,6 +0,0 @@ -// Text Ellipsis -@mixin text-ellipsis() { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} diff --git a/Start/Client/Sass/Spectre/mixins/_toast.scss b/Start/Client/Sass/Spectre/mixins/_toast.scss deleted file mode 100644 index fa2bb13..0000000 --- a/Start/Client/Sass/Spectre/mixins/_toast.scss +++ /dev/null @@ -1,5 +0,0 @@ -// Toast variant mixin -@mixin toast-variant($color: $dark-color) { - background: rgba($color, .95); - border-color: $color; -} diff --git a/Start/Client/Sass/Spectre/spectre-exp.scss b/Start/Client/Sass/Spectre/spectre-exp.scss deleted file mode 100644 index 33ed3fe..0000000 --- a/Start/Client/Sass/Spectre/spectre-exp.scss +++ /dev/null @@ -1,18 +0,0 @@ -// Variables and mixins -@import "variables"; -@import "mixins"; - -/*! Spectre.css Experimentals v#{$version} | MIT License | github.com/picturepan2/spectre */ -// Experimentals -@import "autocomplete"; -@import "calendars"; -@import "carousels"; -@import "comparison-sliders"; -@import "filters"; -@import "meters"; -@import "off-canvas"; -@import "parallax"; -@import "progress"; -@import "sliders"; -@import "timelines"; -@import "viewer-360"; diff --git a/Start/Client/Sass/Spectre/spectre-icons.scss b/Start/Client/Sass/Spectre/spectre-icons.scss deleted file mode 100644 index 383624e..0000000 --- a/Start/Client/Sass/Spectre/spectre-icons.scss +++ /dev/null @@ -1,10 +0,0 @@ -// Variables and mixins -@import "variables"; -@import "mixins"; - -/*! Spectre.css Icons v#{$version} | MIT License | github.com/picturepan2/spectre */ -// Icons -@import "icons/icons-core"; -@import "icons/icons-navigation"; -@import "icons/icons-action"; -@import "icons/icons-object"; diff --git a/Start/Client/Sass/Spectre/spectre.scss b/Start/Client/Sass/Spectre/spectre.scss deleted file mode 100644 index cff1fde..0000000 --- a/Start/Client/Sass/Spectre/spectre.scss +++ /dev/null @@ -1,49 +0,0 @@ -// Variables and mixins -@import "variables"; -@import "mixins"; - -/*! Spectre.css v#{$version} | MIT License | github.com/picturepan2/spectre */ -// Reset and dependencies -@import "normalize"; -@import "base"; - -// Elements -@import "typography"; -@import "asian"; -@import "tables"; -@import "buttons"; -@import "forms"; -@import "labels"; -@import "codes"; -@import "media"; - -// Layout -@import "layout"; -@import "hero"; -@import "navbar"; - -// Components -@import "accordions"; -@import "avatars"; -@import "badges"; -@import "breadcrumbs"; -@import "bars"; -@import "cards"; -@import "chips"; -@import "dropdowns"; -@import "empty"; -@import "menus"; -@import "modals"; -@import "navs"; -@import "pagination"; -@import "panels"; -@import "popovers"; -@import "steps"; -@import "tabs"; -@import "tiles"; -@import "toasts"; -@import "tooltips"; - -// Utility classes -@import "animations"; -@import "utilities"; diff --git a/Start/Client/Sass/Spectre/utilities/_colors.scss b/Start/Client/Sass/Spectre/utilities/_colors.scss deleted file mode 100644 index 28dd221..0000000 --- a/Start/Client/Sass/Spectre/utilities/_colors.scss +++ /dev/null @@ -1,31 +0,0 @@ -// Text colors -@include text-color-variant(".text-primary", $primary-color); - -@include text-color-variant(".text-secondary", $secondary-color-dark); - -@include text-color-variant(".text-gray", $gray-color); - -@include text-color-variant(".text-light", $light-color); - -@include text-color-variant(".text-dark", $body-font-color); - -@include text-color-variant(".text-success", $success-color); - -@include text-color-variant(".text-warning", $warning-color); - -@include text-color-variant(".text-error", $error-color); - -// Background colors -@include bg-color-variant(".bg-primary", $primary-color); - -@include bg-color-variant(".bg-secondary", $secondary-color); - -@include bg-color-variant(".bg-dark", $dark-color); - -@include bg-color-variant(".bg-gray", $bg-color); - -@include bg-color-variant(".bg-success", $success-color); - -@include bg-color-variant(".bg-warning", $warning-color); - -@include bg-color-variant(".bg-error", $error-color); diff --git a/Start/Client/Sass/Spectre/utilities/_cursors.scss b/Start/Client/Sass/Spectre/utilities/_cursors.scss deleted file mode 100644 index bd755c8..0000000 --- a/Start/Client/Sass/Spectre/utilities/_cursors.scss +++ /dev/null @@ -1,24 +0,0 @@ -// Cursors -.c-hand { - cursor: pointer; -} - -.c-move { - cursor: move; -} - -.c-zoom-in { - cursor: zoom-in; -} - -.c-zoom-out { - cursor: zoom-out; -} - -.c-not-allowed { - cursor: not-allowed; -} - -.c-auto { - cursor: auto; -} \ No newline at end of file diff --git a/Start/Client/Sass/Spectre/utilities/_display.scss b/Start/Client/Sass/Spectre/utilities/_display.scss deleted file mode 100644 index c6248e0..0000000 --- a/Start/Client/Sass/Spectre/utilities/_display.scss +++ /dev/null @@ -1,44 +0,0 @@ -// Display -.d-block { - display: block; -} -.d-inline { - display: inline; -} -.d-inline-block { - display: inline-block; -} -.d-flex { - display: flex; -} -.d-inline-flex { - display: inline-flex; -} -.d-none, -.d-hide { - display: none !important; -} -.d-visible { - visibility: visible; -} -.d-invisible { - visibility: hidden; -} -.text-hide { - background: transparent; - border: 0; - color: transparent; - font-size: 0; - line-height: 0; - text-shadow: none; -} -.text-assistive { - border: 0; - clip: rect(0,0,0,0); - height: 1px; - margin: -1px; - overflow: hidden; - padding: 0; - position: absolute; - width: 1px; -} diff --git a/Start/Client/Sass/Spectre/utilities/_divider.scss b/Start/Client/Sass/Spectre/utilities/_divider.scss deleted file mode 100644 index e6c09d2..0000000 --- a/Start/Client/Sass/Spectre/utilities/_divider.scss +++ /dev/null @@ -1,50 +0,0 @@ -// Divider -.divider, -.divider-vert { - display: block; - position: relative; - - &[data-content]::after { - background: $bg-color-light; - color: $gray-color; - content: attr(data-content); - display: inline-block; - font-size: $font-size-sm; - padding: 0 $unit-2; - transform: translateY(-$font-size-sm + $border-width); - } -} - -.divider { - border-top: $border-width solid $border-color-light; - height: $border-width; - margin: $unit-2 0; - - &[data-content] { - margin: $unit-4 0; - } -} - -.divider-vert { - display: block; - padding: $unit-4; - - &::before { - border-left: $border-width solid $border-color; - bottom: $unit-2; - content: ""; - display: block; - left: 50%; - position: absolute; - top: $unit-2; - transform: translateX(-50%); - } - - &[data-content]::after { - left: 50%; - padding: $unit-1 0; - position: absolute; - top: 50%; - transform: translate(-50%, -50%); - } -} diff --git a/Start/Client/Sass/Spectre/utilities/_loading.scss b/Start/Client/Sass/Spectre/utilities/_loading.scss deleted file mode 100644 index 2cfdefa..0000000 --- a/Start/Client/Sass/Spectre/utilities/_loading.scss +++ /dev/null @@ -1,37 +0,0 @@ -// Loading -.loading { - color: transparent !important; - min-height: $unit-4; - pointer-events: none; - position: relative; - &::after { - animation: loading 500ms infinite linear; - background: transparent; - border: $border-width-lg solid $primary-color; - border-radius: 50%; - border-right-color: transparent; - border-top-color: transparent; - content: ""; - display: block; - height: $unit-4; - left: 50%; - margin-left: -$unit-2; - margin-top: -$unit-2; - opacity: 1; - padding: 0; - position: absolute; - top: 50%; - width: $unit-4; - z-index: $zindex-0; - } - - &.loading-lg { - min-height: $unit-10; - &::after { - height: $unit-8; - margin-left: -$unit-4; - margin-top: -$unit-4; - width: $unit-8; - } - } -} diff --git a/Start/Client/Sass/Spectre/utilities/_position.scss b/Start/Client/Sass/Spectre/utilities/_position.scss deleted file mode 100644 index c1a7f75..0000000 --- a/Start/Client/Sass/Spectre/utilities/_position.scss +++ /dev/null @@ -1,54 +0,0 @@ -// Position -.clearfix { - @include clearfix(); -} - -.float-left { - float: left !important; -} - -.float-right { - float: right !important; -} - -.p-relative { - position: relative !important; -} - -.p-absolute { - position: absolute !important; -} - -.p-fixed { - position: fixed !important; -} - -.p-sticky { - position: sticky !important; -} - -.p-centered { - display: block; - float: none; - margin-left: auto; - margin-right: auto; -} - -.flex-centered { - align-items: center; - display: flex; - justify-content: center; -} - -// Spacing -@include margin-variant(0, 0); - -@include margin-variant(1, $unit-1); - -@include margin-variant(2, $unit-2); - -@include padding-variant(0, 0); - -@include padding-variant(1, $unit-1); - -@include padding-variant(2, $unit-2); diff --git a/Start/Client/Sass/Spectre/utilities/_shapes.scss b/Start/Client/Sass/Spectre/utilities/_shapes.scss deleted file mode 100644 index 23e131e..0000000 --- a/Start/Client/Sass/Spectre/utilities/_shapes.scss +++ /dev/null @@ -1,8 +0,0 @@ -// Shapes -.s-rounded { - border-radius: $border-radius; -} - -.s-circle { - border-radius: 50%; -} \ No newline at end of file diff --git a/Start/Client/Sass/Spectre/utilities/_text.scss b/Start/Client/Sass/Spectre/utilities/_text.scss deleted file mode 100644 index 5796905..0000000 --- a/Start/Client/Sass/Spectre/utilities/_text.scss +++ /dev/null @@ -1,76 +0,0 @@ -// Text -// Text alignment utilities -.text-left { - text-align: left; -} - -.text-right { - text-align: right; -} - -.text-center { - text-align: center; -} - -.text-justify { - text-align: justify; -} - -// Text transform utilities -.text-lowercase { - text-transform: lowercase; -} - -.text-uppercase { - text-transform: uppercase; -} - -.text-capitalize { - text-transform: capitalize; -} - -// Text style utilities -.text-normal { - font-weight: normal; -} - -.text-bold { - font-weight: bold; -} - -.text-italic { - font-style: italic; -} - -.text-large { - font-size: 1.2em; -} - -.text-small { - font-size: .9em; -} - -.text-tiny { - font-size: .8em; -} - -.text-muted { - opacity: .8; -} - -// Text overflow utilities -.text-ellipsis { - @include text-ellipsis(); -} - -.text-clip { - overflow: hidden; - text-overflow: clip; - white-space: nowrap; -} - -.text-break { - hyphens: auto; - word-break: break-word; - word-wrap: break-word; -} diff --git a/Start/Client/Sass/app.scss b/Start/Client/Sass/app.scss index 7ba3075..f1f0829 100644 --- a/Start/Client/Sass/app.scss +++ b/Start/Client/Sass/app.scss @@ -1,5 +1,9 @@ -@import "./spectre/_variables"; -@import "./spectre/mixins/_shadow"; +@import "../node_modules/spectre.css/src/spectre.scss"; +@import "../node_modules/spectre.css/src/spectre-icons.scss"; +@import "../node_modules/spectre.css/src/spectre-exp.scss"; + +@import "../node_modules/spectre.css/src/_variables"; +@import "../node_modules/spectre.css/src/mixins/_shadow"; /* Validation */ .valid.modified:not([type=checkbox]) { diff --git a/Start/Client/Sass/dark-mode.scss b/Start/Client/Sass/dark-mode.scss index 700dc81..9e148e1 100644 --- a/Start/Client/Sass/dark-mode.scss +++ b/Start/Client/Sass/dark-mode.scss @@ -1,4 +1,4 @@ -@import "./spectre/_variables"; +@import "../node_modules/spectre.css/src/_variables"; $dark-primary-color: $primary-color-light; $dark-primary-color-dark: $primary-color; diff --git a/Start/Client/Start.Client.csproj b/Start/Client/Start.Client.csproj index a092956..a2bf4bd 100644 --- a/Start/Client/Start.Client.csproj +++ b/Start/Client/Start.Client.csproj @@ -1,4 +1,4 @@ - + net6.0 @@ -12,36 +12,14 @@ - - - - - + - - - - - + - - - - - - - - - - - - - - - + @@ -83,7 +61,6 @@ - @@ -103,7 +80,6 @@ - diff --git a/Start/Client/package-lock.json b/Start/Client/package-lock.json new file mode 100644 index 0000000..3e942d3 --- /dev/null +++ b/Start/Client/package-lock.json @@ -0,0 +1,398 @@ +{ + "name": "start.client", + "version": "1.0.0", + "lockfileVersion": 2, + "requires": true, + "packages": { + "": { + "name": "start.client", + "version": "1.0.0", + "license": "ISC", + "dependencies": { + "spectre.css": "^0.5.9" + }, + "devDependencies": { + "sass": "^1.51.0" + } + }, + "node_modules/anymatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz", + "integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==", + "dev": true, + "dependencies": { + "normalize-path": "^3.0.0", + "picomatch": "^2.0.4" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/binary-extensions": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", + "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/braces": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", + "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "dev": true, + "dependencies": { + "fill-range": "^7.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/chokidar": { + "version": "3.5.3", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", + "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==", + "dev": true, + "funding": [ + { + "type": "individual", + "url": "https://paulmillr.com/funding/" + } + ], + "dependencies": { + "anymatch": "~3.1.2", + "braces": "~3.0.2", + "glob-parent": "~5.1.2", + "is-binary-path": "~2.1.0", + "is-glob": "~4.0.1", + "normalize-path": "~3.0.0", + "readdirp": "~3.6.0" + }, + "engines": { + "node": ">= 8.10.0" + }, + "optionalDependencies": { + "fsevents": "~2.3.2" + } + }, + "node_modules/fill-range": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", + "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "dev": true, + "dependencies": { + "to-regex-range": "^5.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "hasInstallScript": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, + "node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/immutable": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.0.0.tgz", + "integrity": "sha512-zIE9hX70qew5qTUjSS7wi1iwj/l7+m54KWU247nhM3v806UdGj1yDndXj+IOYxxtW9zyLI+xqFNZjTuDaLUqFw==", + "dev": true + }, + "node_modules/is-binary-path": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", + "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", + "dev": true, + "dependencies": { + "binary-extensions": "^2.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/is-extglob": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", + "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/is-glob": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", + "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", + "dev": true, + "dependencies": { + "is-extglob": "^2.1.1" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/is-number": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", + "dev": true, + "engines": { + "node": ">=0.12.0" + } + }, + "node_modules/normalize-path": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", + "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/picomatch": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "dev": true, + "engines": { + "node": ">=8.6" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, + "node_modules/readdirp": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", + "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "dev": true, + "dependencies": { + "picomatch": "^2.2.1" + }, + "engines": { + "node": ">=8.10.0" + } + }, + "node_modules/sass": { + "version": "1.51.0", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.51.0.tgz", + "integrity": "sha512-haGdpTgywJTvHC2b91GSq+clTKGbtkkZmVAb82jZQN/wTy6qs8DdFm2lhEQbEwrY0QDRgSQ3xDurqM977C3noA==", + "dev": true, + "dependencies": { + "chokidar": ">=3.0.0 <4.0.0", + "immutable": "^4.0.0", + "source-map-js": ">=0.6.2 <2.0.0" + }, + "bin": { + "sass": "sass.js" + }, + "engines": { + "node": ">=12.0.0" + } + }, + "node_modules/source-map-js": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/spectre.css": { + "version": "0.5.9", + "resolved": "https://registry.npmjs.org/spectre.css/-/spectre.css-0.5.9.tgz", + "integrity": "sha512-9jUqwZmCnvflrxFGcK+ize43TvjwDjqMwZPVubEtSIHzvinH0TBUESm1LcOJx3Ur7bdPaeOHQIjOqBl1Y5kLFw==" + }, + "node_modules/to-regex-range": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "dev": true, + "dependencies": { + "is-number": "^7.0.0" + }, + "engines": { + "node": ">=8.0" + } + } + }, + "dependencies": { + "anymatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz", + "integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==", + "dev": true, + "requires": { + "normalize-path": "^3.0.0", + "picomatch": "^2.0.4" + } + }, + "binary-extensions": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", + "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", + "dev": true + }, + "braces": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", + "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "dev": true, + "requires": { + "fill-range": "^7.0.1" + } + }, + "chokidar": { + "version": "3.5.3", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", + "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==", + "dev": true, + "requires": { + "anymatch": "~3.1.2", + "braces": "~3.0.2", + "fsevents": "~2.3.2", + "glob-parent": "~5.1.2", + "is-binary-path": "~2.1.0", + "is-glob": "~4.0.1", + "normalize-path": "~3.0.0", + "readdirp": "~3.6.0" + } + }, + "fill-range": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", + "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "dev": true, + "requires": { + "to-regex-range": "^5.0.1" + } + }, + "fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "optional": true + }, + "glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "requires": { + "is-glob": "^4.0.1" + } + }, + "immutable": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.0.0.tgz", + "integrity": "sha512-zIE9hX70qew5qTUjSS7wi1iwj/l7+m54KWU247nhM3v806UdGj1yDndXj+IOYxxtW9zyLI+xqFNZjTuDaLUqFw==", + "dev": true + }, + "is-binary-path": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", + "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", + "dev": true, + "requires": { + "binary-extensions": "^2.0.0" + } + }, + "is-extglob": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", + "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=", + "dev": true + }, + "is-glob": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", + "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", + "dev": true, + "requires": { + "is-extglob": "^2.1.1" + } + }, + "is-number": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", + "dev": true + }, + "normalize-path": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", + "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", + "dev": true + }, + "picomatch": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "dev": true + }, + "readdirp": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", + "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "dev": true, + "requires": { + "picomatch": "^2.2.1" + } + }, + "sass": { + "version": "1.51.0", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.51.0.tgz", + "integrity": "sha512-haGdpTgywJTvHC2b91GSq+clTKGbtkkZmVAb82jZQN/wTy6qs8DdFm2lhEQbEwrY0QDRgSQ3xDurqM977C3noA==", + "dev": true, + "requires": { + "chokidar": ">=3.0.0 <4.0.0", + "immutable": "^4.0.0", + "source-map-js": ">=0.6.2 <2.0.0" + } + }, + "source-map-js": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", + "dev": true + }, + "spectre.css": { + "version": "0.5.9", + "resolved": "https://registry.npmjs.org/spectre.css/-/spectre.css-0.5.9.tgz", + "integrity": "sha512-9jUqwZmCnvflrxFGcK+ize43TvjwDjqMwZPVubEtSIHzvinH0TBUESm1LcOJx3Ur7bdPaeOHQIjOqBl1Y5kLFw==" + }, + "to-regex-range": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "dev": true, + "requires": { + "is-number": "^7.0.0" + } + } + } +} diff --git a/Start/Client/package.json b/Start/Client/package.json new file mode 100644 index 0000000..37357eb --- /dev/null +++ b/Start/Client/package.json @@ -0,0 +1,18 @@ +{ + "name": "start.client", + "version": "1.0.0", + "description": "Front end tooling for Start.Client", + "main": "index.js", + "scripts": { + "build:dev": "npx sass Sass:wwwroot/css", + "build:prod": "npx sass Sass:wwwroot/css" + }, + "author": "Neil Brommer", + "license": "ISC", + "devDependencies": { + "sass": "^1.51.0" + }, + "dependencies": { + "spectre.css": "^0.5.9" + } +} diff --git a/Start/Client/wwwroot/index.html b/Start/Client/wwwroot/index.html index cd7353c..3503755 100644 --- a/Start/Client/wwwroot/index.html +++ b/Start/Client/wwwroot/index.html @@ -7,9 +7,6 @@ Start - - -