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 ViewHeader from './viewHeader'
|
||||||
import ViewTitle from './viewTitle'
|
import ViewTitle from './viewTitle'
|
||||||
|
|
||||||
|
import './boardComponent.scss'
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
boardTree?: BoardTree
|
boardTree?: BoardTree
|
||||||
showView: (id: string) => void
|
showView: (id: string) => void
|
||||||
@ -110,7 +112,7 @@ class BoardComponent extends React.Component<Props, State> {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className='octo-app'
|
className='BoardComponent octo-app'
|
||||||
ref={this.backgroundRef}
|
ref={this.backgroundRef}
|
||||||
onClick={(e) => {
|
onClick={(e) => {
|
||||||
this.backgroundClicked(e)
|
this.backgroundClicked(e)
|
||||||
|
@ -161,13 +161,6 @@ hr {
|
|||||||
padding: 10px 95px 50px 95px;
|
padding: 10px 95px 50px 95px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.octo-board {
|
|
||||||
flex: 0 1 auto;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.octo-controls {
|
.octo-controls {
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -184,73 +177,10 @@ hr {
|
|||||||
white-space: nowrap
|
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 {
|
.dragover {
|
||||||
background-color: rgba(128, 192, 255, 0.4);
|
background-color: rgba(128, 192, 255, 0.4);
|
||||||
}
|
}
|
||||||
|
|
||||||
.octo-board-column > .octo-button {
|
|
||||||
color: #909090;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.octo-label {
|
.octo-label {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 0 5px;
|
padding: 0 5px;
|
||||||
|
Loading…
Reference in New Issue
Block a user