Briq
/
multiparty-meeting
7
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #58 from havfo/feat/sidebar-over 

Feat/sidebar over
master
Håvar Aambø Fosstveit 2018-08-03 09:59:35 +02:00 committed by GitHub
parent 6cec6e5155 add65db8fd
commit 887621f264
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 34 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/lib/components/Room.jsx
View File

@ -82,12 +82,7 @@ class Room extends React.Component
<Appear duration={300}>
<div data-component='Room'>
<FullScreenView advancedMode={room.advancedMode} />
<div
className='room-wrapper'
style={{
width : toolAreaOpen ? '75%' : '100%'
}}
>
<div className='room-wrapper'>
<Notifications />
<ToolAreaButton />
@ -161,10 +156,7 @@ class Room extends React.Component
/>
</div>
<div
className='toolarea-wrapper'
style={{
width : toolAreaOpen ? '25%' : '0%'
}}
className={classnames('toolarea-wrapper', { open: toolAreaOpen })}
>
{toolAreaOpen ?
<ToolArea

2
app/lib/components/ToolArea/ToolAreaButton.jsx
View File

@ -15,7 +15,7 @@ class ToolAreaButton extends React.Component
} = this.props;
return (
<div data-component='ToolAreaButton'>
<div data-component='ToolAreaButton' className={classnames({ on: toolAreaOpen })}>
<div
className={classnames('button toolarea-button room-controls', {
on : toolAreaOpen,

2
app/stylus/components/FileSharing.styl
View File

@ -91,5 +91,5 @@
align-items: center;
justify-content: center;
font-size: 2rem;
z-index: 2000;
z-index: 3000;
}

6
app/stylus/components/FullScreenView.styl
View File

@ -4,11 +4,11 @@
left: 0;
height: 100%;
width: 100%;
z-index: 200;
z-index: 2000;
> .controls {
position: absolute;
z-index: 201;
z-index: 2020;
right: 0;
top: 0;
display: flex;
@ -53,7 +53,7 @@
.incompatible-video {
position: absolute;
z-index: 2
z-index: 2010;
top: 0;
bottom: 0;
left: 0;

2
app/stylus/components/FullView.styl
View File

@ -16,7 +16,7 @@
$backgroundTint = #000;
position: absolute;
z-index: 5
z-index: 10;
top: 0.6vmin;
left: 0.6vmin;
bottom: 0;

2
app/stylus/components/Me.styl
View File

@ -19,7 +19,7 @@
> .controls {
position: absolute;
z-index: 10;
z-index: 20;
right: 0;
top: 0;
display: flex;

2
app/stylus/components/Notifications.styl
View File

@ -1,6 +1,6 @@
[data-component='Notifications'] {
position: absolute;
z-index: 9999;
z-index: 1010;
pointer-events: none;
top: 0;
right: 65px;

6
app/stylus/components/Peer.styl
View File

@ -42,7 +42,7 @@
align-items: center;
padding: 0.4vmin;
transition: opacity 0.3s;
z-index: 10;
z-index: 20;
> .icon {
flex: 0 0 auto;
@ -85,7 +85,7 @@
}
> .controls {
position: absolute;
z-index: 10;
z-index: 20;
right: 0;
top: 0;
display: flex;
@ -195,7 +195,7 @@
.incompatible-video {
position: absolute;
z-index: 2
z-index: 10;
top: 0;
bottom: 0;
left: 0;

2
app/stylus/components/PeerView.styl
View File

@ -16,7 +16,7 @@
$backgroundTint = #000;
position: absolute;
z-index: 5
z-index: 10;
top: 0.6vmin;
left: 0.6vmin;
bottom: 0;

16
app/stylus/components/Room.styl
View File

@ -7,7 +7,6 @@
left: 0;
height: 100%;
width: 100%;
transition: width 0.3s;
> .state {
position: fixed;
@ -95,7 +94,7 @@
> .room-link-wrapper {
pointer-events: none;
position: absolute;
z-index: 1;
z-index: 10;
top: 0;
left: 0;
right: 0;
@ -142,7 +141,7 @@
> .me-container {
position: fixed;
z-index: 100;
z-index: 110;
overflow: hidden;
box-shadow: 0px 5px 12px 2px rgba(#111, 0.5);
transition-property: border-color;
@ -168,12 +167,17 @@
> .toolarea-wrapper {
position: fixed;
width: 0;
top: 0;
right: 0;
width: 20%;
height: 100%;
background-color: rgba(0,0,0,0.1);
background-color: rgba(50, 50, 50, 0.9);
transition: width 0.3s;
z-index: 1000;
&.open {
width: 25%;
}
}
}
@ -242,7 +246,7 @@
position: absolute;
top: 100%;
width: 100%;
z-index: 1000;
z-index: 120;
-webkit-overflow-scrolling: touch;
}

2
app/stylus/components/ScreenView.styl
View File

@ -16,7 +16,7 @@
$backgroundTint = #000;
position: absolute;
z-index: 5
z-index: 10;
top: 0.6vmin;
left: 0.6vmin;
bottom: 0;

2
app/stylus/components/Sidebar.styl
View File

@ -1,6 +1,6 @@
[data-component='Sidebar'] {
position: fixed;
z-index: 101;
z-index: 500;
top: calc(50% - 60px);
height: 120px;
display: flex;

11
app/stylus/components/ToolArea.styl
View File

@ -1,14 +1,19 @@
[data-component='ToolAreaButton'] {
position: absolute;
z-index: 101;
top: 20px;
right: 20px;
z-index: 1000;
right: 0;
height: 36px;
width: 36px;
padding: 2rem;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
transition: right 0.3s;
&.on {
right: 25%;
}
> .button {
flex: 0 0 auto;