STEMMechanics/Website
1
0
Fork 0
Code Issues 4 Pull Requests 1 Actions Packages Projects Releases 3 Wiki Activity

improved progress bar design

Browse Source
This commit is contained in:
James Collins
2023-02-26 13:53:46 +10:00
parent b718212702
commit 55ec88e11f
6 changed files with 29 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
resources/css/app.scss
View File

@@ -3,7 +3,6 @@
@import "data-table.scss";
@import "tinymce.scss";
@import "prism.css";
@import "progressbar.scss";
* {
box-sizing: border-box;

28
resources/css/progressbar.scss
View File

@@ -1,28 +0,0 @@
$vue3-progress-bar-container-z-index: 999999 !default;
$vue3-progress-bar-container-transition: all 500ms ease !default;
$vue3-progress-bar-color: $primary-color-dark !default;
$vue3-progress-bar-height: 4px !default;
$vue3-progress-bar-transition: all 200ms ease !default;
.vue3-progress-bar-container {
position: fixed;
z-index: $vue3-progress-bar-container-z-index;
top: 0;
left: 0;
width: 100%;
opacity: 0;
background-color: #eee;
transition: $vue3-progress-bar-container-transition;
&[active="true"] {
opacity: 1;
transition: none;
}
.vue3-progress-bar {
width: 100%;
height: $vue3-progress-bar-height;
transform: translate3d(-100%, 0, 0);
background-color: $vue3-progress-bar-color;
transition: $vue3-progress-bar-transition;
}
}