diff --git a/internal_packages/LICENSE b/internal_packages/LICENSE new file mode 100644 index 000000000..19bfa964d --- /dev/null +++ b/internal_packages/LICENSE @@ -0,0 +1,22 @@ +The MIT License (MIT) + +Copyright (c) 2015 Noah Buscher + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. + diff --git a/internal_packages/README.md b/internal_packages/README.md new file mode 100644 index 000000000..e29fd6da8 --- /dev/null +++ b/internal_packages/README.md @@ -0,0 +1,13 @@ +# Taiga + +Taiga is a clean, simple, Mailbox-inspired theme for N1 that allows you to focus on what matters most: your emails. + +![](./preview.jpg) + +## Installing + +1. [Download](https://nylas.com/n1) Nylas N1 email client if you have not yet +2. [Grab](https://github.com/noahbuscher/N1-Taiga/releases) the latest release of Taiga +3. Open `N1>Preferences>General>Select theme` and select `Install new theme...` from the dropdown + +Profit! :money_with_wings: diff --git a/internal_packages/package.json b/internal_packages/package.json new file mode 100644 index 000000000..11a3fb808 --- /dev/null +++ b/internal_packages/package.json @@ -0,0 +1,13 @@ +{ + "name": "N1-Taiga", + "displayName": "Taiga", + "theme": "Taiga", + "version": "0.2.8", + "description": "A clean, Mailbox-inspired theme for Nylas N1", + "license": "GPL-3.0", + "engines": { + "nylas": "*" + }, + "styleSheets": ["controls", "email-frame", "sidebar", "threads", "notifications"], + "private": true +} diff --git a/internal_packages/preview.jpg b/internal_packages/preview.jpg new file mode 100644 index 000000000..4d4e0a89f Binary files /dev/null and b/internal_packages/preview.jpg differ diff --git a/internal_packages/styles/controls.less b/internal_packages/styles/controls.less new file mode 100644 index 000000000..84cea8c4a --- /dev/null +++ b/internal_packages/styles/controls.less @@ -0,0 +1,138 @@ +@import "variables"; + +.header-container { + margin-right: 10px; +} + +/** + * Buttons + */ +.btn-toolbar, .token, .actions>.btn, .new-package>.btn, .appearance-mode-switch>.btn { + box-shadow: none !important; + background: @white !important; + border: 1px solid @taiga-light !important; + border-radius: @base-border-radius !important; + cursor: pointer !important; +} + +.composer-action-bar-content { + .btn-toolbar { + border: 0 !important; + border-radius: 0 !important; + background: transparent !important; + } +} + +body.platform-win32 { + .sheet-toolbar-container { + .btn-toolbar { + border: 0 !important; + } + } +} + +.btn.btn-emphasis { + background-color: @taiga-accent !important; + border-color: @taiga-accent !important; + color: @white !important; + + img.content-mask { + background-color: @white !important; + } +} + +.button-dropdown.bordered { + .primary-item { + cursor: pointer !important; + box-shadow: none !important; + background: @white !important; + border: 1px solid @taiga-light !important; + border-top-left-radius: @base-border-radius !important; + border-bottom-left-radius: @base-border-radius !important; + img { + position: relative; + top: -2px; + } + } + + .secondary-picker { + cursor: pointer !important; + box-shadow: none !important; + background: @white !important; + border: 1px solid @taiga-light !important; + border-top-right-radius: @base-border-radius !important; + border-bottom-right-radius: @base-border-radius !important; + margin-left: -1px !important; + } + + .secondary-items { + .item { + cursor: pointer; + color: @taiga-light !important; + background: @white !important; + + .button-dropdown { + img { + background: @taiga-light !important; + } + } + } + } +} + +.sheet-toolbar .btn-toolbar { + height: 2em !important; + line-height: 1 !important; + margin-top: 6px !important; +} + +/** + * Feedback button + */ +.btn-feedback { + background: @taiga-accent !important; + border: none !important; +} + +/** + * Search bar + */ +.content-container { + .item.selected { + background: @taiga-light !important; + color: @white !important; + } +} + +/** + * Dropdown + */ +.menu { + .item.selected { + background: @taiga-light !important; + .primary { + color: @white !important; + } + .secondary { + color: @taiga-lighter !important; + } + } +} + +/** + * Plugin page + */ +.package { + border-radius: @base-border-radius; +} + +/** + * Prefs page + */ +.appearance-mode { + cursor: pointer; + + &.active { + background-color: lighten(@taiga-light, 30%) !important; + } +} diff --git a/internal_packages/styles/email-frame.less b/internal_packages/styles/email-frame.less new file mode 100644 index 000000000..ecf8d688f --- /dev/null +++ b/internal_packages/styles/email-frame.less @@ -0,0 +1,10 @@ +@import "variables"; + +.ignore-in-parent-frame { + body { + color: @taiga-dark; + } + img { + color: @taiga-dark; + } +} diff --git a/internal_packages/styles/notifications.less b/internal_packages/styles/notifications.less new file mode 100644 index 000000000..0784962fe --- /dev/null +++ b/internal_packages/styles/notifications.less @@ -0,0 +1,11 @@ +@import "variables"; + +.notifications-sticky, .notification-developer, .notifications-sticky-item, .notification-info { + color: @white !important; + background: @taiga-accent !important; + + .action { + color: @white !important; + background: darken(@taiga-accent, 20%) !important; + } +} diff --git a/internal_packages/styles/sidebar.less b/internal_packages/styles/sidebar.less new file mode 100644 index 000000000..e2e571336 --- /dev/null +++ b/internal_packages/styles/sidebar.less @@ -0,0 +1,49 @@ +@import "variables"; + +#account-switcher .primary-item .name { + color: @taiga-dark; +} + +.account-sidebar-sections { + background-color: @white !important; + + section { + .item-container { + margin: 0 10px !important; + + .disclosure-triangle { + display: none; + } + + .item { + padding: 0 10px !important; + color: @taiga-light !important; + cursor: pointer !important; + + .item-count-box { + background: transparent !important; + color: @taiga-light !important; + box-shadow: 0 0.5px 0 @taiga-light, 0 -0.5px 0 @taiga-light, 0.5px 0 0 @taiga-light, -0.5px 0 0 @taiga-light !important; + } + + &.selected { + background: @taiga-accent !important; + border-radius: @base-border-radius; + color: @white !important; + + .item-count-box { + background: transparent !important; + color: @white !important; + box-shadow: 0 0.5px 0 @white, 0 -0.5px 0 @white, 0.5px 0 0 @white, -0.5px 0 0 @white !important; + } + + .icon { + img { + background: @white !important; + } + } + } + } + } + } +} diff --git a/internal_packages/styles/theme-colors.less b/internal_packages/styles/theme-colors.less new file mode 100644 index 000000000..0d669f694 --- /dev/null +++ b/internal_packages/styles/theme-colors.less @@ -0,0 +1,2 @@ +@component-active-color: #5dade1; +@toolbar-background-color: #ddedf4; \ No newline at end of file diff --git a/internal_packages/styles/threads.less b/internal_packages/styles/threads.less new file mode 100644 index 000000000..006453342 --- /dev/null +++ b/internal_packages/styles/threads.less @@ -0,0 +1,72 @@ +@import "variables"; + +.list-tabular .list-column.list-column-Item { + margin-left: -20px; + padding-left: 30px; +} + +.thread-list { + .list-container { + .list-item { + &.focused:hover .list-column-HoverActions .inner { + color: @taiga-dark !important; + background-image: linear-gradient(90deg, fadeout(@taiga-lighter, 100%) 0%, darken(@taiga-lighter, 10%) 100%); + + .action { + -webkit-filter: none; + } + .thread-icon { + &:not(.thread-icon-star) { + opacity: 0.7; + } + } + } + &.focused { + .thread-icon, .mail-important-icon, .draft-icon { + -webkit-filter: none; + } + } + &:hover { + .thread-icon { + visibility: inherit; + } + } + .list-column { + border-bottom: 0 !important; + } + } + .scroll-region-content { + .scroll-region-content-inner { + .list-rows { + .list-item { + cursor: pointer !important; + box-sizing: border-box; + border: 0 !important; + background-color: @white !important; + color: @taiga-dark !important; + &.focused { + color: @taiga-dark !important; + background-color: darken(@taiga-lighter, 5%) !important; + } + &.selected { + color: @taiga-dark !important; + background-color: darken(@taiga-lighter, 5%) !important; + } + &.keyboard-cursor { + .list-column-Item { + border-left: 4px solid darken(@taiga-lighter, 50%) !important; + } + } + } + } + } + } + } + .thread-icon { + background-image: url(../static/images/thread-list/icon-star-hover-@2x.png); + + &:not(.thread-icon-star) { + visibility: hidden; + } + } +} diff --git a/internal_packages/styles/ui-variables.less b/internal_packages/styles/ui-variables.less new file mode 100644 index 000000000..300054774 --- /dev/null +++ b/internal_packages/styles/ui-variables.less @@ -0,0 +1,19 @@ +@import "variables"; + +@accent-primary: @taiga-light; +@accent-primary-dark: darken(@taiga-light, 20%); + +@background-secondary: @white; +@text-color: @taiga-dark; +@text-color-subtle: lighten(@taiga-dark, 20%); +@text-color-very-subtle: @taiga-light; +@text-color-inverse: @taiga-light; +@text-color-inverse-subtle: darken(@taiga-light, 30%); +@text-color-inverse-very-subtle: darken(@taiga-light, 20%); + +@panel-background-color: @white; +@toolbar-background-color: @white; + +@btn-default-bg-color: @white; +@btn-default-text-color: @taiga-light; +@background-gradient: none; diff --git a/internal_packages/styles/variables.less b/internal_packages/styles/variables.less new file mode 100644 index 000000000..0fce409c3 --- /dev/null +++ b/internal_packages/styles/variables.less @@ -0,0 +1,13 @@ +/** + * Colors + */ +@taiga-light: darken(#A3ACB1, 10%); +@taiga-lighter: #F0F7FA; +@taiga-dark: darken(#727C83, 4%); +@taiga-accent: #5DADE1; +@white: #ffffff; + +/** + * Borders + */ +@base-border-radius: 4px;