Has anyone implemented responsive web design for the embed HTML or is the content not responsive? If implemented, then please share code.
Solved
Embed HTML responsive web design
+1Best answer by Caden E
Are you maybe thinking about the CSS framework Bootstrap? It is an unfortunately overloaded term. Lucid uses the term “bootstrap” (as in extensionBootstrapData) in the more general software sense, meaning essentially “initialization”. When creating a document with the REST API, you can attach a payload (extensionBootstrapData) to “bootstrap” or “initialize” a specific extension on that document.
Hi Ambient,
That depends on what you mean by “responsive web design”. <iframe>s can be wrapped in containers that can be styled to be responsive/resizable (see media queries and the resize CSS property). If you’re wondering if the canvas zoom itself can be responsive, then no, but the canvas can be zoomed in/out regardless of the container size.
+1I believe Lucid REST API + Lucid Extension API using Bootstrap (extensionBootstrapData) is intended for responsive web design. Does anyone agree or disagree?
The bootstrap data description in the documentation describes that it’s used when you want to pass data directly to a specified extension (Extension API) when programmatically creating a document (REST API; Standard Import). This doesn’t quite fit the description of responsive web design; it’s a feature focused on passing data, also with the option of marking an extension as required for a document.
+1The following is responsive iframe code, with inline CSS aspect-ratio property as the key, without a wrapper:
<iframe allowfullscreen frameborder="0" style="width: 100%; height: 100%; aspect-ratio: 16/9;" src="https://lucid.app/documents/embedded/..." id="..."></iframe>
I still do not understand the purpose for or benefit of Lucid Extension API using Bootstrap (extensionBootstrapData). Why would a person use Lucid REST API + Lucid Extension API using Bootstrap (extensionBootstrapData) with bootstrap payload, instead of only Lucid REST API with JSON payload? Also, did I get the bootstrap payload wrong?
Are you maybe thinking about the CSS framework Bootstrap? It is an unfortunately overloaded term. Lucid uses the term “bootstrap” (as in extensionBootstrapData) in the more general software sense, meaning essentially “initialization”. When creating a document with the REST API, you can attach a payload (extensionBootstrapData) to “bootstrap” or “initialize” a specific extension on that document.
+1I understand extensionBootstrapData now, thank you.
I have modified the following responsive iframe code, with inline CSS aspect-ratio property and height set to auto as the keys, without a wrapper:
<iframe allowfullscreen frameborder="0" style="width: 100%; height: auto; aspect-ratio: 16/9;" src="https://lucid.app/documents/embedded/..." id="..."></iframe>
Create an account in the community
A Lucid or airfocus account is required to interact with the Community, and your participation is subject to the Supplemental Lucid Community Terms. You may not participate in the Community if you are under 18. You will be redirected to the Lucid or airfocus app to log in.
Log in to the community
A Lucid or airfocus account is required to interact with the Community, and your participation is subject to the Supplemental Lucid Community Terms. You may not participate in the Community if you are under 18. You will be redirected to the Lucid or airfocus app to log in.
Log in with Lucid Log in with airfocus
or
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.
Your privacy choices
