-
Notifications
You must be signed in to change notification settings - Fork 1
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
chore: Use iTwinUI-Variables in CSS package #65
Conversation
We should update layouts package versions. Are we going 1.0.0 here too or 0.2.0 is ok? @bentleyvk |
|
||
.app { | ||
padding: $iui-line-height unquote('max(#{$iui-l}, #{$iui-l} + env(safe-area-inset-right))') $iui-line-height unquote('max(#{$iui-l}, #{$iui-l} + env(safe-area-inset-left))'); | ||
padding: var(--iui-size-l) unquote('max(var(--iui-size-l), var(--iui-size-l) + env(safe-area-inset-right))') var(--iui-size-l) unquote('max(var(--iui-size-l), var(--iui-size-l) + env(safe-area-inset-left))'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It would be good to have alias for line-height in variables package
|
||
&-icon { | ||
width: 20%; | ||
background-color: var(--iui-color-background-3); | ||
border-right: 1px solid var(--iui-color-background-5); | ||
background-color: var(--iui-color-background-zebra); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
zebra?? wtf? 😀
|
||
.demo-template-container { | ||
display: flex; | ||
height: 100vh; | ||
background-color: var(--iui-color-background-4); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What happened here?
justify-content: space-between; | ||
|
||
&-left, | ||
&-right { | ||
display: flex; | ||
justify-content: flex-start; | ||
flex-direction: row; | ||
gap: $iui-s; | ||
gap: var(--iui-size-xs); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Only now I understand that our example doesn't have several buttons or inputs in tools area to see how gap looks like. But it is not for this PR.
2.0.0
.1.0.0
.