mirror of
https://github.com/penpot/penpot.git
synced 2025-05-28 21:46:12 +02:00
💄 Add styles for external widgets on workspace (#6509)
* 💄 Add styles for Inkeep Chat at workspace * 📎 Styles review
This commit is contained in:
parent
a2ac2bc6c6
commit
47490db4be
3 changed files with 36 additions and 0 deletions
|
@ -79,6 +79,7 @@ A non exhaustive list of changes:
|
||||||
- Create `input*` wrapper component, and `label*`, `input-field*` and `hint-message*` components [Taiga #10713](https://tree.taiga.io/project/penpot/us/10713)
|
- Create `input*` wrapper component, and `label*`, `input-field*` and `hint-message*` components [Taiga #10713](https://tree.taiga.io/project/penpot/us/10713)
|
||||||
- Deselect layers (and path nodes) with Ctrl+Shift+Drag [Github #2509](https://github.com/penpot/penpot/issues/2509)
|
- Deselect layers (and path nodes) with Ctrl+Shift+Drag [Github #2509](https://github.com/penpot/penpot/issues/2509)
|
||||||
- Copy to SVG from contextual menu [Github #838](https://github.com/penpot/penpot/issues/838)
|
- Copy to SVG from contextual menu [Github #838](https://github.com/penpot/penpot/issues/838)
|
||||||
|
- Add styles for Inkeep Chat at workspace [Taiga #10708](https://tree.taiga.io/project/penpot/us/10708)
|
||||||
|
|
||||||
### :bug: Bugs fixed
|
### :bug: Bugs fixed
|
||||||
|
|
||||||
|
|
|
@ -147,6 +147,7 @@
|
||||||
(swap! state* assoc :width width)))
|
(swap! state* assoc :width width)))
|
||||||
|
|
||||||
[:div {:class (stl/css :palette-wrapper)
|
[:div {:class (stl/css :palette-wrapper)
|
||||||
|
:id "palette-wrapper"
|
||||||
:style (calculate-palette-padding rulers?)
|
:style (calculate-palette-padding rulers?)
|
||||||
:data-testid "palette"}
|
:data-testid "palette"}
|
||||||
(when-not workspace-read-only?
|
(when-not workspace-read-only?
|
||||||
|
|
|
@ -4,6 +4,10 @@
|
||||||
//
|
//
|
||||||
// Copyright (c) KALEIDOS INC
|
// Copyright (c) KALEIDOS INC
|
||||||
|
|
||||||
|
@use "../ds/spacing.scss" as *;
|
||||||
|
@use "../ds/z-index.scss" as *;
|
||||||
|
@use "../ds/_sizes.scss" as *;
|
||||||
|
|
||||||
@import "refactor/common-refactor.scss";
|
@import "refactor/common-refactor.scss";
|
||||||
|
|
||||||
.palette-wrapper {
|
.palette-wrapper {
|
||||||
|
@ -12,6 +16,12 @@
|
||||||
left: 0;
|
left: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
padding-bottom: $s-4;
|
padding-bottom: $s-4;
|
||||||
|
|
||||||
|
/** Aligns AI Chat button **/
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: var(--sp-s);
|
||||||
}
|
}
|
||||||
|
|
||||||
.palettes {
|
.palettes {
|
||||||
|
@ -164,3 +174,27 @@
|
||||||
padding-bottom: $s-8;
|
padding-bottom: $s-8;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** AI Chat button styles **/
|
||||||
|
.help-btn {
|
||||||
|
z-index: var(--z-index-panels);
|
||||||
|
flex-shrink: 0;
|
||||||
|
@extend .button-secondary;
|
||||||
|
inline-size: $sz-40;
|
||||||
|
block-size: $sz-40;
|
||||||
|
border-radius: $br-circle;
|
||||||
|
border: none;
|
||||||
|
&.selected {
|
||||||
|
@extend .button-icon-selected;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-help {
|
||||||
|
@extend .button-icon;
|
||||||
|
stroke: var(--icon-foreground);
|
||||||
|
inline-size: var(--sp-xxl);
|
||||||
|
block-size: var(--sp-xxl);
|
||||||
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue