anxious-coder-lhs commented 5 years ago

Bug report

What is the current behavior? The Cloudinary widget when integrated with the defined configuration shows up as a very small window. The behaviour is originating by picking the latest version of this starter package (v1.1.3) and adding the required configuration. Following is the view that appears due to bug.

If the current behavior is a bug, please provide the steps to reproduce. The current behaviour is a bug/conflict of this starter package CSS with that of the Cloudinary Widget package. The steps to reproduce are as follows:

Clone this new repo.
Create a new Cloudinary account to get a new API key. Documentation for the same is available here.
Add/update the following configuration in the admin section of the Netlify CMS. media_library: name: cloudinary config: cloud_name: <Add your Cloud Name> api_key: <Add your API Key>
Start the gatsby engine and navigate to /admin page.
Click on the media page to open up the Cloudinary widget.

What is the expected behavior? The expected behaviour is that the window shows up with a large height for accessing the widget. The following clip shows what's expected.

Other relevant information: I tried reaching out to various community including CMS Gitter chat and the Cloudinary support and it appears that this issue has not be surfaced out till yet. Upon an initial investigation it appears that the starter package CMS is interfering with the Cloudinary widget iframe. The bulma package of this package introduce a minireset.saas that adds an auto height attribute to the widget which causes the issue. The above working example is displaying by forcefully disabling the attribute.

System: OS: Linux 5.0 Zorin OS 15 CPU: (8) x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz Shell: 4.4.20 - /bin/bash Binaries: Node: 8.10.0 - /usr/bin/node Yarn: 1.16.0 - /usr/local/bin/yarn npm: 3.5.2 - /usr/bin/npm Languages: Python: 2.7.15+ - /usr/bin/python Browsers: Chrome: 76.0.3809.100 Firefox: 68.0.1 npmGlobalPackages: gatsby-cli: 2.6.9

erquhart commented 5 years ago

Fairly certain this is due to https://github.com/gatsbyjs/gatsby/issues/15126

_{Sent with GitHawk}

anxious-coder-lhs commented 5 years ago

I guess so. I changed the starter example site to a different one and it started working. So I guess some CSS's are conflicting certainly.

erquhart commented 5 years ago

Or the other starter doesn't have the latest version of Gatsby. If it does I'd be interested to know which starter.

anxious-coder-lhs commented 5 years ago

It works with the latest version as well. I am using version 2.13.67 and it works. The starter package is StoryHub

ZoltanVeres commented 5 years ago

@love2dishtech, the link gives me a 404 http error page

anxious-coder-lhs commented 5 years ago

Oops, sorry. Please find this. https://redq.io/storyhub but it's a paid theme, you won't be able to see the source, but certainly global css.

decaporg / gatsby-starter-decap-cms

Cloudinary widget shows up in a very small unusable window #335

Bug report