Help forum
- Changing default styles
Jax Wedel
13 8 months ago
I am working on how styling can be done efficiently in Toddle , and I am trying to find out how to do a stylesheet for all elements . I want to avoid having to change every component every time , because that will cause issues and mistakes . But it seems Toddle doesnt support stylesheets , and the advice seems to be to create every element as components , and then style all of those components every time , and then insert them into the app instead of using the basic toddle elements . Which seems a bit strange since you are basically building a stylesheet one by one as components . Is this correct ? Is there no other way to do a stylesheet ? And regarding light /dark mode , I watched the video called "Lights on " https://www.youtube.com/watch?v=_HKZGI6UW_g @Andreas Møller mentions there that there is an easier way to do this in larger apps , is that video out ? Because I would rather do two separate stylesheets than to build in this logic in every component . PS : I see a solution by creating a global variable like "light " and "dark " . But not sure where you do that in Toddle (on root page /homepage ? ) . - Conditional rendering based on the viewport size
Jax Wedel
77 8 months ago
How do I set an element to not render when the viewport is below 600px ? I have been looking everywhere for this solution . - How do I handle optional query parameter?
Dan
7 8 months ago
I have a button that populates a query parameter only on click . I have a variable with default value null that gets specific value "A " when the button is clicked which will be used as a query parameter in the API request . How do I make this query parameter optional so that when the button is not clicked this parameter is omitted in the request URL ? - Shoelace dropdown hidden by other elements
danishnizzle
19 8 months ago
I 'm using the Shoelace UI package and having some trouble with a dropdown that 's getting covered up by a list item below it . Been doing the todo tut and trying to add feature to have options menu to duplicate /delete todo . First image shows list item component I 've created which contains my options menu as I intend it to look , 2nd shows the issue . 3rd just shows that it seems to only impact the dropdown when it goes to list items below it . I 'm this is using the popover API as z -index doesn 't seem to have any impact . - Dynamically Display a PDF
Aburio
✅17 8 months ago
Hi all , I 'm currently trying to create a simple public one -page app to generate a bike insurance quote . The page consists of a form where users enter their last name , first name , and the bike value . When users submit the form , I want to call an API that returns a PDF and display this PDF on the same page to the user with the ability to print or send a copy by email . I created a PDF viewer component that uses custom code to insert an HTML object tag with the PDF encoded in base64 : function renderPDF({ element, base64PDF }, ctx) {
// Create the object element as a string
const objectHTML = `<object data="data:application/pdf;base64,${base64PDF}" type="application/pdf" width="100%" height="100%">
<p>Your browser does not support PDFs.
<a href="data:application/pdf;base64,${base64PDF}">Download the PDF</a>
</p>
</object>`;
// Set the innerHTML of the provided element
element.innerHTML = objectHTML;
}I can display a PDF with that method using a custom component , but where I 'm struggling is how I can plug the form submit to call my API , convert the returned PDF into base64 , and insert the value into my custom component . P .S : Thanks to the Day 3 Tutorial video , I found my mistake . I removed the 'prevent default . - Move a project to a different organization?
Bishop
4 8 months ago
Is there a way to do this at the moment ? - Setting html lang
mbirkegaard
2 8 months ago
We have a customer request for setting the html lang tag ( "da " instead of "en " ) . I read that a ticket had been created for this . Did this get implemented ? - Blank canvas on editor
yoelfdz
12 9 months ago
Hey Team toddle , I have the editor of a project I 'm working on blank since yesterday , have not figured out why and need to continue - Truncate Text
Alex
9 10 months ago
Are we able to truncate text values in Toddle ? I want to limit text from overflowing like shown in the screenshot - Can I configure more than one domain in the application?
TuTo
27 11 months ago
My platform is a Saas b2b service and my clients can configure their own domain within the platform . For example , clientAdomain .com , clientBdomain .com , clientCdomain .com . All these domains lead to the same application , but depending on the domain is the information that is displayed to the client . Is it possible to do this ? - Importing existing HTML
perroseo
29 1 year ago
Hi ! Playing around with Toddle right now , looks very promising . But is it possible to import an existing HTML page with its CSS and add logic to it through Toddle ? - Streaming from OpenAI into a div?
Bishop
49 1 year ago
Wonder if anyone has done that . . . - how self hosting works?
Guilherme Demacchi
9 1 year ago
Hey guys , not a toddle dev yet but I 'm researching over nocode platforms that has self hosting capabilities , saw that info on toddle website and got curious about it but there 's not much information about it on the docs . Can someone explain to me how it works , how much does it cost ? - Supabase Many to Many Database Structure
Stockton
86 1 year ago
Okay , I want to have the concept of workspaces in my app . 1 workspace can have many users , and 1 user can have many workspaces . I saw the Supabase youtube video on it , but wondering if anyone has done it and can point out any gotcha 's ways to make it better . Particularly around how make the queries efficient and useful . Also , what 's the best way to insert new rows into the many -many table ? Looking for thoughts 🙂 Thank you - Login with Discord
SteaL
15 1 year ago
Hi , I 'm trying to implement a login with discord option on supabase https://supabase.com/docs/guides/auth/social-login/auth-discord . I have some troubles to implement the login code in toddle : async function signInWithDiscord ( ) { const { data , error } = await supabase .auth .signInWithOAuth ( { provider : 'discord ' , } ) } Did someone already did it ?
