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;