Introducing Design Responsive

Off Topic
1

Hello all!
Hope ya’ll had a wonderfull day.

Let me introduce to you Design Responsive.
It’s a Thunkable (DnD sizing) based libary it let’s you create a responsive layout that works accross all devices.

How does it work?

Simple make one layout for diffrent screens and devices.
Got a bigger screen the elements will be bigger got a smaller screen the elements will be smaller.
Font size is to big on mobile but too small on desktop?
Design Responsive fixes this.

Don’t want to make multiple layouts for diffrent screen sizes, use Design Responsive.

Simply add the libary to your project and implement the resize function and everything will look the same on all your devices.

How do i get started?

Well first off all add this script tag to the head of your HTML.

<script src="https://cdn.jsdelivr.net/gh/lukeplays33/Desing-Responsive@main/DesignResponsive.js" ></script>

Then call:

resizeAllElements(getResizedElements());

in your JS file.

It’s that simple.

Want to know more?
Visit this link for the full docs and home page.

Join our server

And as always feel free to leave your feedback or suggestions.

NOTE: This is NOT a Thunkable project it’s a project for HTML,CSS and JS.
You can use it in a iframe but it’s not recommended.

Cheers.

2 Likes
2

Sounds useful! Do you have a sample Thunkable project you can share that demonstrates this?

2 Likes
3

great idea, Luke!

1 Like
4

I’m afraid that’s not possbile thunkable does not support exstenions nor importing libaries and using them.
Unless the thunkable team would implement this it’s not possible.

Either way since it’s based on DnD if you use the DnD builder you will have the same effect with your width/height automatically.
(Without the responsive fonts,border-radius margin etc).

Besides the project was made to be used by people outside of thunkable to use it in their JS,CSS and HTML proejcts.

5

Thanks for sharing this - looks very interesting.

What do you mean though that it’s “based on DnD”? Do you mean that DnD was the inspiration for your project, or is the project derived from DnD in some way?

1 Like
6

DnD was my inspiration.
Basicaly the way DnD sizes each element on diffrent screen sizes gave me the idea to make something that resizes every element to fit each screen dimension that exists.

1 Like
7

Okay, thanks for explaining. This was misleading as it made it sound like something that works with Thunkable:

But I understand what you meant now.

It might be good to clarify in your original post. I see that you posted it in “Off Topic” which is a clue that I missed. :wink:

2 Likes
8

Oh haha I’m very sorry i thought i made it clear that it wasn’t in Thunkable :sweat_smile:
I’ll edit the post.

You can still load it in an iframe in Thunkable.
But because it’s calculated different according to the window size and if it’s mobile,desktop or TV it may result in a different layout.

1 Like