Here is the code that I had done before but that used X-editables and Bootstrap 4. I’m rewriting that whole site but this time using BSS, so I have recreate this functionality:
It shows that you can search for diagrams. Just wondering how I should do this in BSS as a newbie. It does have a learning curve. I tried placing a form with rows and columns in it with a TextInput and a Button, but nothing comes out looking right. There is no search form already in the studio library. Please guide me as to what I should do to accomplish this simple task.
The thought hit me while typing this that I could just copy the essential structure of what I have in my old code, as long as it’s written in BSS and not JS-driven like most of the quiver editor (what I’m borrowing for my project).
Worked beautifully, I’m not sure what you mean @printninja. I just used custom code regions, however another way to do this is to use my export script mechanism id=“IncludeDjangoTemplate-diagram_search_order_by” on some element. I will try things this way for now. I needed a re-usable search “widget” which is why the background is transparent and there’s no navbar on the page. That would go into diagram_search_page.html which does do an #IncludeDjangoTemplate-databse-diagram_search.
I can’t figure out yet whether it’s better to use iframes or to just copy/paste or include templates. I will be using an iframe on the editor (for example including a stripped down editor for drawing the search input) though because its page I sort of kept as close as possible to quiver’s index.html as I could.
As I wrote, I was not entirely clear on what you were trying to achieve, but I’m glad you were able to use custom code blocks to get the results you were after.
I’m changing my mind again. I’m not liking how the BSS viewer shows the custom code, but I would like it show something. So I will change each of those code regions into a Django template include. What’s nice about that is I can insert any element with id IncludeDjangoTemplate-template_name and that would include an example say search result entry that kind of looks like the result, I could even insert an image of a diagram! I’m liking this approach much more.
The way to see things about what is in the custom code (even though you still cannot edit it with the drag and drop stuff) is to select the parts you want to see in the HTML window. This will then show you at least the Styles that are applied to it.
First click to select the Custom Code block in your Overview panel, then in the HTML window that block will be selected. Now open that selection to see the rest of the contents in the HTML window and click on the various parts. Any parts that have specific CSS/SCSS tied to them will change the Styles window to show you those ID’s / Classes.
