djsundog/ffplayout
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update bootstrap, fix progress bar

Browse Source
This commit is contained in:
jb-alvarado 2023-03-27 10:40:11 +02:00
parent 38e277a931
commit 4dc932635d
3 changed files with 292 additions and 661 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

907
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

10
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "ffplayout-frontend", "name": "ffplayout-frontend",
"version": "0.2.3", "version": "0.2.4",
"description": "Web GUI for ffplayout", "description": "Web GUI for ffplayout",
"author": "Jonathan Baecker", "author": "Jonathan Baecker",
"private": true, "private": true,
@ -14,9 +14,9 @@
"dependencies": { "dependencies": {
"@nuxt/types": "^2.16.3", "@nuxt/types": "^2.16.3",
"@pinia/nuxt": "^0.4.7", "@pinia/nuxt": "^0.4.7",
"@popperjs/core": "^2.11.6", "@popperjs/core": "^2.11.7",
"@vueuse/core": "^9.13.0", "@vueuse/core": "^9.13.0",
"bootstrap": "^5.3.0-alpha1", "bootstrap": "^5.3.0-alpha2",
"bootstrap-icons": "^1.10.3", "bootstrap-icons": "^1.10.3",
"cookie-universal-nuxt": "^2.2.2", "cookie-universal-nuxt": "^2.2.2",
"dayjs": "^1.11.7", "dayjs": "^1.11.7",
@ -38,8 +38,8 @@
"@types/video.js": "^7.3.51", "@types/video.js": "^7.3.51",
"eslint": "^8.36.0", "eslint": "^8.36.0",
"eslint-plugin-nuxt": "^4.0.0", "eslint-plugin-nuxt": "^4.0.0",
"nuxt": "3.3.1", "nuxt": "3.3.2",
"sass": "^1.59.3", "sass": "^1.60.0",
"sass-loader": "^13.2.1" "sass-loader": "^13.2.1"
} }
} }

36
pages/media.vue
View File

@ -77,23 +77,27 @@
<div class="col-1" style="min-width: 125px"> <div class="col-1" style="min-width: 125px">
Overall ({{ currentNumber }}/{{ inputFiles.length }}): Overall ({{ currentNumber }}/{{ inputFiles.length }}):
</div> </div>
<div class="col-10 progress"> <div class="col-10">
<div <div class="progress">
class="progress-bar bg-warning" <div
role="progressbar" class="progress-bar bg-warning"
:aria-valuenow="overallProgress" role="progressbar"
:style="`width: ${overallProgress}%`" :aria-valuenow="overallProgress"
/> :style="`width: ${overallProgress}%`"
/>
</div>
</div> </div>
<div class="w-100" /> <div class="w-100" />
<div class="col-1" style="min-width: 125px">Current:</div> <div class="col-1" style="min-width: 125px">Current:</div>
<div class="col-10 progress"> <div class="col-10">
<div <div class="progress">
class="progress-bar bg-warning" <div
role="progressbar" class="progress-bar bg-warning"
:aria-valuenow="currentProgress" role="progressbar"
:style="`width: ${currentProgress}%`" :aria-valuenow="currentProgress"
/> :style="`width: ${currentProgress}%`"
/>
</div>
</div> </div>
<div class="w-100" /> <div class="w-100" />
<div class="col-1" style="min-width: 125px">Uploading:</div> <div class="col-1" style="min-width: 125px">Uploading:</div>
@ -309,4 +313,8 @@ function onResetUpload(evt: any) {
.progress-row .col-10 { .progress-row .col-10 {
margin: auto 0 auto 0; margin: auto 0 auto 0;
} }
.progress {
padding: 0;
}
</style> </style>