nice heading above uploadfield

10G upload limit for nginx config
This commit is contained in:
lukas 2021-09-23 20:16:09 +02:00
parent afaad81849
commit 156aaa7a71
5 changed files with 18 additions and 8 deletions

View File

@ -14,6 +14,7 @@ server {
} }
location ~* ^/(api/|token) { location ~* ^/(api/|token) {
client_max_body_size 10G;
proxy_pass http://127.0.0.1:8081; proxy_pass http://127.0.0.1:8081;
} }
location /subscribe { location /subscribe {

View File

@ -1,15 +1,9 @@
.container {
}
.dropArea { .dropArea {
border: 2px dashed #ccc; border: 2px dashed #ccc;
border-radius: 20px; border-radius: 20px;
width: 480px; width: 480px;
font-family: sans-serif; font-family: sans-serif;
margin: 100px auto;
padding: 20px; padding: 20px;
background-color: grey;
} }
.dropArea:hover{ .dropArea:hover{

View File

@ -1,11 +1,14 @@
import style from './DropZone.module.css'; import style from './DropZone.module.css';
import React, {useState} from 'react'; import React, {useState} from 'react';
import {cookie} from '../../utils/context/Cookie'; import {cookie} from '../../utils/context/Cookie';
import GlobalInfos from '../../utils/GlobalInfos';
export const DropZone = (): JSX.Element => { export const DropZone = (): JSX.Element => {
const [ondrag, setDrag] = useState(0); const [ondrag, setDrag] = useState(0);
const [percent, setpercent] = useState(0.0); const [percent, setpercent] = useState(0.0);
const theme = GlobalInfos.getThemeStyle();
const uploadFile = (f: FileList): void => { const uploadFile = (f: FileList): void => {
let xhr = new XMLHttpRequest(); // create XMLHttpRequest let xhr = new XMLHttpRequest(); // create XMLHttpRequest
let data = new FormData(); // create formData object let data = new FormData(); // create formData object
@ -39,7 +42,7 @@ export const DropZone = (): JSX.Element => {
return ( return (
<div <div
className={style.dropArea + (ondrag > 0 ? ' ' + style.highlight : '')} className={style.dropArea + (ondrag > 0 ? ' ' + style.highlight : '') + ' ' + theme.secbackground}
onDragEnter={(e): void => { onDragEnter={(e): void => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();

View File

@ -11,3 +11,9 @@
padding: 10px; padding: 10px;
width: 40%; width: 40%;
} }
.uploadtext {
font-size: x-large;
margin-top: 30px;
margin-bottom: 10px;
}

View File

@ -3,6 +3,7 @@ import style from './MovieSettings.module.css';
import {APINode, callAPI} from '../../utils/Api'; import {APINode, callAPI} from '../../utils/Api';
import {GeneralSuccess} from '../../types/GeneralTypes'; import {GeneralSuccess} from '../../types/GeneralTypes';
import {DropZone} from '../../elements/DropZone/DropZone'; import {DropZone} from '../../elements/DropZone/DropZone';
import GlobalInfos from '../../utils/GlobalInfos';
interface state { interface state {
text: string[]; text: string[];
@ -100,6 +101,8 @@ class MovieSettings extends React.Component<Props, state> {
} }
render(): JSX.Element { render(): JSX.Element {
const theme = GlobalInfos.getThemeStyle();
return ( return (
<> <>
<button <button
@ -124,7 +127,10 @@ class MovieSettings extends React.Component<Props, state> {
</div> </div>
))} ))}
</div> </div>
<div className={theme.textcolor}>
<div className={style.uploadtext}>Video Upload:</div>
<DropZone /> <DropZone />
</div>
</> </>
); );
} }