Code Monkey home page Code Monkey logo

outsystems-ui's People

Contributors

benosodrac avatar bmarcelino-fe avatar dependabot[bot] avatar df-gss avatar glundgren93 avatar gnbm avatar jfranco09 avatar joaoferreira-frontend avatar joselrio avatar os-giulianasilva avatar os-kostaskapasakis avatar os-simaonunes avatar rugoncalves avatar thekingofspain avatar uicomponentsbot avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

outsystems-ui's Issues

Submenu widget does not use header colors

The submenu is mostly uses as part of the topmenu, which is part of the header.
Now If I have a header in a different contrast I need knowledge of the pattern and its styles to fix it.
I can agree with the underlin to behave like the primary color.
But the font-color (and icon) should inherit the colors of the parent containers, by all menas never use explicit color-neutral-9

now I have these in my CSS, which should not be necessary.

.desktop .osui-submenu:hover .osui-submenu__header__item,
.desktop .osui-submenu__header__item{
color: var(--color-neutral-0)
}
.desktop .osui-submenu:hover .osui-submenu__header__icon:before,
.desktop .osui-submenu__header__icon:before {
border-color: var(--color-neutral-0)
}

Animated Label - when content is removed programmatically, it doesn't behave as expected

When I'm using the animated label pattern, it's not behaving as expected in the following scenario:

  1. Animated Label Pattern has already data loaded
  2. Change a different input, which triggers a client screen action
  3. Said action removed programmatically the animated label data

Expected behavior: The label should merge into the input
Actual behavior: The label stays as if it had still data. After clicking outside the animated label, it triggers other event which is working properly

Screen1 - 19 June 2023

Possible root cause:

The default value should be false instead of undefined, because the function isn't handling the undefined case.

private _inputStateToggle(isFocus: boolean | undefined): void {

Other possible fix would be to pass false in both cases, but it wouldn't prevent for future bugs like this.

MenuSubItem Css active class always removed after click event is processed

I have a MenuSubItem that is progamically set to active. However when the active MenuSubItem is clicked, the active class is removed. The removal of the class occurs after the active sub menu's link click event is handled on the client side. Calling the SetActiveMenuItems or custom js code in the active sub menu's link click event handler indicates that the MenuSubItem is still active at the time the event handler is executed.

Patterns.Columns - columns.gutter-base distorts width

When using the columns widget within a parent container that has a defined width, the .columns.gutter-base css rule is increasing the width of column widget such that it is larger than its parent container, resulting in an x overflow.

image

image

image

image

.columns.gutter-base{
margin-left:calc(-1 * var(--space-base) / 2);
margin-right:calc(-1 * var(--space-base) / 2);
}

Adding a width value of 100% to the above css rule corrects the issue in the above example.

Dist folder inside repo

Is there a specific reason why the repo includes the "dist" folder? Normally this folder is ignored using the ".gitignore" file.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.