Unified · Split
| @@ -24,7 +24,7 @@ app.templates.notifInvalidLocation = -> · 23 unmodified lines | ||
| 24 | 24 | """ Otherwise things are likely to break. """ |
| 25 | 25 | |
| 26 | 26 | app.templates.notifNews = (news) -> |
| 27 | − notif 'Changelog', app.templates.newsList(news) | |
| 27 | + notif 'Changelog', """<div class="_notif-content _notif-news">#{app.templates.newsList(news, years: false)}</div>""" | |
| 28 | 28 | |
| 29 | 29 | app.templates.notifShare = -> |
| 30 | 30 | textNotif """ Hi there! """, |
| @@ -8,13 +8,13 @@ app.templates.newsPage = -> · 7 unmodified lines | ||
| 8 | 8 | For development updates, follow the project on <a href="https://github.com/Thibaut/devdocs">GitHub</a>. |
| 9 | 9 | <div class="_news">#{app.templates.newsList app.news}</div> """ |
| 10 | 10 | |
| 11 | −app.templates.newsList = (news) -> | |
| 11 | +app.templates.newsList = (news, options = {}) -> | |
| 12 | 12 | year = new Date().getUTCFullYear() |
| 13 | 13 | result = '' |
| 14 | 14 | |
| 15 | 15 | for value in news |
| 16 | 16 | date = new Date(value[0]) |
| 17 | − if year isnt date.getUTCFullYear() | |
| 17 | + if options.years isnt false and year isnt date.getUTCFullYear() | |
| 18 | 18 | year = date.getUTCFullYear() |
| 19 | 19 | result += "<h4>#{year}</h4>" |
| 20 | 20 | result += newsItem(date, value[1..]) |
| @@ -19,7 +19,7 @@ · 18 unmodified lines | ||
| 19 | 19 | } |
| 20 | 20 | |
| 21 | 21 | ._notif-title { |
| 22 | − margin: 0 0 .375rem; | |
| 22 | + margin: 0 0 .5rem; | |
| 23 | 23 | line-height: 1rem; |
| 24 | 24 | font-size: inherit; |
| 25 | 25 | } |
| @@ -49,23 +49,42 @@ · 23 unmodified lines | ||
| 49 | 49 | &:before { @extend %icon, %icon-close-white; } |
| 50 | 50 | } |
| 51 | 51 | |
| 52 | −._notif-news { | |
| 53 | − width: 20rem; | |
| 54 | − max-height: 85%; | |
| 52 | +._notif-content { | |
| 53 | + max-height: calc(50vh - 4.5rem); | |
| 54 | + margin: 0 -.25rem 0 0; | |
| 55 | + padding-right: .75rem; | |
| 55 | 56 | overflow-y: auto; |
| 56 | 57 | |
| 58 | + &::-webkit-scrollbar { -webkit-appearance: none; width: 10px; } | |
| 59 | + &::-webkit-scrollbar-button { display: none; } | |
| 60 | + &::-webkit-scrollbar-track { background: $notifBackground; } | |
| 61 | + &::-webkit-scrollbar-thumb { | |
| 62 | + min-height: 2rem; | |
| 63 | + background: $scrollbarColor; | |
| 64 | + background-clip: padding-box; | |
| 65 | + border: 3px solid $notifBackground; | |
| 66 | + border-radius: 5px; | |
| 67 | + | |
| 68 | + &:active { | |
| 69 | + background-color: $scrollbarColorHover; | |
| 70 | + border-width: 2px; | |
| 71 | + } | |
| 72 | + } | |
| 73 | + | |
| 57 | 74 | > ._notif-title { |
| 58 | 75 | margin-bottom: .5rem; |
| 59 | 76 | text-align: center; |
| 60 | 77 | } |
| 78 | +} | |
| 61 | 79 | |
| 80 | +._notif-news { | |
| 62 | 81 | > ._news-row { |
| 63 | 82 | line-height: 1.125rem; |
| 64 | 83 | font-size: .6875rem; |
| 65 | 84 | color: $notifColorLight; |
| 66 | 85 | margin-bottom: .25rem; |
| 67 | 86 | |
| 68 | − + ._news-row { margin-top: .75rem; } | |
| 87 | + + ._news-row { margin-top: .625rem; } | |
| 69 | 88 | } |
| 70 | 89 | |
| 71 | 90 | ._news-title { |