no message

This commit is contained in:
kuaifan 2021-05-31 16:28:23 +08:00
parent d95220763a
commit 31f2a5dc16
5 changed files with 102 additions and 53 deletions

View File

@ -5,18 +5,30 @@
<div class="project-title"> Daily Task</div>
<div class="project-subtitle">Click + New To create new list and wait for project manager card Don't Create a card by yourself to manage a good colaboration.</div>
</div>
<ul class="project-icons">
<li class="project-icon">
<Icon type="ios-search-outline" />
</li>
<li class="project-icon">
<Icon type="ios-chatbubbles-outline" />
<Badge :count="999"></Badge>
</li>
<li class="project-avatar online">
<Avatar src="https://i.loli.net/2017/08/21/599a521472424.jpg" />
</li>
</ul>
<div class="project-icobox">
<ul class="project-icons">
<li class="project-icon">
<Icon type="ios-search-outline" />
</li>
<li class="project-icon">
<Icon type="ios-chatbubbles-outline" />
<Badge :count="999"></Badge>
</li>
<li class="project-avatar online">
<Avatar src="https://i.loli.net/2017/08/21/599a521472424.jpg" />
</li>
</ul>
<div class="project-switch">
<div class="project-switch-button">
<div class="project-switch-img active">
<img src="../../../../statics/images/project-panel-blue.svg">
</div>
<div class="project-switch-img">
<img src="../../../../statics/images/project-menu-gray.svg">
</div>
</div>
</div>
</div>
</div>
<div class="project-column">
<ul>
@ -245,8 +257,9 @@
.project-head {
display: flex;
align-items: flex-start;
margin: 32px;
margin: 32px 32px 16px;
.project-titbox {
margin-bottom: 16px;
.project-title {
flex: 1;
color: #333333;
@ -259,54 +272,86 @@
line-height: 24px;
}
}
.project-icons {
.project-icobox {
display: flex;
align-items: center;
flex-direction: column;
justify-content: space-between;
height: 100%;
margin-top: 2px;
margin-left: 80px;
flex-shrink: 0;
> li {
list-style: none;
.project-icons {
display: flex;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
position: relative;
margin-left: 16px;
&.project-icon {
border-radius: 50%;
background-color: #F2F3F5;
.ivu-icon {
font-size: 20px;
flex-shrink: 0;
> li {
list-style: none;
display: flex;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
position: relative;
margin-left: 16px;
&.project-icon {
border-radius: 50%;
background-color: #F2F3F5;
.ivu-icon {
font-size: 20px;
}
.ivu-badge {
position: absolute;
top: -6px;
left: 20px;
transform: scale(0.8);
}
}
.ivu-badge {
position: absolute;
top: -6px;
left: 20px;
transform: scale(0.8);
&.project-avatar {
.ivu-avatar {
width: 36px;
height: 36px;
}
&:before {
content: "";
position: absolute;
right: 0;
bottom: 0;
width: 9px;
height: 9px;
border-radius: 50%;
background-color: #ff0000;
border: 1px solid #ffffff;
z-index: 1;
}
&.online {
&:before {
background-color: #509E76;
}
}
}
}
&.project-avatar {
.ivu-avatar {
width: 36px;
height: 36px;
}
&:before {
content: "";
position: absolute;
right: 0;
bottom: 0;
width: 9px;
height: 9px;
border-radius: 50%;
background-color: #ff0000;
border: 1px solid #ffffff;
z-index: 1;
}
&.online {
&:before {
background-color: #509E76;
}
.project-switch {
display: flex;
justify-content: flex-end;
.project-switch-button {
display: flex;
align-items: center;
background-color: #ffffff;
border-radius: 6px;
.project-switch-img {
width: 32px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 6px;
> img {
width: 16px;
height: 16px;
}
&.active {
border: 1px solid #2d8cf0;
background-color: #e6f7ff;
}
}
}

View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1622448571867" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7934" width="128" height="128" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css"></style></defs><path d="M936.19430083 441.30094987c20.7383885 0 37.70616053 7.06990501 50.90331611 21.20971504S1006.89335097 493.14692043 1006.89335097 512s-7.06990501 35.34952507-21.20971503 49.48933509-30.63625552 21.20971504-49.48933511 21.20971504H87.80569917c-18.85307957 0-35.34952507-7.06990501-49.48933511-21.20971504S17.10664903 530.85307957 17.10664903 512s6.59857847-35.34952507 19.79573403-49.48933509S67.06731066 441.30094987 87.80569917 441.30094987h848.38860166zM87.80569917 299.90284958c-18.85307957 0-35.34952507-7.06990501-49.48933511-21.20971504S17.10664903 248.05687901 17.10664903 229.20379943s6.59857847-35.34952507 19.79573403-49.4893351S67.06731066 158.5047493 87.80569917 158.5047493h848.38860166c20.7383885 0 37.70616053 7.06990501 50.90331611 21.20971503S1006.89335097 210.35071986 1006.89335097 229.20379943s-7.06990501 35.34952507-21.20971503 49.48933511-30.63625552 21.20971504-49.48933511 21.20971504H87.80569917z m848.38860166 424.19430084c20.7383885 0 37.70616053 7.06990501 50.90331611 21.20971504S1006.89335097 775.94312099 1006.89335097 794.79620057s-7.06990501 35.34952507-21.20971503 49.4893351-30.63625552 21.20971504-49.48933511 21.20971503H87.80569917c-18.85307957 0-35.34952507-7.06990501-49.48933511-21.20971503S17.10664903 813.64928014 17.10664903 794.79620057s6.59857847-35.34952507 19.79573403-49.48933511S67.06731066 724.09715042 87.80569917 724.09715042h848.38860166z" fill="#2d8cf0" p-id="7935"></path></svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1622448571867" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7934" width="128" height="128" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css"></style></defs><path d="M936.19430083 441.30094987c20.7383885 0 37.70616053 7.06990501 50.90331611 21.20971504S1006.89335097 493.14692043 1006.89335097 512s-7.06990501 35.34952507-21.20971503 49.48933509-30.63625552 21.20971504-49.48933511 21.20971504H87.80569917c-18.85307957 0-35.34952507-7.06990501-49.48933511-21.20971504S17.10664903 530.85307957 17.10664903 512s6.59857847-35.34952507 19.79573403-49.48933509S67.06731066 441.30094987 87.80569917 441.30094987h848.38860166zM87.80569917 299.90284958c-18.85307957 0-35.34952507-7.06990501-49.48933511-21.20971504S17.10664903 248.05687901 17.10664903 229.20379943s6.59857847-35.34952507 19.79573403-49.4893351S67.06731066 158.5047493 87.80569917 158.5047493h848.38860166c20.7383885 0 37.70616053 7.06990501 50.90331611 21.20971503S1006.89335097 210.35071986 1006.89335097 229.20379943s-7.06990501 35.34952507-21.20971503 49.48933511-30.63625552 21.20971504-49.48933511 21.20971504H87.80569917z m848.38860166 424.19430084c20.7383885 0 37.70616053 7.06990501 50.90331611 21.20971504S1006.89335097 775.94312099 1006.89335097 794.79620057s-7.06990501 35.34952507-21.20971503 49.4893351-30.63625552 21.20971504-49.48933511 21.20971503H87.80569917c-18.85307957 0-35.34952507-7.06990501-49.48933511-21.20971503S17.10664903 813.64928014 17.10664903 794.79620057s6.59857847-35.34952507 19.79573403-49.48933511S67.06731066 724.09715042 87.80569917 724.09715042h848.38860166z" fill="#515a6e" p-id="7935"></path></svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1622448314339" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2852" width="128" height="128" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css"></style></defs><path d="M387.264 473.68h-192c-52.928 0-96-43.072-96-96v-192c0-52.928 43.072-96 96-96h192c52.928 0 96 43.072 96 96v192c0 52.96-43.072 96-96 96z m-192-320c-17.632 0-32 14.368-32 32v192c0 17.632 14.368 32 32 32h192c17.632 0 32-14.368 32-32v-192c0-17.632-14.368-32-32-32h-192z m192 768h-192c-52.928 0-96-43.072-96-96v-192c0-52.928 43.072-96 96-96h192c52.928 0 96 43.072 96 96v192c0 52.96-43.072 96-96 96z m-192-320c-17.632 0-32 14.336-32 32v192c0 17.664 14.368 32 32 32h192c17.632 0 32-14.336 32-32v-192c0-17.664-14.368-32-32-32h-192z m636.864-128h-192c-52.928 0-96-43.072-96-96v-192c0-52.928 43.072-96 96-96h192c52.928 0 96 43.072 96 96v192c0 52.96-43.072 96-96 96z m-192-320c-17.664 0-32 14.368-32 32v192c0 17.632 14.336 32 32 32h192c17.664 0 32-14.368 32-32v-192c0-17.632-14.336-32-32-32h-192z m192 768h-192c-52.928 0-96-43.072-96-96v-192c0-52.928 43.072-96 96-96h192c52.928 0 96 43.072 96 96v192c0 52.96-43.072 96-96 96z m-192-320c-17.664 0-32 14.336-32 32v192c0 17.664 14.336 32 32 32h192c17.664 0 32-14.336 32-32v-192c0-17.664-14.336-32-32-32h-192z" p-id="2853" fill="#2d8cf0"></path></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1622448314339" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2852" width="128" height="128" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css"></style></defs><path d="M387.264 473.68h-192c-52.928 0-96-43.072-96-96v-192c0-52.928 43.072-96 96-96h192c52.928 0 96 43.072 96 96v192c0 52.96-43.072 96-96 96z m-192-320c-17.632 0-32 14.368-32 32v192c0 17.632 14.368 32 32 32h192c17.632 0 32-14.368 32-32v-192c0-17.632-14.368-32-32-32h-192z m192 768h-192c-52.928 0-96-43.072-96-96v-192c0-52.928 43.072-96 96-96h192c52.928 0 96 43.072 96 96v192c0 52.96-43.072 96-96 96z m-192-320c-17.632 0-32 14.336-32 32v192c0 17.664 14.368 32 32 32h192c17.632 0 32-14.336 32-32v-192c0-17.664-14.368-32-32-32h-192z m636.864-128h-192c-52.928 0-96-43.072-96-96v-192c0-52.928 43.072-96 96-96h192c52.928 0 96 43.072 96 96v192c0 52.96-43.072 96-96 96z m-192-320c-17.664 0-32 14.368-32 32v192c0 17.632 14.336 32 32 32h192c17.664 0 32-14.368 32-32v-192c0-17.632-14.336-32-32-32h-192z m192 768h-192c-52.928 0-96-43.072-96-96v-192c0-52.928 43.072-96 96-96h192c52.928 0 96 43.072 96 96v192c0 52.96-43.072 96-96 96z m-192-320c-17.664 0-32 14.336-32 32v192c0 17.664 14.336 32 32 32h192c17.664 0 32-14.336 32-32v-192c0-17.664-14.336-32-32-32h-192z" p-id="2853" fill="#515a6e"></path></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB