self-hosted/focalboard
1
0
Fork 0
mirror of https://github.com/mattermost/focalboard.git synced 2025-01-11 18:13:52 +02:00
Code Issues Releases Activity

Moving css aside the components

Browse Source
This commit is contained in:
Jesús Espino 2020-10-25 22:01:53 +01:00
parent 03c6a3461f
commit 07f8f7eb55
4 changed files with 72 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
webapp/src/components/boardCard.scss
View File

@ -1,12 +1,53 @@
.BoardCard {
flex: 0 0 auto;
position: relative;
display: flex;
flex-direction: column;
align-items: flex-start;
border-radius: 3px;
margin-bottom: 10px;
padding: 7px 10px;
box-shadow: rgba(15, 15, 15, 0.1) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 2px 4px;
cursor: pointer;
color: rgb(55, 53, 47);
transition: background 100ms ease-out 0s;
&:hover {
background-color: #eeeeee;
.MenuWrapper {
display: block;
}
}
&.selected {
background-color: rgba(90, 200, 255, 0.2);
}
.MenuWrapper {
display: none;
position: absolute;
right: 0;
}
&:hover {
.MenuWrapper {
display: block;
> div {
margin-bottom: 3px;
}
> .octo-propertyvalue {
font-size: 12px;
line-height: 18px;
}
.octo-icontitle {
flex: 1 1 auto;
font-weight: 500;
.octo-icon {
font-size: 16px;
margin-right: 5px;
}
}
}

2
webapp/src/components/boardCard.tsx
View File

@ -41,7 +41,7 @@ class BoardCard extends React.Component<BoardCardProps, BoardCardState> {
render(): JSX.Element {
const {card, intl} = this.props
const visiblePropertyTemplates = this.props.visiblePropertyTemplates || []
const className = this.props.isSelected ? 'BoardCard octo-board-card selected' : 'BoardCard octo-board-card'
const className = this.props.isSelected ? 'BoardCard selected' : 'BoardCard'
const element = (
<div

27
webapp/src/components/cardDetail.scss
View File

@ -9,4 +9,31 @@
}
}
}
.octo-card-icon {
height: 78px;
min-width: 78px;
font-size: 78px;
line-height: 1.1;
margin-left: 0;
color: #000000;
}
.octo-propertylist {
display: flex;
flex-direction: column;
}
.octo-propertyrow {
display: flex;
flex-direction: row;
margin: 8px 0;
}
.octo-propertyname {
text-align: left;
width: 150px;
margin-right: 5px;
color: #909090;
}
}

71
webapp/static/main.css
View File

@ -251,41 +251,6 @@ hr {
text-align: left;
}
.octo-board-card {
flex: 0 0 auto;
position: relative;
display: flex;
flex-direction: column;
align-items: flex-start;
border-radius: 3px;
margin-bottom: 10px;
padding: 7px 10px;
box-shadow: rgba(15, 15, 15, 0.1) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 2px 4px;
cursor: pointer;
color: rgb(55, 53, 47);
transition: background 100ms ease-out 0s;
}
.octo-board-card.selected {
background-color: rgba(90, 200, 255, 0.2);
}
.octo-board-card > div {
margin-bottom: 3px;
}
.octo-board-card > .octo-propertyvalue {
font-size: 12px;
line-height: 18px;
}
.octo-board-card:hover {
background-color: #eeeeee;
}
.octo-label {
display: inline-block;
padding: 0 5px;
@ -431,49 +396,13 @@ hr {
margin-right: 15px;
}
.octo-board-card .octo-icontitle {
flex: 1 1 auto;
font-weight: 500;
}
.octo-board-card .octo-icontitle .octo-icon {
font-size: 16px;
margin-right: 5px;
}
.octo-table-cell .octo-icontitle .octo-icon {
min-width: 20px;
}
.octo-card-icon {
height: 78px;
min-width: 78px;
font-size: 78px;
line-height: 1.1;
margin-left: 0;
color: #000000;
}
/*-- Property list --*/
.octo-propertylist {
display: flex;
flex-direction: column;
}
.octo-propertyrow {
display: flex;
flex-direction: row;
margin: 8px 0;
}
.octo-propertyname {
text-align: left;
width: 150px;
margin-right: 5px;
color: #909090;
}
.octo-propertyvalue {
color: rgb(55, 53, 47);
padding: 0 5px;