diff --git a/deploy.sh b/deploy.sh
index ca5c401c..d1155cc7 100755
--- a/deploy.sh
+++ b/deploy.sh
@@ -3,6 +3,8 @@
BBB_PLAYBACK_HOMEPAGE=playback/presentation/2.3
BBB_PLAYBACK=/var/bigbluebutton/$BBB_PLAYBACK_HOMEPAGE
+export REACT_APP_BBB_PLAYBACK_BUILD=$(git rev-parse --short HEAD)
+
npm run-script build
sudo rm -rf $BBB_PLAYBACK
sudo cp -r ./build $BBB_PLAYBACK
diff --git a/src/components/chat/index.scss b/src/components/chat/index.scss
index 167d6e9e..d07cee17 100644
--- a/src/components/chat/index.scss
+++ b/src/components/chat/index.scss
@@ -113,7 +113,7 @@ $avatar-size: 2.25rem;
}
.name {
- font-weight: $font-weight-bold;
+ font-weight: $font-weight-semi-bold;
max-width: 60%;
overflow: hidden;
text-overflow: ellipsis;
diff --git a/src/components/more/index.js b/src/components/more/index.js
index 6f032d9e..6b1b09dc 100644
--- a/src/components/more/index.js
+++ b/src/components/more/index.js
@@ -3,9 +3,12 @@ import {
FormattedDate,
FormattedTime,
} from 'react-intl';
+import cx from 'classnames';
import Button from 'components/utils/button';
import './index.scss';
+const BUILD = process.env.REACT_APP_BBB_PLAYBACK_BUILD;
+
export default class More extends PureComponent {
renderDate(metadata) {
const date = ;
+ const icon = value ? 'icon-checkmark' : 'icon-close';
+ element =
;
} else {
element = value;
}
return (
-
+
{element}
@@ -94,7 +100,7 @@ export default class More extends PureComponent {
{this.renderBody(metadata)}
- {this.renderItem('settings', 'ddfgsdfg')}
+ {this.renderItem('settings', BUILD)}
diff --git a/src/components/more/index.scss b/src/components/more/index.scss
index 6505a4bf..d0ca2396 100644
--- a/src/components/more/index.scss
+++ b/src/components/more/index.scss
@@ -26,13 +26,20 @@
padding: 0 $padding-small;
width: 80%;
- .control {
+ .control,
+ .header,
+ .body,
+ .footer {
box-sizing: border-box;
display: flex;
+ width: 100%;
+ }
+
+
+ .control {
flex-direction: row-reverse;
height: $modal-bar-height;
padding: $padding-small;
- width: 100%;
.button {
color: $gray-light;
@@ -41,18 +48,19 @@
}
.header {
- box-sizing: border-box;
- display: flex;
flex-direction: column;
font-weight: $font-weight-regular;
padding: 0 0 $padding 0;
- width: 100%;
- .name {
+ .name,
+ .date {
box-sizing: border-box;
display: flex;
- font-size: larger;
justify-content: center;
+ }
+
+ .name {
+ font-size: larger;
overflow: hidden;
padding: 0 0 $padding-extra-small 0;
text-overflow: ellipsis;
@@ -60,9 +68,7 @@
}
.date {
- box-sizing: border-box;
color: $gray-light;
- display: flex;
font-size: small;
padding: 0 $padding-small;
@@ -74,39 +80,47 @@
}
.body {
- box-sizing: border-box;
- display: flex;
flex-direction: column;
+ overflow-x: hidden;
+ overflow-y: auto;
padding: 0 $padding;
- width: 100%;
.item {
box-sizing: border-box;
display: flex;
font-size: large;
+ font-weight: $font-weight-semi-bold;
padding: $padding-small 0;
+ .key {
+ color: $gray;
+ }
+
.value {
box-sizing: border-box;
padding: 0 $padding;
}
+
+ .green {
+ color: $green;
+ }
+
+ .red {
+ color: $red;
+ }
}
}
.footer {
- box-sizing: border-box;
align-items: center;
- display: flex;
- height: $modal-bar-height;
- padding: 0 $padding;
- width: 100%;
+ padding: $padding;
.item {
box-sizing: border-box;
color: $gray-light;
display: flex;
font-size: small;
- padding: $padding-extra-small 0;
+ padding: $padding 0 0 0;
width: 100%;
.value {
diff --git a/src/styles/colors.scss b/src/styles/colors.scss
index 4fac7a90..108844de 100644
--- a/src/styles/colors.scss
+++ b/src/styles/colors.scss
@@ -13,6 +13,8 @@ $blue-lightest: #e4ecf2;
$red: #df2721;
+$green: #008081;
+
$button-color: $blue;
$cursor-color: $red;