diff options
Diffstat (limited to 'app/javascript/flavours/glitch')
-rw-r--r-- | app/javascript/flavours/glitch/features/drawer/index.js | 9 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/images/mbstobon-ui-3.png | bin | 0 -> 32449 bytes | |||
-rw-r--r-- | app/javascript/flavours/glitch/images/wave-drawer-glitched.png | bin | 0 -> 3544 bytes | |||
-rw-r--r-- | app/javascript/flavours/glitch/images/wave-drawer.png | bin | 0 -> 3269 bytes | |||
-rw-r--r-- | app/javascript/flavours/glitch/reducers/compose.js | 6 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/components/drawer.scss | 22 |
6 files changed, 25 insertions, 12 deletions
diff --git a/app/javascript/flavours/glitch/features/drawer/index.js b/app/javascript/flavours/glitch/features/drawer/index.js index 832b16e6f..93457ad31 100644 --- a/app/javascript/flavours/glitch/features/drawer/index.js +++ b/app/javascript/flavours/glitch/features/drawer/index.js @@ -74,9 +74,8 @@ class Drawer extends React.Component { submitted, } = this.props; - let elefriendAttrs = { - className: classNames('mastodon', 'mbstobon-' + elefriend), - onClick: onClickElefriend, + let innerDrawerAttrs = { + className: classNames('drawer--inner', 'mbstobon-' + elefriend), }; // The result. @@ -100,9 +99,9 @@ class Drawer extends React.Component { /> <div className='contents'> <DrawerAccount account={account} /> - <div className='drawer__inner'> + <div {...innerDrawerAttrs}> <Composer /> - {multiColumn && <div {...elefriendAttrs} />} + {multiColumn && <div className='mastodon' onClick={onClickElefriend} role='button' />} </div> <DrawerResults results={results} diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-3.png b/app/javascript/flavours/glitch/images/mbstobon-ui-3.png new file mode 100644 index 000000000..a1fb642a0 --- /dev/null +++ b/app/javascript/flavours/glitch/images/mbstobon-ui-3.png Binary files differdiff --git a/app/javascript/flavours/glitch/images/wave-drawer-glitched.png b/app/javascript/flavours/glitch/images/wave-drawer-glitched.png new file mode 100644 index 000000000..2290663db --- /dev/null +++ b/app/javascript/flavours/glitch/images/wave-drawer-glitched.png Binary files differdiff --git a/app/javascript/flavours/glitch/images/wave-drawer.png b/app/javascript/flavours/glitch/images/wave-drawer.png new file mode 100644 index 000000000..ca9f9e1d8 --- /dev/null +++ b/app/javascript/flavours/glitch/images/wave-drawer.png Binary files differdiff --git a/app/javascript/flavours/glitch/reducers/compose.js b/app/javascript/flavours/glitch/reducers/compose.js index dfab38387..24f76cf86 100644 --- a/app/javascript/flavours/glitch/reducers/compose.js +++ b/app/javascript/flavours/glitch/reducers/compose.js @@ -38,6 +38,10 @@ import { overwrite } from 'flavours/glitch/util/js_helpers'; const totalElefriends = 3; +// ~4% chance you'll end up with an unexpected friend +// glitch-soc/mastodon repo created_at date: 2017-04-20T21:55:28Z +const glitchProbability = 1 - 0.0420215528; + const initialState = ImmutableMap({ mounted: false, advanced_options: ImmutableMap({ @@ -45,7 +49,7 @@ const initialState = ImmutableMap({ threaded_mode: false, }), sensitive: false, - elefriend: Math.floor(Math.random() * totalElefriends), + elefriend: Math.random() < glitchProbability ? Math.floor(Math.random() * totalElefriends) : totalElefriends, spoiler: false, spoiler_text: '', privacy: null, diff --git a/app/javascript/flavours/glitch/styles/components/drawer.scss b/app/javascript/flavours/glitch/styles/components/drawer.scss index c7581fb4f..d0d79c86b 100644 --- a/app/javascript/flavours/glitch/styles/components/drawer.scss +++ b/app/javascript/flavours/glitch/styles/components/drawer.scss @@ -50,9 +50,8 @@ contain: strict; } - .drawer__inner { + .drawer--inner { position: absolute; - background: lighten($ui-base-color, 13%) url('~flavours/glitch/images/wave-drawer.png') no-repeat bottom / 100% auto; top: 0; left: 0; box-sizing: border-box; @@ -66,11 +65,22 @@ .mastodon { flex: 1; + } + } + + @for $i from 0 through 3 { + .drawer--inner.mbstobon-#{$i} { + @if $i == 3 { + background: lighten($ui-base-color, 13%) url('~flavours/glitch/images/wave-drawer.png') no-repeat bottom / 100% auto; + } @else { + background: lighten($ui-base-color, 13%) url('~flavours/glitch/images/wave-drawer-glitched.png') no-repeat bottom / 100% auto; + } + + .mastodon { + background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png") no-repeat left bottom / contain; - @for $i from 0 through 2 { - &.mbstobon-#{$i} { - background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png") no-repeat left bottom / contain; - filter: saturate(80%) contrast(50%) brightness(50%); + @if $i != 3 { + filter: contrast(50%) brightness(50%); } } } |