mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2026-03-06 10:27:22 +00:00
195 lines
3.5 KiB
SCSS
195 lines
3.5 KiB
SCSS
@charset "UTF-8";
|
|
|
|
@mixin shell-header-type(
|
|
$color,
|
|
$height,
|
|
$background,
|
|
$divider,
|
|
$shadow,
|
|
$paddingLeft
|
|
) {
|
|
color: $color;
|
|
height: $height;
|
|
background: $background;
|
|
border-bottom: $divider;
|
|
box-shadow: $shadow;
|
|
padding: 0 $paddingLeft;
|
|
}
|
|
|
|
@mixin shell-header-navigation(
|
|
$direction,
|
|
$height,
|
|
$lineHight,
|
|
$paddingLeft
|
|
) {
|
|
justify-content: $direction;
|
|
height: $height;
|
|
line-height: $lineHight;
|
|
margin: 0 $paddingLeft;
|
|
}
|
|
|
|
@mixin shell-task-header(
|
|
$min-height,
|
|
$background,
|
|
$divider,
|
|
$shadow,
|
|
$paddingLeft
|
|
) {
|
|
width: 100%;
|
|
min-height: $min-height;
|
|
background: $background;
|
|
border-bottom: $divider;
|
|
box-shadow: $shadow;
|
|
padding: 0 $paddingLeft;
|
|
overflow: auto;
|
|
}
|
|
|
|
@mixin shell-appbar(
|
|
$min-height,
|
|
$background,
|
|
$divider,
|
|
$shadow,
|
|
$paddingLeft
|
|
) {
|
|
min-height: $min-height;
|
|
background: $background;
|
|
border-bottom: $divider;
|
|
box-shadow: $shadow;
|
|
padding: 0 $paddingLeft;
|
|
}
|
|
|
|
@mixin shell-content(
|
|
$paddingTop,
|
|
$paddingLeft,
|
|
$max-width,
|
|
$gutter-row,
|
|
$gutter-column,
|
|
$columns
|
|
) {
|
|
#{$shell-prefix}-content {
|
|
padding: $paddingTop $paddingLeft;
|
|
}
|
|
|
|
// #{$shell-prefix}-content-inner {
|
|
// max-width: $max-width;
|
|
// grid-row-gap: $gutter-row;
|
|
// grid-column-gap: $gutter-column;
|
|
// grid-template-columns: repeat($columns, 1fr);
|
|
// }
|
|
}
|
|
|
|
@mixin shell-trigger-background(
|
|
$nav-trigger-bg,
|
|
$dock-trigger-bg,
|
|
$local-nav-trigger-bg,
|
|
$ancillary-trigger-bg
|
|
) {
|
|
#{$shell-prefix}-header {
|
|
.dock-trigger,
|
|
.nav-trigger {
|
|
background: $nav-trigger-bg;
|
|
}
|
|
}
|
|
|
|
#{$shell-prefix}-aside {
|
|
.local-nav-trigger {
|
|
background: $local-nav-trigger-bg;
|
|
}
|
|
.ancillary-trigger {
|
|
background: $ancillary-trigger-bg;
|
|
}
|
|
}
|
|
}
|
|
|
|
@mixin shell-navigation(
|
|
$width,
|
|
$background,
|
|
$divider,
|
|
$shadow,
|
|
$paddingTop,
|
|
$paddingBottom,
|
|
$width-mini
|
|
) {
|
|
width: $width;
|
|
background: $background;
|
|
border-right: $divider;
|
|
box-shadow: $shadow;
|
|
padding: $paddingTop 0 $paddingBottom;
|
|
|
|
&#{$shell-prefix}-collapse#{$shell-prefix}-mini {
|
|
width: $width-mini;
|
|
}
|
|
|
|
&#{$shell-prefix}-collapse {
|
|
width: 0;
|
|
}
|
|
}
|
|
|
|
@mixin shell-tooldock(
|
|
$width,
|
|
$background,
|
|
$divider,
|
|
$shadow,
|
|
$paddingTop,
|
|
$paddingBottom
|
|
) {
|
|
width: $width;
|
|
background: $background;
|
|
border-left: $divider;
|
|
box-shadow: $shadow;
|
|
padding: $paddingTop 0 $paddingBottom;
|
|
}
|
|
|
|
@mixin shell-tooldock-item(
|
|
$paddingTop,
|
|
$color,
|
|
$background,
|
|
$color-hover,
|
|
$background-hover
|
|
) {
|
|
padding: $paddingTop 0;
|
|
color: $color;
|
|
background: $background;
|
|
|
|
&:hover {
|
|
color: $color-hover;
|
|
background: $background-hover;
|
|
}
|
|
}
|
|
|
|
@mixin shell-localnavigation(
|
|
$width,
|
|
$background,
|
|
$divider,
|
|
$shadow,
|
|
$paddingTop,
|
|
$paddingBottom
|
|
) {
|
|
width: $width;
|
|
background: $background;
|
|
border-right: $divider;
|
|
box-shadow: $shadow;
|
|
padding: $paddingTop 0 $paddingBottom;
|
|
&#{$shell-prefix}-collapse {
|
|
width: 0;
|
|
}
|
|
}
|
|
|
|
@mixin shell-ancillary(
|
|
$width,
|
|
$background,
|
|
$divider,
|
|
$shadow,
|
|
$paddingTop,
|
|
$paddingBottom
|
|
) {
|
|
width: $width;
|
|
background: $background;
|
|
border-left: $divider;
|
|
box-shadow: $shadow;
|
|
padding: $paddingTop 0 $paddingBottom;
|
|
&#{$shell-prefix}-collapse {
|
|
width: 0;
|
|
}
|
|
}
|