From f5bf5ebb82e3af420dcd23d602b1be6cc86838e1 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Wed, 3 May 2017 02:04:16 +0200 Subject: Replace sprockets/browserify with Webpack (#2617) * Replace browserify with webpack * Add react-intl-translations-manager * Do not minify in development, add offline-plugin for ServiceWorker background cache updates * Adjust tests and dependencies * Fix production deployments * Fix tests * More optimizations * Improve travis cache for npm stuff * Re-run travis * Add back support for custom.scss as before * Remove offline-plugin and babili * Fix issue with Immutable.List().unshift(...values) not working as expected * Make travis load schema instead of running all migrations in sequence * Fix missing React import in WarningContainer. Optimize rendering performance by using ImmutablePureComponent instead of React.PureComponent. ImmutablePureComponent uses Immutable.is() to compare props. Replace dynamic callback bindings in * Add react definitions to places that use JSX * Add Procfile.dev for running rails, webpack and streaming API at the same time --- app/assets/stylesheets/stream_entries.scss | 372 ----------------------------- 1 file changed, 372 deletions(-) delete mode 100644 app/assets/stylesheets/stream_entries.scss (limited to 'app/assets/stylesheets/stream_entries.scss') diff --git a/app/assets/stylesheets/stream_entries.scss b/app/assets/stylesheets/stream_entries.scss deleted file mode 100644 index fac4703b9..000000000 --- a/app/assets/stylesheets/stream_entries.scss +++ /dev/null @@ -1,372 +0,0 @@ -.activity-stream { - clear: both; - box-shadow: 0 0 15px rgba($color8, 0.2); - - .entry { - background: $color5; - - .detailed-status.light, .status.light { - border-bottom: 1px solid $color2; - } - - &:last-child { - &, .detailed-status.light, .status.light { - border-bottom: 0; - border-radius: 0 0 4px 4px; - } - } - - &:first-child { - &, .detailed-status.light, .status.light { - border-radius: 4px 4px 0 0; - } - - &:last-child { - &, .detailed-status.light, .status.light { - border-radius: 4px; - } - } - } - } - - .status.light { - padding: 14px 14px 14px (48px + 14px*2); - position: relative; - min-height: 48px; - cursor: default; - - .status__header { - font-size: 15px; - - .status__meta { - float: right; - font-size: 14px; - - .status__relative-time { - color: $color4; - } - } - } - - .status__display-name { - display: block; - max-width: 100%; - padding-right: 25px; - color: $color1; - } - - .status__avatar { - position: absolute; - left: 14px; - top: 14px; - width: 48px; - height: 48px; - - & > div { - width: 48px; - height: 48px; - } - - img { - display: block; - border-radius: 4px; - } - } - - .display-name { - display: block; - max-width: 100%; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - - strong { - font-weight: 500; - color: $color1; - } - - span { - font-size: 14px; - color: $color4; - } - } - - .status__content { - color: $color1; - - a { - color: $color4; - } - - a.status__content__spoiler-link { - color: $color5; - background: $color3; - - &:hover { - background: lighten($color3, 8%); - } - } - } - - .status__attachments { - margin-top: 8px; - overflow: hidden; - width: 100%; - box-sizing: border-box; - position: relative; - - .status__attachments__inner { - display: flex; - height: 214px; - } - } - } - - .detailed-status.light { - padding: 14px; - background: $color5; - cursor: default; - - .detailed-status__display-name { - display: block; - overflow: hidden; - margin-bottom: 15px; - - & > div { - float: left; - margin-right: 10px; - } - - .display-name { - display: block; - max-width: 100%; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - - strong { - font-weight: 500; - color: $color1; - } - - span { - font-size: 14px; - color: $color3; - } - } - } - - .avatar { - width: 48px; - height: 48px; - - img { - display: block; - border-radius: 4px; - } - } - - .status__content { - color: $color1; - - a { - color: $color4; - } - - a.status__content__spoiler-link { - color: $color5; - background: $color3; - - &:hover { - background: lighten($color3, 8%); - } - } - } - - .detailed-status__meta { - margin-top: 15px; - color: $color3; - font-size: 14px; - line-height: 18px; - - a { - color: inherit; - } - - span > span { - font-weight: 500; - font-size: 12px; - margin-left: 6px; - display: inline-block; - } - } - - .detailed-status__attachments { - margin-top: 8px; - overflow: hidden; - width: 100%; - box-sizing: border-box; - position: relative; - - .status__attachments__inner { - display: flex; - height: 360px; - } - } - - .video-player { - margin-top: 8px; - height: 300px; - overflow: hidden; - position: relative; - - video { - position: relative; - z-index: 1; - width: 100%; - height: 100%; - object-fit: cover; - top: 50%; - transform: translateY(-50%); - } - } - } - - .media-item, .video-item { - box-sizing: border-box; - position: relative; - left: auto; - top: auto; - right: auto; - bottom: auto; - float: left; - border: medium none; - display: block; - flex: 1 1 auto; - height: 100%; - margin-right: 2px; - - &:last-child { - margin-right: 0; - } - - a { - display: block; - width: 100%; - height: 100%; - background: no-repeat scroll center center / cover; - text-decoration: none; - cursor: zoom-in; - } - - video { - position: relative; - z-index: 1; - width: 100%; - height: 100%; - object-fit: cover; - top: 50%; - transform: translateY(-50%); - } - } - - .video-item { - a { - cursor: pointer; - } - - .video-item__play { - position: absolute; - top: 50%; - left: 50%; - font-size: 36px; - transform: translate(-50%, -50%); - padding: 5px; - border-radius: 100px; - color: rgba($color5, 0.8); - z-index: 1; - } - } - - .media-spoiler { - background: $color3; - width: 100%; - height: 100%; - cursor: pointer; - position: absolute; - top: 0; - left: 0; - display: flex; - align-items: center; - justify-content: center; - flex-direction: column; - text-align: center; - transition: all 100ms linear; - z-index: 2; - - &:hover { - background: darken($color3, 5%); - } - - span { - display: block; - - &:first-child { - font-size: 14px; - } - - &:last-child { - font-size: 11px; - font-weight: 500; - } - } - } - - .pre-header { - padding: 14px 0px; - padding-left: (48px + 14px*2); - padding-bottom: 0; - margin-bottom: -4px; - color: $color3; - font-size: 14px; - position: relative; - - .pre-header__icon { - position: absolute; - left: (48px + 14px*2 - 30px); - } - - .status__display-name.muted strong { - color: $color3; - } - } - - .open-in-web-link { - text-decoration: none; - - &:hover { - text-decoration: underline; - } - } -} - -.embed { - .activity-stream { - border-radius: 4px; - box-shadow: none; - - .entry { - &:last-child { - border-radius: 0 0 4px 4px; - } - - &:first-child { - border-radius: 4px 4px 0 0; - - &:last-child { - border-radius: 4px; - } - } - } - } -} -- cgit