mirror of
https://github.com/mattermost/focalboard.git
synced 2024-12-24 13:43:12 +02:00
Moving more css aside components
This commit is contained in:
parent
33a4b35464
commit
c5ad9361ab
69
webapp/src/components/boardComponent.scss
Normal file
69
webapp/src/components/boardComponent.scss
Normal file
@ -0,0 +1,69 @@
|
||||
.BoardComponent {
|
||||
.octo-board {
|
||||
flex: 0 1 auto;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.octo-board-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
min-height: 30px;
|
||||
margin-bottom: 10px;
|
||||
padding: 0px 10px;
|
||||
color: #909090;
|
||||
}
|
||||
|
||||
.octo-board-header-cell{
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
|
||||
width: 260px;
|
||||
margin-right: 15px;
|
||||
vertical-align: middle;
|
||||
|
||||
&.narrow {
|
||||
width: 220px;
|
||||
}
|
||||
|
||||
> div {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.octo-board-body {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 0 10px;
|
||||
flex: 0 1 auto;
|
||||
}
|
||||
|
||||
.octo-board-column {
|
||||
flex: 0 0 auto;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
width: 260px;
|
||||
margin-right: 15px;
|
||||
&.narrow {
|
||||
width: 220px;
|
||||
}
|
||||
> .octo-button {
|
||||
color: #909090;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.octo-board-hidden-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
> div {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
@ -24,6 +24,8 @@ import RootPortal from './rootPortal'
|
||||
import ViewHeader from './viewHeader'
|
||||
import ViewTitle from './viewTitle'
|
||||
|
||||
import './boardComponent.scss'
|
||||
|
||||
type Props = {
|
||||
boardTree?: BoardTree
|
||||
showView: (id: string) => void
|
||||
@ -110,7 +112,7 @@ class BoardComponent extends React.Component<Props, State> {
|
||||
|
||||
return (
|
||||
<div
|
||||
className='octo-app'
|
||||
className='BoardComponent octo-app'
|
||||
ref={this.backgroundRef}
|
||||
onClick={(e) => {
|
||||
this.backgroundClicked(e)
|
||||
|
@ -161,13 +161,6 @@ hr {
|
||||
padding: 10px 95px 50px 95px;
|
||||
}
|
||||
|
||||
.octo-board {
|
||||
flex: 0 1 auto;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.octo-controls {
|
||||
flex: 0 0 auto;
|
||||
display: flex;
|
||||
@ -184,73 +177,10 @@ hr {
|
||||
white-space: nowrap
|
||||
}
|
||||
|
||||
.octo-board-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
min-height: 30px;
|
||||
margin-bottom: 10px;
|
||||
padding: 0px 10px;
|
||||
color: #909090;
|
||||
}
|
||||
|
||||
.octo-board-header-cell {
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
|
||||
width: 260px;
|
||||
margin-right: 15px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.octo-board-header-cell.narrow {
|
||||
width: 220px;
|
||||
}
|
||||
|
||||
.octo-board-header-cell > div {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.octo-board-body {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 0 10px;
|
||||
flex: 0 1 auto;
|
||||
}
|
||||
|
||||
.octo-board-column {
|
||||
flex: 0 0 auto;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
width: 260px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.octo-board-column.narrow {
|
||||
width: 220px;
|
||||
}
|
||||
|
||||
.octo-board-hidden-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.octo-board-hidden-item > div {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.dragover {
|
||||
background-color: rgba(128, 192, 255, 0.4);
|
||||
}
|
||||
|
||||
.octo-board-column > .octo-button {
|
||||
color: #909090;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.octo-label {
|
||||
display: inline-block;
|
||||
padding: 0 5px;
|
||||
|
Loading…
Reference in New Issue
Block a user