scss 珠三角的J&B主题文件

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了scss 珠三角的J&B主题文件相关的知识,希望对你有一定的参考价值。

// Global variable overrides. Must be declared before importing Valo.

// Defines the plaintext font size, weight and family. Font size affects general component sizing.
//$v-font-size: 16px;
//$v-font-weight: 300;
//$v-font-family: "Open Sans", sans-serif;

// Defines the border used by all components.
//$v-border: 1px solid (v-shade 0.7);
//$v-border-radius: 4px;

// Affects the color of some component elements, e.g Button, Panel title, etc
//$v-background-color: hsl(210, 0%, 98%);
// Affects the color of content areas, e.g  Panel and Window content, TextField input etc
//$v-app-background-color: $v-background-color;

// Affects the visual appearance of all components
//$v-gradient: v-linear 8%;
//$v-bevel-depth: 30%;
//$v-shadow-opacity: 5%;

// Defines colors for indicating status (focus, success, failure)
//$v-focus-color: valo-focus-color(); // Calculates a suitable color automatically
//$v-friendly-color: #2c9720;
//$v-error-indicator-color: #ed473b;

// For more information, see: https://vaadin.com/book/-/page/themes.valo.html
// Example variants can be copy/pasted from https://vaadin.com/wiki/-/wiki/Main/Valo+Examples


// ------- JB VARIABLES --------
$jb-primary-dark-color: #91332E;
$jb-primary-light-color: #FFE7BF;

$v-selection-color: $jb-primary-dark-color;
$v-font-color: $jb-primary-dark-color;

$v-background-color: $jb-primary-light-color;
$v-app-background-color: $jb-primary-light-color;

$v-loading-indicator-color :  #00FF00;
$v-link-font-color: $jb-primary-dark-color;


@import "../valo/valo.scss";

@mixin jbtheme {
  @include valo;

  // Insert your own theme rules here

.jb-menu-bar {
    @include valo-menubar-style($primary-stylename: v-menubar, $background-color: $jb-primary-dark-color, $unit-size: $v-unit-size);  
}
.jb-menu-bar .v-menubar-menuitem {
	color:$jb-primary-light-color;
}
.jb-menu-bar .v-menubar-menuitem:hover {
	color:#ED3B43;
}
.jb-menu-bar-font {
	color:$jb-primary-light-color;
}
.jb-menu-bar-font:hover {
	color:#ED3B43;
}
.jb-header-top {
	background-color: #FFFBCF;
}
.login-inner-panel-layout {
	background-color: #FFFFFF;
}
.v-table-header {
	background-color: $jb-primary-dark-color;
	color: #f4ebeb;
}

.expandable-panel-border {
	background-color: $jb-primary-dark-color;
	color: #f4ebeb;
    padding: 8px 0px;
}
.expandable-panel-content-container {
	border-left: 1px solid $jb-primary-dark-color;
	border-bottom: 1px solid $jb-primary-dark-color;
	border-right: 1px solid $jb-primary-dark-color;
}

.v-table-cell-content-lineColorRed{
    background: #F80000;
    color: #FFFFFD;
}
.v-table-cell-content-lineColorDarkBlue {
	background-color: #3366FF;
	color: #000000;
}
.v-table-cell-content-lineColorBlue{
	background-color: #66CCFF;
	color: #FFFFFD;
}
.v-table-cell-content-lineColorGreen{
	background-color: #00FF99;
	color: #000000;
}
.mark-red{
	background: #F80000;
}
}

以上是关于scss 珠三角的J&B主题文件的主要内容,如果未能解决你的问题,请参考以下文章

scss 用于Web应用程序TST环境的J&B主题文件

使用 SCSS 创建具有动态方向的三角形

蓝桥杯--升级版三角形

上下三角及对角方阵

如何在其他 scss 文件中使用角度材质主题颜色变量

用JAVA打印杨辉三角…