Commit Graph

89 Commits

Author SHA1 Message Date
Kris b066a4128d Adding a text-overflow: ellipsis; mixin and related cleanup 2019-11-06 14:00:29 -05:00
Joe d14851e552 UX: better alignment for tags in the header (#8047)
* Removes unused styles

This commit only removes unnecessary / duplicate styles. It does not cause any visual changes.

* adds class to `<h1>` tag in header topic info.

This is much better to target than `h1`

* removes unused styles

* header title margin adjustment

* minor header-title margin adjustments

* One more header-title margin adjustment
2019-08-28 18:18:27 +10:00
Joe 02f2ce8b05
target panel children instead of targeting the panel (#7257) 2019-03-26 23:54:37 +08:00
Joe ac4470cd56
UX: Hide mobile header notification badges if title is visible 2019-03-20 01:43:23 +08:00
Joe 533fb0019a fully hide header buttons if topic is visible (#7203) 2019-03-19 15:31:45 +01:00
Joe 6d7c0c8f13
REFACTOR: scroll-based mobile header switch
This refactor addresses the following issues:

1- Moves all relevant logic to the discourse-topic component (matches desktop)
2- Fixes the flicker issue discussed here
3- Fixes a rare occurring issue where tags wrap to a third line if a topic has long category names and lots of tags
4- Fixes header icon jitter on iOS
5- Fixes an issue where sliding out user / hamburger menus on Android leaves the user in a mid-state with half a title and the header panel visible - swiping will now open the menus but have no effect on the header.
6- adds min-width to the small-logo to act as placeholder so that the title doesn't shift if the logo takes a while to load.

Other than that, everything should look and act the same.
2019-03-19 18:39:38 +08:00
Joe 55d745f03b
UX: header needs a bit of padding on narrow screens
A bit of history

https://meta.discourse.org/t/header-on-responsive-window/105204
2018-12-31 14:33:02 +08:00
Kris 41e06efb94 Adding padding to mobile that was removed in 3710b016 2018-12-18 22:20:02 -05:00
Kris db32d29eaa UX: Refactoring topic statuses for consistent icon sizes & colors 2018-12-06 19:22:04 -05:00
Kris 6027e7ba3d FIX: Restrict logo width for small screens 2018-11-28 13:27:56 -05:00
Penar Musaraj 03deda2147
Upgrade to FontAwesome 5 (take two) (#6673)
* Add missing icons to set

* Revert FA5 revert

 This reverts commit 42572ff

* use new SVG syntax in locales

* Noscript page changes (remove login button, center "powered by" footer text)

* Cast wider net for SVG icons in settings

- include any _icon setting for SVG registry (offers better support for plugin settings)

- let themes store multiple pipe-delimited icons in a setting

- also replaces broken onebox image icon with SVG reference in cooked post processor

* interpolate icons in locales

* Fix composer whisper icon alignment

* Add support for stacked icons

* SECURITY: enforce hostname to match discourse hostname

This ensures that the hostname rails uses for various helpers always matches
the Discourse hostname

* load SVG sprite with pre-initializers

* FIX: enable caching on SVG sprites

* PERF: use JSONP for SVG sprites so they are served from CDN

This avoids needing to deal with CORS for loading of the SVG

Note, added the svg- prefix to the filename so we can quickly tell in
dev tools what the file is

* Add missing SVG sprite JSONP script to CSP

* Upgrade to FA 5.5.0

* Add support for all FA4.7 icons

- adds complete frontend and backend for renamed FA4.7 icons

- improves performance of SvgSprite.bundle and SvgSprite.all_icons

* Fix group avatar flair preview

- adds an endpoint at /svg-sprites/search/:keyword

- adds frontend ajax call that pulls icon in avatar flair preview even when it is not in subset

* Remove FA 4.7 font files
2018-11-26 16:49:57 -05:00
Joe 336436dfb4
UX: better handling of logo size 2018-11-23 22:04:42 +08:00
Joe ee6c0170ce FEATURE: Scroll-based logo on mobile (#6632) 2018-11-21 21:21:49 -05:00
Sam 42572ff138 Revert font awesome 5 changes
We are still pushing ahead on this 100% just need a bit longer to prepare
all plugins
2018-11-08 16:12:18 +11:00
Penar Musaraj 005e1ecb9b
FEATURE: Update Font Awesome to v5.4.1 and SVGs (#6557)
* First take on subsetting svg icons

* FontAwesome 5 svg subset WIP

* Include icons from plugins/badges into svg sprite subset

* add svg icon support to themes

* Add spec for SvgSprite

* Misc. SVG icon fixes

* Use FA5 svgs in local-dates plugin

* CSS adjustments, fix SVG icons in group flair

* Use SVG icons in poll plugin

* Add SVG icons to /wizard
2018-11-07 13:05:43 -05:00
Joe 1b5ba899a1
UX: header items wrap on small screens for anon 2018-10-17 14:19:20 +08:00
Kris 7a1a1eb4c0 improve header scaling with font size 2018-07-27 16:49:28 -04:00
Kris b79fedd540 Streamlining some breakpoint mixins 2018-07-12 16:39:16 -04:00
Kris a201103127 removing some old styles 2018-07-12 00:53:24 -04:00
Joffrey JAFFEUX 174d392e5a
DEV: adds prettier (#5956)
Run `prettier --write "app/assets/stylesheets/**/*.scss" "plugins/**/*.scss"` after making sure you installed it with `yarn`

It's recommended to configure your editor to run prettier on file save.
2018-06-08 11:49:31 +02:00
Michael Howell 3fbf731e2d
Fix font-up-3 nit 2018-01-17 14:26:14 -07:00
Michael Howell 333ab59f97 Fix the site header to size 1.5em 2018-01-12 23:35:24 +00:00
Kris 674013129a
UX: Type system rebuild (#5492) 2018-01-12 17:27:38 -05:00
Kris d90fc415a1 UX: Reducing number of font sizes used in mobile view 2017-12-19 17:40:08 -05:00
Kris 9876f3d0ee FIX: extraneous mobile CSS, flagged badge color in dropdown 2017-11-30 17:29:29 -05:00
Robin Ward 825452df76 Refactor header CSS for composability 2017-09-06 11:34:10 -04:00
Sam 6bdd5107a6 UX: center align community title text in mobile 2016-03-22 12:44:55 +11:00
Sam 88f38f34cc improve text only header 2016-03-18 15:12:55 +11:00
Sam 37ccfbdb2a Revert "FIX: vertical centering of header, using display: table"
This reverts commit 1b4e0f3300.
2016-03-18 14:29:39 +11:00
Neil Lalonde 1b4e0f3300 FIX: vertical centering of header, using display: table 2016-03-17 17:36:20 -04:00
Jeff Atwood 722cce7400 FIX: mobile logo was too wide 2015-10-19 23:02:32 -07:00
Jeff Atwood 518262ce58 allow wider mobile header 2015-09-17 00:17:35 -07:00
Robin Ward 3ae5a0a2df UX: Merge notifications and user dropdown 2015-08-28 16:11:40 -04:00
Sam 83593fea58 Revert "aligning text-logos and header with flexbox"
This reverts commit 2ad2ab503f.
2015-08-04 14:49:08 +10:00
awesomerobot 2ad2ab503f aligning text-logos and header with flexbox 2015-08-03 21:16:56 -04:00
Jeff Atwood 68a262ff08 fix narrow mobile logo max-width 2015-07-26 01:55:12 -07:00
Simon Cossar 93d9a98497 Remove unnecessary margins from mobile view 2015-07-21 18:46:15 -07:00
Guo Xiang Tan 76e3acbcb3 UX: Shift notification badge down on mobile. 2015-07-09 19:28:38 +08:00
Jeff Atwood 08e330bb71 a few mobile CSS tweaks 2015-02-19 00:13:15 -08:00
Jeff Atwood bf03209f42 let's try to vertically align small logo 2015-02-18 23:55:04 -08:00
Jeff Atwood a39831cdb1 tighten up mobile header margin 2015-01-01 01:42:50 -08:00
Jeff Atwood 911f941da5 some CSS fixes for mobile sites with text titles 2015-01-01 00:54:53 -08:00
Kris Aubuchon 3eebc0e589 changing font sizes to ems, so fonts scale a bit more gracefully 2014-12-15 22:12:56 -05:00
Kris Aubuchon a0e5605869 updated loading spinner 2014-11-05 20:13:51 -05:00
Jeff Atwood e822108d85 tighten up mobile search spacing 2014-10-31 12:12:25 -07:00
Sam 742c5e29c9 FEATURE: advanced search help 2014-10-18 14:27:33 +11:00
Robin Ward cd8b896272 Revert "UX: On mobile add a max width for really long forum names"
This reverts commit ba245ca098.
2014-10-14 17:27:58 -04:00
Robin Ward ba245ca098 UX: On mobile add a max width for really long forum names 2014-10-14 17:01:16 -04:00
Jeff Atwood 65e941f652 UX: remove current username from header 2014-09-07 14:01:51 -07:00
Sam 921dd75dd9 FIX: anonymous had <a> items for pin/unpin
FEATURE: display category in search results
FEATURE: display topic state (locked/pinned/etc) in search results

UI cleanup for search results, clearing floats and so on.
2014-09-03 12:13:26 +10:00