manager/my-spring
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

项目初始化

Browse Source
This commit is contained in:
gaoxq
2026-03-19 10:57:24 +08:00
commit ee94d420ad
3822 changed files with 582614 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

328
web-vue/packages/core/design/ant/btn.less Normal file
View File

@@ -0,0 +1,328 @@
// button reset
.ant-btn.ant-btn {
border-radius: 15px;
[data-theme='light'] &-default {
color: @button-default-color;
background-color: @button-default-bg-color;
border-color: @button-default-border-color;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @button-default-hover-color;
background-color: @button-default-hover-bg-color;
border-color: @button-default-hover-border-color;
}
//&.active {
// background-color: @button-default-hover-bg-color;
// border-color: @button-default-hover-border-color;
//}
}
&-primary {
color: @white;
background-color: @button-primary-color;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @white;
background-color: @button-primary-hover-color;
}
&:not(&-background-ghost):not([disabled]) {
color: @white;
}
&:disabled {
color: @white;
background-color: fade(@primary-color, 70%);
}
}
&-link {
&:hover,
&:focus,
&:active,
&:not(:disabled):hover,
&:not(:disabled):focus,
&:not(:disabled):active {
border-color: transparent !important;
}
}
[data-theme='light'] &.ant-btn-link.is-disabled {
color: rgb(0 0 0 / 25%);
text-shadow: none;
cursor: not-allowed !important;
background-color: transparent !important;
border-color: transparent !important;
box-shadow: none;
}
[data-theme='dark'] &.ant-btn-link.is-disabled {
color: rgb(255 255 255 / 25%) !important;
text-shadow: none;
cursor: not-allowed !important;
background-color: transparent !important;
border-color: transparent !important;
box-shadow: none;
}
&-success.ant-btn-link:not([disabled='disabled']) {
color: @button-success-color;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @button-success-hover-color;
border-color: transparent;
}
&:active {
color: @button-success-active-color;
}
}
&-success.ant-btn-link.ant-btn-loading,
&-warning.ant-btn-link.ant-btn-loading,
&-error.ant-btn-link.ant-btn-loading,
&-background-ghost.ant-btn-link.ant-btn-loading,
&.ant-btn-link.ant-btn-loading {
&::before {
background: transparent;
}
}
&-success:not(.ant-btn-link):not(.is-disabled) {
color: @white;
background-color: @button-success-color;
border-color: @button-success-color;
//border-width: 0;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @white;
background-color: @button-success-hover-color;
border-color: @button-success-hover-color;
}
&:active,
&:not(:disabled):active {
background-color: @button-success-active-color;
border-color: @button-success-active-color;
}
}
&-warning.ant-btn-link:not([disabled='disabled']) {
color: @button-warn-color;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @button-warn-hover-color;
border-color: transparent;
}
&:active,
&:not(:disabled):active {
color: @button-warn-active-color;
}
}
&-warning:not(.ant-btn-link):not(.is-disabled) {
color: @white;
background-color: @button-warn-color;
border-color: @button-warn-color;
//border-width: 0;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @white;
background-color: @button-warn-hover-color;
border-color: @button-warn-hover-color;
}
&:active,
&:not(:disabled):active {
background-color: @button-warn-active-color;
border-color: @button-warn-active-color;
}
}
&-error.ant-btn-link:not([disabled='disabled']) {
color: @button-error-color;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @button-error-hover-color;
border-color: transparent;
}
&:active,
&:not(:disabled):active {
color: @button-error-active-color;
}
}
&-error:not(.ant-btn-link):not(.is-disabled) {
color: @white;
background-color: @button-error-color;
border-color: @button-error-color;
//border-width: 0;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @white;
background-color: @button-error-hover-color;
border-color: @button-error-hover-color;
}
&:active,
&:not(:disabled):active {
background-color: @button-error-active-color;
border-color: @button-error-active-color;
}
}
&-background-ghost {
border-width: 1px;
background-color: transparent !important;
&[disabled],
&[disabled]:hover {
color: fade(@white, 40%) !important;
background-color: transparent !important;
border-color: fade(@white, 40%) !important;
}
}
&-dashed&-background-ghost,
&-default&-background-ghost {
color: @button-ghost-color;
border-color: @button-ghost-color;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @button-ghost-hover-color;
border-color: @button-ghost-hover-color;
}
&:active,
&:not(:disabled):active {
color: @button-ghost-active-color;
border-color: @button-ghost-active-color;
}
&[disabled],
&[disabled]:hover {
color: fade(@white, 40%) !important;
border-color: fade(@white, 40%) !important;
}
}
&-background-ghost&-success:not(.ant-btn-link) {
color: @button-success-color;
background-color: transparent;
border-color: @button-success-color;
border-width: 1px;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @button-success-hover-color !important;
border-color: @button-success-hover-color;
}
&:active,
&:not(:disabled):active {
color: @button-success-active-color;
border-color: @button-success-active-color;
}
}
&-background-ghost&-warning:not(.ant-btn-link) {
color: @button-warn-color;
background-color: transparent;
border-color: @button-warn-color;
border-width: 1px;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @button-warn-hover-color !important;
border-color: @button-warn-hover-color;
}
&:active {
color: @button-warn-active-color;
border-color: @button-warn-active-color;
}
}
&-background-ghost&-error:not(.ant-btn-link) {
color: @button-error-color;
background-color: transparent;
border-color: @button-error-color;
border-width: 1px;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @button-error-hover-color !important;
border-color: @button-error-hover-color;
}
&:active,
&:not(:disabled):active {
color: @button-error-active-color;
border-color: @button-error-active-color;
}
}
&-ghost.ant-btn-link:not([disabled='disabled']) {
color: @button-ghost-color;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: @button-ghost-hover-color;
border-color: transparent;
}
}
&.purple {
color: #fff !important;
border-color: #605ca8 !important;
background-color: #605ca8 !important;
&:hover,
&:focus,
&:not(:disabled):hover,
&:not(:disabled):focus {
color: #fff !important;
border-color: lighten(#605ca8, 10%) !important;
background-color: lighten(#605ca8, 10%) !important;
}
}
}

116
web-vue/packages/core/design/ant/index.less Normal file
View File

@@ -0,0 +1,116 @@
@import './pagination.less';
@import './input.less';
@import './btn.less';
// @import './table.less';
.ant-image-preview-root {
img {
display: unset;
}
}
// span.anticon:not(.jeesite-icon) {
// vertical-align: 0.125em !important;
// }
.ant-back-top {
right: 20px;
bottom: 20px;
}
.collapse-container__body {
> .ant-descriptions {
margin-left: 6px;
}
}
.ant-image-preview-operations {
background-color: rgb(0 0 0 / 30%);
}
.ant-popover {
&-content {
box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
}
}
.ant-modal > div[aria-hidden='true'] {
display: none !important;
}
// =================================
// ========= modal message =========
// =================================
.modal-icon-warning {
color: @warning-color !important;
}
.modal-icon-success {
color: @success-color !important;
}
.modal-icon-error {
color: @error-color !important;
}
.modal-icon-info {
color: @primary-color !important;
}
.modal-posfull-content {
max-height: 300px;
overflow-y: auto;
}
// =================================
// ======= common components =======
// =================================
.ant-checkbox-checked .ant-checkbox-inner::after,
.ant-tree-checkbox-checked .ant-tree-checkbox-inner::after {
border-top: 0 !important;
border-left: 0 !important;
}
.ant-tree,
.ant-select-tree {
// &-list-holder {
// overflow-x: hidden !important;
// }
&-list-scrollbar-show {
display: block !important;
width: 6px !important;
}
&-list-scrollbar-thumb {
background: rgb(0 0 0 / 20%) !important;
}
}
.ant-tag {
font-size: 14px !important;
}
html[data-theme='dark'] {
h1,
h2,
h3,
h4,
h5,
h6 {
color: rgb(255 255 255 / 65%);
}
.ant-tree,
.ant-select-tree {
&-list-scrollbar-thumb {
background: rgb(255 255 255 / 20%) !important;
}
}
}
// fix unocss for login.vue
@media (max-width: @screen-md) {
.md\:hidden {
display: none;
}
}

34
web-vue/packages/core/design/ant/input.less Normal file
View File

@@ -0,0 +1,34 @@
@import (reference) '../var/color.less';
// input
.ant-input {
&-number {
min-width: 110px;
}
}
.ant-input-affix-wrapper .ant-input-suffix {
right: 9px;
}
.ant-input-clear-icon {
margin-right: 5px;
}
.ant-input-affix-wrapper-textarea-with-clear-btn {
padding: 0 !important;
textarea.ant-input {
padding: 4px;
}
}
.ant-input-group {
.ant-btn-icon-only.ant-btn-sm > * {
font-size: 16px;
}
svg {
vertical-align: initial;
}
}

119
web-vue/packages/core/design/ant/pagination.less Normal file
View File

@@ -0,0 +1,119 @@
html[data-theme='dark'] {
.ant-pagination.ant-pagination {
&-mini {
.ant-pagination-prev,
.ant-pagination-next,
.ant-pagination-item {
background-color: rgb(255 255 255 / 4%) !important;
a {
color: #8b949e !important;
}
}
.ant-select-arrow {
color: @text-color-secondary !important;
}
.ant-pagination-item-active {
// background-color: @primary-color !important;
background: fade(#2a50ed, 85) !important;
border: none;
border-radius: none !important;
a {
color: @white !important;
}
}
}
.ant-select-status-error {
.ant-select-selector {
border-color: #424242 !important;
}
}
}
}
.ant-pagination.ant-pagination {
&-mini {
.ant-pagination-prev,
.ant-pagination-next {
font-size: 12px;
color: @text-color-base;
border: 1px solid;
}
.ant-pagination-prev:hover,
.ant-pagination-next:hover,
.ant-pagination-item:focus,
.ant-pagination-item:hover {
a {
color: @primary-color;
}
}
.ant-pagination-prev,
.ant-pagination-next,
.ant-pagination-item {
margin: 0 4px !important;
background-color: #f4f4f5 !important;
border: none;
border-radius: 4px !important;
a {
margin-top: 1px;
color: #606266;
}
&:last-child {
margin-right: 0 !important;
}
}
.ant-pagination-item-active {
background-color: @primary-color !important;
border: none;
border-radius: none !important;
a {
color: @white !important;
}
}
.ant-pagination-options {
margin-left: 12px;
}
.ant-pagination-options-quick-jumper input {
height: 22px;
margin: 0 6px;
line-height: 22px;
text-align: center;
}
.ant-select-arrow {
color: @border-color-shallow-dark;
}
}
.ant-select.ant-select-in-form-item {
width: auto;
}
&-disabled {
display: none !important;
}
.ant-select-status-error {
.ant-select-selector {
border-color: @border-color-base !important;
}
}
.ant-select-focused.ant-select-status-error {
.ant-select-selector {
box-shadow: 0 0 0 2px fade(@border-color-base, 10%) !important;
}
}
}

76
web-vue/packages/core/design/ant/table.less Normal file
View File

@@ -0,0 +1,76 @@
@prefix-cls: ~'jeesite-basic-table';
// fix table unnecessary scrollbar
.@{prefix-cls} {
.hide-scrollbar-y {
.ant-spin-nested-loading {
.ant-spin-container {
.ant-table {
.ant-table-content {
.ant-table-scroll {
.ant-table-hide-scrollbar {
overflow-y: auto !important;
}
.ant-table-body {
overflow-y: auto !important;
}
}
.ant-table-fixed-right {
.ant-table-body-outer {
.ant-table-body-inner {
overflow-y: auto !important;
}
}
}
.ant-table-fixed-left {
.ant-table-body-outer {
.ant-table-body-inner {
overflow-y: auto !important;
}
}
}
}
}
}
}
}
.hide-scrollbar-x {
.ant-spin-nested-loading {
.ant-spin-container {
.ant-table {
.ant-table-content {
.ant-table-scroll {
.ant-table-hide-scrollbar {
//overflow-x: auto !important;
}
.ant-table-body {
overflow: auto !important;
}
}
.ant-table-fixed-right {
.ant-table-body-outer {
.ant-table-body-inner {
overflow-x: auto !important;
}
}
}
.ant-table-fixed-left {
.ant-table-body-outer {
.ant-table-body-inner {
overflow-x: auto !important;
}
}
}
}
}
}
}
}
}

183
web-vue/packages/core/design/entry.less Normal file
View File

@@ -0,0 +1,183 @@
* > .enter-x:nth-child(1) {
transform: translateX(50px);
}
* > .-enter-x:nth-child(1) {
transform: translateX(-50px);
}
* > .enter-x:nth-child(1),
* > .-enter-x:nth-child(1) {
z-index: 9;
opacity: 0;
animation: enter-x-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.1s;
}
* > .enter-x:nth-child(2) {
transform: translateX(50px);
}
* > .-enter-x:nth-child(2) {
transform: translateX(-50px);
}
* > .enter-x:nth-child(2),
* > .-enter-x:nth-child(2) {
z-index: 8;
opacity: 0;
animation: enter-x-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.2s;
}
* > .enter-x:nth-child(3) {
transform: translateX(50px);
}
* > .-enter-x:nth-child(3) {
transform: translateX(-50px);
}
* > .enter-x:nth-child(3),
* > .-enter-x:nth-child(3) {
z-index: 7;
opacity: 0;
animation: enter-x-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.3s;
}
* > .enter-x:nth-child(4) {
transform: translateX(50px);
}
* > .-enter-x:nth-child(4) {
transform: translateX(-50px);
}
* > .enter-x:nth-child(4),
* > .-enter-x:nth-child(4) {
z-index: 6;
opacity: 0;
animation: enter-x-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.4s;
}
* > .enter-x:nth-child(5) {
transform: translateX(50px);
}
* > .-enter-x:nth-child(5) {
transform: translateX(-50px);
}
* > .enter-x:nth-child(5),
* > .-enter-x:nth-child(5) {
z-index: 5;
opacity: 0;
animation: enter-x-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.5s;
}
* > .enter-y:nth-child(1) {
transform: translateX(50px);
}
* > .-enter-y:nth-child(1) {
transform: translateX(-50px);
}
* > .enter-y:nth-child(1),
* > .-enter-y:nth-child(1) {
z-index: 9;
opacity: 0;
animation: enter-y-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.1s;
}
* > .enter-y:nth-child(2) {
transform: translateX(50px);
}
* > .-enter-y:nth-child(2) {
transform: translateX(-50px);
}
* > .enter-y:nth-child(2),
* > .-enter-y:nth-child(2) {
z-index: 8;
opacity: 0;
animation: enter-y-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.2s;
}
* > .enter-y:nth-child(3) {
transform: translateX(50px);
}
* > .-enter-y:nth-child(3) {
transform: translateX(-50px);
}
* > .enter-y:nth-child(3),
* > .-enter-y:nth-child(3) {
z-index: 7;
opacity: 0;
animation: enter-y-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.3s;
}
* > .enter-y:nth-child(4) {
transform: translateX(50px);
}
* > .-enter-y:nth-child(4) {
transform: translateX(-50px);
}
* > .enter-y:nth-child(4),
* > .-enter-y:nth-child(4) {
z-index: 6;
opacity: 0;
animation: enter-y-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.4s;
}
* > .enter-y:nth-child(5) {
transform: translateX(50px);
}
* > .-enter-y:nth-child(5) {
transform: translateX(-50px);
}
* > .enter-y:nth-child(5),
* > .-enter-y:nth-child(5) {
z-index: 5;
opacity: 0;
animation: enter-y-animation 0.4s ease-in-out 0.3s;
animation-fill-mode: forwards;
animation-delay: 0.5s;
}
@keyframes enter-x-animation {
to {
opacity: 1;
transform: translateX(0);
}
}
@keyframes enter-y-animation {
to {
opacity: 1;
transform: translateY(0);
}
}

84
web-vue/packages/core/design/index.less Normal file
View File

@@ -0,0 +1,84 @@
@import './transition/index.less';
@import './var/index.less';
@import './ant/index.less';
@import './public.less';
@import './theme.less';
@import './entry.less';
input:-webkit-autofill {
box-shadow: 0 0 0 1000px white inset !important;
}
:-webkit-autofill {
transition: background-color 5000s ease-in-out 0s !important;
}
html {
overflow: hidden;
text-size-adjust: 100%;
}
html,
body {
width: 100%;
height: 100%;
overflow: visible !important;
overflow-x: hidden !important;
&.color-weak {
filter: invert(80%);
}
&.gray-mode {
filter: grayscale(100%);
filter: progid:dximagetransform.microsoft.basicimage(grayscale=1);
}
}
a:focus,
a:active,
button,
div,
svg,
span {
outline: none !important;
}
.table {
width: 100%;
border-spacing: 0;
border-collapse: collapse;
border: 1px solid #f0f0f0;
th,
td {
padding: 8px;
border: 1px solid #f0f0f0;
vertical-align: middle;
}
th {
font-weight: normal;
background-color: #fafafa;
}
tr:hover {
background-color: #fafafa;
.table {
background-color: #fff;
}
}
}
.ant-tabs {
.ant-tabs-tab-btn {
color: fade(@text-color-base, 75);
}
}
.ant-card {
.ant-card-head-title {
font-weight: normal;
}
}

54
web-vue/packages/core/design/public.less Normal file
View File

@@ -0,0 +1,54 @@
#app {
width: 100%;
height: 100%;
}
ul {
list-style-type: none;
padding-left: 0;
}
// =================================
// ==============scrollbar==========
// =================================
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background-color: rgb(0 0 0 / 5%);
border-radius: 8px;
}
::-webkit-scrollbar-thumb {
background-color: rgb(144 147 153 / 20%);
border-radius: 8px;
}
::-webkit-scrollbar-thumb:hover {
background-color: @border-color-dark;
}
::-webkit-scrollbar-corner {
background: transparent;
}
// =================================
// ==============nprogress==========
// =================================
//#nprogress {
// pointer-events: none;
//
// .bar {
// position: fixed;
// top: 0;
// left: 0;
// z-index: 99999;
// width: 100%;
// height: 2px;
// background-color: @primary-color;
// opacity: 0.75;
// }
//}

89
web-vue/packages/core/design/theme.less Normal file
View File

@@ -0,0 +1,89 @@
.bg-white {
background-color: @component-background !important;
}
html[data-theme='light'] {
.text-secondary {
color: rgb(0 0 0 / 45%);
}
.ant-alert-success {
background-color: #f6ffed;
border: 1px solid #b7eb8f;
}
.ant-alert-error {
background-color: #fff2f0;
border: 1px solid #ffccc7;
}
.ant-alert-warning {
background-color: #fffbe6;
border: 1px solid #ffe58f;
}
// :not(:root):fullscreen::backdrop {
// background-color: @layout-body-background !important;
// }
}
html[data-theme='dark'] {
.text-secondary {
color: #8b949e;
}
.ant-card-grid-hoverable:hover {
box-shadow:
0 3px 6px -4px rgb(0 0 0 / 48%),
0 6px 16px 0 rgb(0 0 0 / 32%),
0 9px 28px 8px rgb(0 0 0 / 20%);
}
.ant-card-grid {
box-shadow:
1px 0 0 0 #434343,
0 1px 0 0 #434343,
1px 1px 0 0 #434343,
1px 0 0 0 #434343 inset,
0 1px 0 0 #434343 inset;
}
.ant-calendar-selected-day .ant-calendar-date {
color: rgb(0 0 0 / 80%);
}
.ant-select-tree li .ant-select-tree-node-content-wrapper.ant-select-tree-node-selected {
color: rgb(0 0 0 / 90%);
}
.table {
border: 1px solid #333;
th,
td {
border: 1px solid #333;
}
th {
background-color: #222;
}
tr:hover {
background-color: #222;
.table {
background-color: #111;
}
}
}
.ant-picker-input {
& > input,
& > input:hover,
& > input:focus,
& > input-focused {
border-color: transparent;
box-shadow: none;
}
}
}

18
web-vue/packages/core/design/transition/base.less Normal file
View File

@@ -0,0 +1,18 @@
.transition-default() {
&-enter-active,
&-leave-active {
transition: 0.1s cubic-bezier(0.25, 0.8, 0.5, 1) !important;
}
&-move {
transition: transform 0.1s;
}
}
.expand-transition {
.transition-default();
}
.expand-x-transition {
.transition-default();
}

85
web-vue/packages/core/design/transition/fade.less Normal file
View File

@@ -0,0 +1,85 @@
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.1s ease-in-out;
}
.fade-enter-from,
.fade-leave-to {
opacity: 0;
}
/* fade-slide */
.fade-slide-leave-active,
.fade-slide-enter-active {
transition: all 0.1s;
}
.fade-slide-enter-from {
opacity: 0;
transform: translateX(-30px);
}
.fade-slide-leave-to {
opacity: 0;
transform: translateX(30px);
}
// ///////////////////////////////////////////////
// Fade Bottom
// ///////////////////////////////////////////////
// Speed: 1x
.fade-bottom-enter-active,
.fade-bottom-leave-active {
transition:
opacity 0.25s,
transform 0.3s;
}
.fade-bottom-enter-from {
opacity: 0;
transform: translateY(-10%);
}
.fade-bottom-leave-to {
opacity: 0;
transform: translateY(10%);
}
// fade-scale
.fade-scale-leave-active,
.fade-scale-enter-active {
transition: all 0.28s;
}
.fade-scale-enter-from {
opacity: 0;
transform: scale(1.2);
}
.fade-scale-leave-to {
opacity: 0;
transform: scale(0.8);
}
// ///////////////////////////////////////////////
// Fade Top
// ///////////////////////////////////////////////
// Speed: 1x
.fade-top-enter-active,
.fade-top-leave-active {
transition:
opacity 0.2s,
transform 0.25s;
}
.fade-top-enter-from {
opacity: 0;
transform: translateY(8%);
}
.fade-top-leave-to {
opacity: 0;
transform: translateY(-8%);
}

13
web-vue/packages/core/design/transition/index.less Normal file
View File

@@ -0,0 +1,13 @@
@import './base.less';
@import './fade.less';
@import './scale.less';
@import './slide.less';
@import './scroll.less';
@import './zoom.less';
.collapse-transition {
transition:
0.1s height ease-in-out,
0.1s padding-top ease-in-out,
0.1s padding-bottom ease-in-out;
}

21
web-vue/packages/core/design/transition/scale.less Normal file
View File

@@ -0,0 +1,21 @@
.scale-transition {
.transition-default();
&-enter-from,
&-leave,
&-leave-to {
opacity: 0;
transform: scale(0);
}
}
.scale-rotate-transition {
.transition-default();
&-enter-from,
&-leave,
&-leave-to {
opacity: 0;
transform: scale(0) rotate(-45deg);
}
}

67
web-vue/packages/core/design/transition/scroll.less Normal file
View File

@@ -0,0 +1,67 @@
.scroll-y-transition {
.transition-default();
&-enter-from,
&-leave-to {
opacity: 0;
}
&-enter-from {
transform: translateY(-15px);
}
&-leave-to {
transform: translateY(15px);
}
}
.scroll-y-reverse-transition {
.transition-default();
&-enter-from,
&-leave-to {
opacity: 0;
}
&-enter-from {
transform: translateY(15px);
}
&-leave-to {
transform: translateY(-15px);
}
}
.scroll-x-transition {
.transition-default();
&-enter-from,
&-leave-to {
opacity: 0;
}
&-enter-from {
transform: translateX(-15px);
}
&-leave-to {
transform: translateX(15px);
}
}
.scroll-x-reverse-transition {
.transition-default();
&-enter-from,
&-leave-to {
opacity: 0;
}
&-enter-from {
transform: translateX(15px);
}
&-leave-to {
transform: translateX(-15px);
}
}

39
web-vue/packages/core/design/transition/slide.less Normal file
View File

@@ -0,0 +1,39 @@
.slide-y-transition {
.transition-default();
&-enter-from,
&-leave-to {
opacity: 0;
transform: translateY(-15px);
}
}
.slide-y-reverse-transition {
.transition-default();
&-enter-from,
&-leave-to {
opacity: 0;
transform: translateY(15px);
}
}
.slide-x-transition {
.transition-default();
&-enter-from,
&-leave-to {
opacity: 0;
transform: translateX(-15px);
}
}
.slide-x-reverse-transition {
.transition-default();
&-enter-from,
&-leave-to {
opacity: 0;
transform: translateX(15px);
}
}

31
web-vue/packages/core/design/transition/zoom.less Normal file
View File

@@ -0,0 +1,31 @@
// zoom-out
.zoom-out-enter-active,
.zoom-out-leave-active {
transition:
opacity 0.1 ease-in-out,
transform 0.15s ease-out;
}
.zoom-out-enter-from,
.zoom-out-leave-to {
opacity: 0;
transform: scale(0);
}
// zoom-fade
.zoom-fade-enter-active,
.zoom-fade-leave-active {
transition:
transform 0.1s,
opacity 0.3s ease-out;
}
.zoom-fade-enter-from {
opacity: 0;
transform: scale(0.92);
}
.zoom-fade-leave-to {
opacity: 0;
transform: scale(1.06);
}

33
web-vue/packages/core/design/var/breakpoint.less Normal file
View File

@@ -0,0 +1,33 @@
// =================================
// ==============屏幕断点============
// =================================
// Extra small screen / phone
@screen-xs: 480px;
@screen-xs-min: @screen-xs;
// Small screen / tablet
@screen-sm: 576px;
@screen-sm-min: @screen-sm;
// Medium screen / desktop
@screen-md: 768px;
@screen-md-min: @screen-md;
// Large screen / wide desktop
@screen-lg: 1024px;
@screen-lg-min: @screen-lg;
// Extra large screen / full hd
@screen-xl: 1200px;
@screen-xl-min: @screen-xl;
// Extra extra large screen / large desktop
@screen-2xl: 1600px;
@screen-2xl-min: @screen-2xl;
@screen-xs-max: (@screen-sm-min - 1px);
@screen-sm-max: (@screen-md-min - 1px);
@screen-md-max: (@screen-lg-min - 1px);
@screen-lg-max: (@screen-xl-min - 1px);
@screen-xl-max: (@screen-2xl-min - 1px);

140
web-vue/packages/core/design/var/color.less Normal file
View File

@@ -0,0 +1,140 @@
html {
// header
--header-bg-color: #394664;
--header-bg-hover-color: #273352;
--header-active-menu-bg-color: #273352;
// sider
--sider-dark-bg-color: #273352;
--sider-dark-darken-bg-color: #273352;
--sider-dark-lighten-bg-color: #273352;
}
@white: #fff;
@content-bg: #f0f2f5;
@content-bg-striped: #fafafa;
// :export {
// name: "less";
// mainColor: @mainColor;
// fontSize: @fontSize;
// }
//@iconify-bg-color: #5551;
// =================================
// ===========border-color==========
// =================================
// Dark-dark
@border-color-dark: #b6b7b9;
// Dark-light
@border-color-shallow-dark: #cececd;
// Light-dark
@border-color-light: #ccc;
// =================================
// =============message=============
// =================================
// success-bg-color
@success-background-color: #f1f9ec;
// info-bg-color
@info-background-color: #e8eff8;
// warn-bg-color
@warning-background-color: #fdf6ed;
// danger-bg-color
@danger-background-color: #fef0f0;
// =================================
// ==============Header=============
// =================================
@header-dark-bg-color: var(--header-bg-color);
@header-dark-bg-hover-color: var(--header-bg-hover-color);
@header-light-bg-hover-color: #f6f6f6;
@header-light-desc-color: #7c8087;
@header-light-bottom-border-color: #eaeaea;
// top-menu
@top-menu-active-bg-color: var(--header-active-menu-bg-color);
// =================================
// ==============Menu============
// =================================
// let -menu
@sider-dark-bg-color: var(--sider-dark-bg-color);
@sider-dark-darken-bg-color: var(--sider-dark-darken-bg-color);
@sider-dark-lighten-bg-color: var(--sider-dark-lighten-bg-color);
// trigger
@trigger-dark-hover-bg-color: rgba(255, 255, 255, 0.2);
@trigger-dark-bg-color: rgba(255, 255, 255, 0.1);
// =================================
// ==============tree===============
// =================================
// tree item hover background
@tree-hover-background-color: #f5f7fa;
// tree item hover font color
@tree-hover-font-color: #f5f7fa;
// =================================
// ==============link===============
// =================================
@link-hover-color: @primary-color;
@link-active-color: darken(@primary-color, 10%);
// =================================
// ===========Text color============
// =================================
// Main text color
@text-color-base: @text-color;
// Label color
@text-color-call-out: #606266;
// Auxiliary information color-dark
@text-color-help-dark: #909399;
// =================================
// ============breadcrumb===========
// =================================
@breadcrumb-item-normal-color: #999;
// =================================
// =============button==============
// =================================
@button-default-color: @text-color-base;
@button-default-bg-color: #fff;
@button-default-border-color: @border-color-light;
@button-default-hover-color: #333333;
@button-default-hover-bg-color: #f1f1f1;
@button-default-hover-border-color: #bfbfbf;
@button-primary-color: fade(@primary-color, 95%);
@button-primary-hover-color: fade(@primary-color, 90%);
@button-primary-active-color: fade(@primary-color, 90%);
@button-ghost-color: @white;
@button-ghost-hover-color: lighten(@white, 10%);
@button-ghost-hover-bg-color: #e1ebf6;
@button-ghost-active-color: darken(@white, 10%);
@button-success-color: @success-color;
@button-success-hover-color: lighten(@success-color, 10%);
@button-success-active-color: darken(@success-color, 10%);
@button-warn-color: @warning-color;
@button-warn-hover-color: lighten(@warning-color, 10%);
@button-warn-active-color: darken(@warning-color, 10%);
@button-error-color: @error-color;
@button-error-hover-color: lighten(@error-color, 10%);
@button-error-active-color: darken(@error-color, 10%);

18
web-vue/packages/core/design/var/easing.less Normal file
View File

@@ -0,0 +1,18 @@
// =================================
// ==============动画函数-===========
// =================================
@ease-base-out: cubic-bezier(0.7, 0.3, 0.1, 1);
@ease-base-in: cubic-bezier(0.9, 0, 0.3, 0.7);
@ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);
@ease-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);
@ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
@ease-out-back: cubic-bezier(0.12, 0.4, 0.29, 1.46);
@ease-in-back: cubic-bezier(0.71, -0.46, 0.88, 0.6);
@ease-in-out-back: cubic-bezier(0.71, -0.46, 0.29, 1.46);
@ease-out-circ: cubic-bezier(0.08, 0.82, 0.17, 1);
@ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.34);
@ease-in-out-circ: cubic-bezier(0.78, 0.14, 0.15, 0.86);
@ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
@ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
@ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);

27
web-vue/packages/core/design/var/index.less Normal file
View File

@@ -0,0 +1,27 @@
@import (reference) 'color.less';
@import 'easing';
@import 'breakpoint';
// headers、HEADER_HEIGHT
@header-height: 48px;
// logo width
@logo-width: 32px;
@side-drag-z-index: 200;
@page-loading-z-index: 10000;
@lock-page-z-index: 3000;
@layout-header-fixed-z-index: 500;
@multiple-tab-fixed-z-index: 505;
@layout-sider-fixed-z-index: 510;
@layout-mix-sider-fixed-z-index: 550;
@preview-comp-z-index: 1000;
@page-footer-z-index: 99;