Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

[Feat]: A solution to define properties of Form-Field depending on device #1855

Assignees
raheeliftikhar5
Labels
ComponentsDedicated to Frontend Visual ComponentsJavascript FrontendPull requests that update Javascript code
@mad99

Description

@mad99

Related to a problem: Currently only with Custom CSS feasable.

It would be helpfull and a better UX for visitors, if Formfields could defined depending on the device.
So for example the Label Position, Alignment, the value of the Label, margins, paddings, font-sice, ... could defined different for Desktop, Tablet and Mobile.
Image

Example

For Desktop & Tablet -> Position: «Left» + Alignment: «Right»
BUT
For Mobile -> Position «Top» + Aligment: «Left»
Image
Image

Currently this is only possible with custom CSS like this:

 .lowcoder-container {/*define a container instead of @media (max-width: 576px) -> because it does not work in lowcoder preview and edit-mode*/  container-type: inline-size;}@container (max-width: 576px) {  /* Styles for mobile only */  .ui-comp-input > div > div > div > div {      flex-direction: column;  }  .ui-comp-input > div > div > div > div > div:nth-child(1){    /*border: green 3px solid;*/    width: 100% !important;    max-width: 100% !important;    justify-content: start;  }  .ui-comp-input > div > div > div > div > div:nth-child(2){    /*border: olive 3px solid;*/     width: 100% !important;    max-width: 100% !important;    justify-content: start;  }}

The solution I'd like:

  • Some kind of switch/Tab on every property to fill in the needed value for different devices.
  • Or maybe a field that would allow some kind of formula, combined with {{screenInfo.isMobile
    }} to set own values as granular as the situation needs it.
  • Or maybe with some kind of defined global theme variables useable in this field (described here:https://discord.com/channels/1096896040159957084/1390667223688810598/1390667223688810598)
  • Or with some kind of tripple tab on the top of the properties pannel.

To be honest, I do not know the best solution for. But Falk Wolsky | Lowcoder has asked to create this FEAT.
So I hope he has an idea or vision for this himself.

Alternatives I've considered:

Writing custom CSS in the Prelod CSS are for worspace-wide effect. Would be nice to get some kind of Theme-wide alternative for (See also in the link above)

Additional context:

Falk Wolsky asked for this FEAT. To be honest I guess it could open a never ending story in the current state of Lowcoder.

Metadata

Metadata

Labels

ComponentsDedicated to Frontend Visual ComponentsJavascript FrontendPull requests that update Javascript code

Projects

Status

📋 Backlog

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions


    [8]ページ先頭

    ©2009-2025 Movatter.jp