Upload Complete not turning green

[mpoli]

When using the default minified css style (from the CDN), the preview seems to work fine, and also the name of the file and the "Uploading xx%" and later the "Upload complete" messages. But the green overlay that appears when a file is correctly uploaded does not appear in the previewed PDF, even though it seems to work fine on the image preview.

Here is my CSS section:

<!-- Filepond -->

       <link href="https://unpkg.com/filepond@^4/dist/filepond.css" rel="stylesheet" />
       <link
       href="https://unpkg.com/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css"
       rel="stylesheet"
   />
       <link href="https://unpkg.com/filepond-plugin-pdf-preview/dist/filepond-plugin-pdf-preview.min.css" rel="stylesheet">

<style>
       /**
       * FilePond Custom Styles
       */
      .filepond--drop-label {
          color: #4c4e53;
      }

      .filepond--label-action {
          text-decoration-color: #babdc0;
      }

      .filepond--panel-root {
          border-radius: 2em;
          background-color: #edf0f4;
          height: 1em;
      }

      .filepond--item-panel {
          background-color: #595e68;
      }

      .filepond--drip-blob {
          background-color: #7f8a9a;
      }


      /**
       * Page Styles
       */
      html {
          padding:30vh 0 0;
      }

      body {
          max-width: 20em;
          margin: 0 auto;
      }
</style>

I have these Javascripts:

       <script src="https://unpkg.com/filepond@^4/dist/filepond.js"></script>
        <script src="https://unpkg.com/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.min.js"></script>
        <script src="https://unpkg.com/filepond-plugin-file-encode/dist/filepond-plugin-file-encode.js"></script>
        <script src="https://unpkg.com/filepond-plugin-file-validate-size/dist/filepond-plugin-file-validate-size.js"></script>
        <script src="https://unpkg.com/filepond-plugin-image-exif-orientation/dist/filepond-plugin-image-exif-orientation.js"></script>
        <script src="https://unpkg.com/filepond-plugin-file-rename/dist/filepond-plugin-file-rename.js"></script>
        <script src="https://unpkg.com/filepond-plugin-file-validate-type/dist/filepond-plugin-file-validate-type.js"></script>
        <script src="https://unpkg.com/filepond-plugin-pdf-preview/dist/filepond-plugin-pdf-preview.min.js"></script>

This is the input component being called

<input type="file"
    class="filepond"
    name="filepond"
    multiple
    data-allow-reorder="true"
    data-max-file-size="100MB"
    data-max-files="20"
    credits="false" />

And this is FilePond being initialized:

<script>

FilePond.registerPlugin(

	// encodes the file as base64 data
  FilePondPluginFileEncode,

	// validates the size of the file
	FilePondPluginFileValidateSize,

	// corrects mobile image orientation
	FilePondPluginImageExifOrientation,

	// previews dropped images
  FilePondPluginImagePreview,

  // renames
  FilePondPluginFileRename,

  // Validates filetypes
  FilePondPluginFileValidateType,

  // Preview PDFs
  FilePondPluginPdfPreview
);

FilePond.setOptions(
    {
// FIXME Chunked upload are resulting in a HTTP 400 error
//        chunkUploads: true,
//            chunkSize: 50000,
	    	server: {
	    		url: 'http://localhost:8000/fp',
	    		process: '/process/',
	    		patch: '/patch/',
	    		revert: '/revert/',
	    		fetch: '/fetch/?target='
	    	}
    }


);

    // Get a reference to the file input element
    const inputElement = document.querySelector('input[type="file"]');

    // Create a FilePond instance
    const pond = FilePond.create(inputElement);

</script>

[symbianm]

Yup. I can confirm it too!