diff options
Diffstat (limited to 'web')
-rw-r--r-- | web/react/components/more_channels.jsx | 7 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_files.scss | 2 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_loading.scss | 64 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_post.scss | 2 |
4 files changed, 12 insertions, 63 deletions
diff --git a/web/react/components/more_channels.jsx b/web/react/components/more_channels.jsx index dad0a644a..1af259853 100644 --- a/web/react/components/more_channels.jsx +++ b/web/react/components/more_channels.jsx @@ -79,7 +79,7 @@ module.exports = React.createClass({ <button data-toggle="modal" data-target="#new_channel" data-channeltype={this.state.channel_type} type="button" className="btn btn-primary channel-create-btn" onClick={this.handleNewChannel}>Create New Channel</button> </div> <div className="modal-body"> - {moreChannels ? + {moreChannels ? (moreChannels.length ? <table className="more-channel-table table"> <tbody> @@ -100,14 +100,15 @@ module.exports = React.createClass({ <p className="primary-message">No more channels to join</p> <p className="secondary-message">Click 'Create New Channel' to make a new one</p> </div>) - : <div ref="loadingscreen" className="channel-loading-message"> + : <div ref="loadingscreen" className="loading-screen loading-screen--channel"> <div className="loading__content"> <h3>Loading</h3> <div id="round_1" className="round"></div> <div id="round_2" className="round"></div> <div id="round_3" className="round"></div> </div> - </div>} + </div> + } { server_error } </div> <div className="modal-footer"> diff --git a/web/sass-files/sass/partials/_files.scss b/web/sass-files/sass/partials/_files.scss index 1268d8a07..79142176e 100644 --- a/web/sass-files/sass/partials/_files.scss +++ b/web/sass-files/sass/partials/_files.scss @@ -119,7 +119,7 @@ width: 120px; height: 100px; float: left; - margin: 0 1em 1em 0; + margin: 5px 10px 5px 0; &.custom-file { width: 85px; height: 100px; diff --git a/web/sass-files/sass/partials/_loading.scss b/web/sass-files/sass/partials/_loading.scss index a078d3563..b47594daf 100644 --- a/web/sass-files/sass/partials/_loading.scss +++ b/web/sass-files/sass/partials/_loading.scss @@ -5,10 +5,15 @@ position: absolute; @include box-sizing(border-box); text-align: center; + &.loading-screen--channel { + position: relative; + padding: 4em 0 3.5em; + } .loading__content { display: table-cell; vertical-align: middle; h3 { + font-size: 16px; font-weight: 400; margin: 0 0.2em 0; display: inline-block; @@ -23,64 +28,7 @@ width: 4px; height: 4px; display: inline-block; - margin: 0 1px; - opacity: 0.1; - @include border-radius(10px); - -moz-animation: move 0.75s infinite linear; - -webkit-animation: move 0.75s infinite linear; - } - - #round_1 { - -moz-animation-delay: .2s; - -webkit-animation-delay: .2s; - } - - #round_2 { - -moz-animation-delay: .4s; - -webkit-animation-delay: .4s; - } - - #round_3 { - -moz-animation-delay: .6s; - -webkit-animation-delay: .6s; - } - - @-moz-keyframes move { - 0% { - opacity: 1; - } - - 100% { - opacity: 0.1; - }; - } - - @-webkit-keyframes move { - 0% { - opacity: 1; - } - - 100% { - opacity: 0.1; - }; - } - } -} - -.channel-loading-screen { - position: absolute; - text-align: center; - padding: 2em 1em; -} - -.channel-loading-message { - .loading__content { - .round { - background-color: #444; - width: 4px; - height: 4px; - display: inline-block; - margin: 0 1px; + margin: 0; opacity: 0.1; @include border-radius(10px); -moz-animation: move 0.75s infinite linear; diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index f33cedd16..4891fe67f 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -306,7 +306,7 @@ body.ios { } .post-image__columns { @include legacy-pie-clearfix; - margin-top: 1em; + padding-bottom: 5px; } .post-info--hidden { display: none; |