Files
iTop/css/backoffice/layout/activity-panel/_activity-action.scss
2026-08-25 14:48:45 +02:00

76 lines
3.8 KiB
SCSS

$ibo-activity-panel--activity-actions--right: $ibo-activity-panel--add-caselog-entry-button--right !default;
$ibo-activity-panel--activity-actions--top: 76px + $ibo-activity-panel--activity-actions--right +36px + 8px !default;
$ibo-activity-panel--activity-actions--gap: $ibo-spacing-300 !default;
$ibo-activity-panel--activity-action--diameter: $ibo-activity-panel--add-caselog-entry-button--diameter !default;
$ibo-activity-panel--activity-action--background-color: $ibo-activity-panel--add-caselog-entry-button--background-color !default;
$ibo-activity-panel--activity-action--background-color--on-hover: $ibo-activity-panel--add-caselog-entry-button--background-color--on-hover !default;
$ibo-activity-panel--activity-action--background-color--is-active: $ibo-activity-panel--add-caselog-entry-button--background-color--is-active !default;
$ibo-activity-panel--activity-action--color: $ibo-activity-panel--add-caselog-entry-button--color !default;
$ibo-activity-panel--activity-action--border-radius: $ibo-border-radius-full !default;
$ibo-activity-panel--activity-action--box-shadow: $ibo-activity-panel--add-caselog-entry-button--hover--box-shadow !default;
$ibo-activity-panel--activity-action--hover--box-shadow: $ibo-activity-panel--add-caselog-entry-button--border-radius !default;
$ibo-activity-panel--activity-action--icon--height: $ibo-activity-panel--add-caselog-entry-button--icon--height !default;
$ibo-activity-panel--activity-action--icon--width: $ibo-activity-panel--activity-action--icon--height !default;
$ibo-activity-panel--activity-action--icon--font-size: $ibo-activity-panel--add-caselog-entry-button--icon--font-size !default;
$ibo-activity-panel--activity-action--icon--line-height: $ibo-activity-panel--add-caselog-entry-button--icon--line-height !default;
$ibo-activity-panel--activity-action-separator--width: calc(#{$ibo-activity-panel--activity-action--diameter} / 1.5) !default;
$ibo-activity-panel--activity-action-separator--height: 2px !default;
$ibo-activity-panel--activity-action-separator--background-color: $ibo-color-grey-500 !default;
.ibo-activity-panel--activity-actions {
display: flex;
flex-direction: column;
gap: $ibo-activity-panel--activity-actions--gap;
position: absolute;
z-index: 1;
right: $ibo-activity-panel--activity-actions--right;
top: $ibo-activity-panel--activity-actions--top;
&.ibo-is-hidden{
display: none;
}
}
.ibo-activity-panel--activity-action {
@extend %ibo-baseline-centered-content;
width: $ibo-activity-panel--activity-action--diameter;
height: $ibo-activity-panel--activity-action--diameter;
background-color: $ibo-activity-panel--activity-action--background-color;
color: $ibo-activity-panel--activity-action--color;
border-radius: $ibo-activity-panel--activity-action--border-radius;
box-shadow: $ibo-activity-panel--activity-action--box-shadow;
> i{
text-align: center;
height: $ibo-activity-panel--activity-action--icon--height;
width: $ibo-activity-panel--activity-action--icon--width;
font-size: $ibo-activity-panel--activity-action--icon--font-size;
line-height: $ibo-activity-panel--activity-action--icon--line-height;
}
&:hover {
color: $ibo-activity-panel--activity-action--color;
background-color: $ibo-activity-panel--activity-action--background-color--on-hover;
box-shadow: $ibo-activity-panel--activity-action--hover--box-shadow;
}
&:active {
color: $ibo-activity-panel--activity-action--color;
background-color: $ibo-activity-panel--activity-action--background-color--is-active;
}
&.ibo-is-hidden{
display: none;
}
}
.ibo-activity-panel--activity-action-separator {
display: block;
width: $ibo-activity-panel--activity-action-separator--width;
height: $ibo-activity-panel--activity-action-separator--height;
margin: auto;
background-color: $ibo-activity-panel--activity-action-separator--background-color;
}