@import '~@delon/theme/styles/antd/themes/default.less';
|
@import '~@delon/abc/utils/utils.less';
|
|
:host ::ng-deep {
|
.page-header {
|
display: flex;
|
.avatar {
|
flex: 0 1 72px;
|
margin-bottom: 8px;
|
.ant-avatar {
|
border-radius: 72px;
|
display: block;
|
width: 72px;
|
height: 72px;
|
}
|
}
|
.desc {
|
position: relative;
|
top: 4px;
|
margin-left: 24px;
|
flex: 1 1 auto;
|
color: @text-color-secondary;
|
line-height: 22px;
|
.desc-title {
|
font-size: 20px;
|
line-height: 28px;
|
font-weight: 500;
|
color: @heading-color;
|
margin-bottom: 12px;
|
}
|
}
|
}
|
|
.page-extra {
|
.clearfix();
|
float: right;
|
& > div {
|
padding: 0 32px;
|
position: relative;
|
float: left;
|
& > p:first-child {
|
color: @text-color-secondary;
|
font-size: @font-size-base;
|
line-height: 22px;
|
margin-bottom: 4px;
|
}
|
& > p {
|
color: @heading-color;
|
font-size: 30px;
|
line-height: 38px;
|
margin: 0;
|
& > span {
|
color: @text-color-secondary;
|
font-size: 20px;
|
}
|
}
|
&:after {
|
background-color: @border-color-split;
|
position: absolute;
|
top: 8px;
|
right: 0;
|
width: 1px;
|
height: 40px;
|
content: "";
|
}
|
}
|
& > div:last-child {
|
padding-right: 0;
|
&:after {
|
display: none;
|
}
|
}
|
}
|
|
.project-list {
|
.ant-card-meta-description {
|
color: @text-color-secondary;
|
height: 44px;
|
line-height: 22px;
|
overflow: hidden;
|
}
|
.card-title {
|
font-size: 0;
|
a {
|
color: @heading-color;
|
margin-left: 12px;
|
line-height: 24px;
|
height: 24px;
|
display: inline-block;
|
vertical-align: top;
|
font-size: @font-size-base;
|
&:hover {
|
color: @primary-color;
|
}
|
}
|
}
|
|
.project-grid {
|
width: 33.33%;
|
}
|
|
.project-item {
|
display: flex;
|
margin-top: 8px;
|
overflow: hidden;
|
font-size: 12px;
|
height: 20px;
|
line-height: 20px;
|
.textOverflow();
|
a {
|
color: @text-color-secondary;
|
display: inline-block;
|
flex: 1 1 0;
|
.textOverflow();
|
&:hover {
|
color: @primary-color;
|
}
|
}
|
.datetime {
|
color: @disabled-color;
|
flex: 0 0 auto;
|
float: right;
|
}
|
}
|
}
|
|
.activities {
|
padding: 0 24px 8px;
|
.username {
|
color: @text-color;
|
}
|
.event {
|
font-weight: normal;
|
}
|
}
|
|
.members {
|
a {
|
display: block;
|
margin: 12px 0;
|
line-height: 24px;
|
height: 24px;
|
.textOverflow();
|
.member {
|
font-size: @font-size-base;
|
color: @text-color;
|
line-height: 24px;
|
max-width: 100px;
|
vertical-align: top;
|
margin-left: 12px;
|
transition: all .3s;
|
display: inline-block;
|
.textOverflow();
|
}
|
&:hover {
|
span {
|
color: @primary-color;
|
}
|
}
|
}
|
}
|
|
.datetime {
|
color: @disabled-color;
|
}
|
|
.links {
|
padding: 20px 0 8px 24px;
|
font-size: 0;
|
> a {
|
color: rgba(0, 0, 0, 0.65);
|
display: inline-block;
|
font-size: 14px;
|
margin-bottom: 13px;
|
width: 25%;
|
}
|
}
|
|
@media screen and (max-width: @screen-xl) and (min-width: @screen-lg) {
|
.active-card {
|
margin-bottom: 24px;
|
}
|
.members {
|
margin-bottom: 0;
|
}
|
.page-extra {
|
margin-left: -44px;
|
& > div {
|
padding: 0 16px;
|
}
|
}
|
}
|
|
@media screen and (max-width: @screen-lg) {
|
.active-card {
|
margin-bottom: 24px;
|
}
|
.members {
|
margin-bottom: 0;
|
}
|
.page-extra {
|
float: none;
|
margin-right: 0;
|
& > div {
|
padding: 0 16px;
|
text-align: left;
|
&:after {
|
display: none;
|
}
|
}
|
}
|
}
|
|
@media screen and (max-width: @screen-md) {
|
.page-extra {
|
margin-left: -16px;
|
}
|
}
|
|
@media screen and (max-width: @screen-sm) {
|
.page-header {
|
display: block;
|
.desc {
|
margin-left: 0;
|
}
|
}
|
.page-extra {
|
& > div {
|
float: none;
|
}
|
}
|
}
|
|
@media screen and (max-width: @screen-xs) {
|
.project-list {
|
.project-grid {
|
width: 100%;
|
}
|
}
|
}
|
}
|
