Skip to content

G
gs1
Commit 90ee293a by Tang
Options

feat: 整合

parent 844ab0ff
Showing with 217 additions and 221 deletions
src/assets/css/layout.scss
.el-container.layout{
min-height: 100vh;
.el-container.layout {
min-height: 100vh;
}
.el-container.is-vertical{
height: 100vh;
overflow: hidden;
.el-container.is-vertical {
height: 100vh;
overflow: hidden;
}
.el-header{
$header-height: 65px;
padding: 0px;
header {
height: $header-height;
padding: 0 25px;
.header-user {
height: $header-height;
float:left;
display: -webkit-flex;
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
img {
width: 40px;
height: 40px;
border-radius: 50%;
vertical-align: middle;
}
div {
margin-left: 8px;
p {
padding: 3px 0;
font-size: 10px;
&.user-name {
color: #7A7878;
}
&.user-role {
font-size: 14px;
color: #353434;
}
}
}
}
.header-logout {
float:right;
height: $header-height;
line-height: $header-height;
span {
padding: 15px 5px;
height: 30px;
line-height: 30px;
cursor: pointer;
img {
display: inline-block;
width: 12px;
height: 12px;
vertical-align: middle;
}
p {
margin-left: 4px;
display: inline-block;
font-size: 10px;
color: #7A7878;
}
}
}
}
.el-header {
$header-height: 65px;
padding: 0px;
header {
height: $header-height;
padding: 0 25px;
.header-user {
height: $header-height;
float: left;
display: -webkit-flex;
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
img {
width: 40px;
height: 40px;
border-radius: 50%;
vertical-align: middle;
}
div {
margin-left: 8px;
p {
padding: 3px 0;
font-size: 10px;
&.user-name {
color: #7a7878;
}
&.user-role {
font-size: 14px;
color: #353434;
}
}
}
}
.header-logout {
float: right;
height: $header-height;
line-height: $header-height;
span {
padding: 15px 5px;
height: 30px;
line-height: 30px;
cursor: pointer;
img {
display: inline-block;
width: 12px;
height: 12px;
vertical-align: middle;
}
p {
margin-left: 4px;
display: inline-block;
font-size: 10px;
color: #7a7878;
}
}
}
}
}
.el-aside{
height: 100vh;
overflow: visible;
background: $side-bg-color;
.el-menu{
border-right: none;
background: $side-bg-color;
.menu-logo {
height: 88px;
background: $side-menu-active-color;
box-shadow:0px 5px 5px 0px #260D0408;
border-radius:0 0 30px 30px;
display: flex;
justify-content: center;
align-items: center;
span {
font-size: 16px;
color: #8A4E22;
font-weight: bold;
img {
width: 30px;
height: 25px;
margin-right: 5px;
}
}
}
.menu-title {
margin-top: 25px;
margin-bottom: 10px;
padding-left: 28px;
font-size: 12px;
color:#B7B6B6;
}
.el-menu-item {
height: 50px;
line-height: 50px;
color: #6B6A6A;
background: transparent;
font-size: 16px;
i {
color: $side-bg-color;
font-size: 25px;
position: absolute;
top: 15px;
right: 15px;
}
&:hover,
&:focus,
&.is-active {
color: $side-bg-color;
background: $side-menu-active-color;
}
}
}
.el-aside {
height: 100vh;
overflow: visible;
background: $side-bg-color;
.el-menu {
border-right: none;
background: $side-bg-color;
.menu-logo {
height: 88px;
background: $side-menu-active-color;
box-shadow: 0px 5px 5px 0px #260d0408;
border-radius: 0 0 30px 30px;
display: flex;
justify-content: center;
align-items: center;
span {
font-size: 16px;
color: #8a4e22;
font-weight: bold;
img {
width: 30px;
height: 25px;
margin-right: 5px;
}
}
}
.menu-title {
margin-top: 25px;
margin-bottom: 10px;
padding-left: 28px;
font-size: 12px;
color: #b7b6b6;
}
.el-menu-item {
height: 50px;
line-height: 50px;
color: #6b6a6a;
background: transparent;
font-size: 16px;
i {
color: $side-bg-color;
font-size: 25px;
position: absolute;
top: 15px;
right: 15px;
}
&:hover,
&:focus,
&.is-active {
color: $side-bg-color;
background: $side-menu-active-color;
}
}
}
}
.el-main{
background: $content-bg-color;
padding: 18px 25px 22px 25px;
.main-content{
.content-query{
padding: 0 20px;
background:$bg-color;
border-radius: 14px;
h2{
height: 30px;
line-height: 30px;
font-size: 13px;
color: #5B5A5A;
}
.query-handle{
text-align: right;
}
.el-form {
.el-form-item {
margin-top: 8px;
margin-bottom: 8px;
}
}
}
.content-item{
margin-bottom: 10px;
padding:10px 0;
background:$bg-color;
border-radius: 14px;
.el-tag{
margin:0 5px;
padding:0 5px;
cursor: pointer;
}
}
.content-list{
border-radius: 14px;
margin-top:10px;
padding:10px 0 15px 0;
background:$bg-color;
.list-button{
text-align: right;
margin-bottom:20px;
a{
font-size:14px;
color:$system-color1;
cursor: pointer;
i{
&:before{
margin-right: 5px;
}
}
}
i{
margin:0 5px;
font-size:14px;
color:$system-color1;
cursor: pointer;
&:before{
margin-right: 5px;
}
}
}
}
.content-apply.content-table{
background-color: #fff;
padding:20px 60px;
margin-top:0;
.el-table {
th{
background-color: #f4f4f4;
font-weight: bold;
}
tbody{
tr.el-table__row{
td {
background-color: #fff;//$content-bg-color;
color:#7b7f83;
}
&:hover {
background-color: #fff;
}
&.el-table__row--striped {
td{
background-color:#fff;
}
}
&.el-table__row--striped:hover {
background-color:#fff;
}
}
}
}
}
}
}
\ No newline at end of file
.el-main {
background: $content-bg-color;
padding: 18px 25px 22px 25px;
.main-content {
.content-query {
padding: 0 20px;
background: $bg-color;
border-radius: 14px;
h2 {
height: 30px;
line-height: 30px;
font-size: 13px;
color: #5b5a5a;
}
.query-handle {
text-align: right;
}
.el-form {
.el-form-item {
margin-top: 8px;
margin-bottom: 8px;
}
}
}
.content-item {
margin-bottom: 10px;
padding: 10px 0;
background: $bg-color;
border-radius: 14px;
.el-tag {
margin: 0 5px;
padding: 0 5px;
cursor: pointer;
}
}
.content-list {
border-radius: 14px;
margin-top: 10px;
padding: 10px 0 15px 0;
background: $bg-color;
.list-button {
text-align: right;
margin-bottom: 20px;
a {
font-size: 14px;
color: $system-color1;
cursor: pointer;
i {
&:before {
margin-right: 5px;
}
}
}
i {
margin: 0 5px;
font-size: 14px;
color: $system-color1;
cursor: pointer;
&:before {
margin-right: 5px;
}
}
}
}
.content-apply.content-table {
background-color: #fff;
padding: 20px 60px;
margin-top: 0;
.el-table {
th {
background-color: #f4f4f4;
font-weight: bold;
}
tbody {
tr.el-table__row {
td {
background-color: #fff; //$content-bg-color;
color: #7b7f83;
}
&:hover {
background-color: #fff;
}
&.el-table__row--striped {
td {
background-color: #fff;
}
}
&.el-table__row--striped:hover {
background-color: #fff;
}
}
}
}
}
}
}
src/assets/css/main.scss
// @import "./_reset.scss";
// @import "./element-variables.scss";
@import "./_style.scss";
@import "./_icon.scss";
@import "./_mixin.scss";
......@@ -6,4 +7,4 @@
@import "../../../node_modules/bootstrap/scss/functions";
@import "../../../node_modules/bootstrap/scss/variables";
@import "../../../node_modules/bootstrap/scss/mixins";
// @import "../../../node_modules/bootstrap/scss/bootstrap";
\ No newline at end of file
// @import "../../../node_modules/bootstrap/scss/bootstrap";
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment