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