mirror of
https://github.com/johannesjo/super-productivity.git
synced 2026-01-23 02:36:05 +00:00
refactor: modernize scss syntax and get rid of most of the warnings
This commit is contained in:
Johannes Millan
parent
a779eda062
commit
dc525eb0a9
104 changed files with 227 additions and 193 deletions
10
angular.json
10
angular.json
|
|
@ -41,15 +41,7 @@
|
|||
"webWorkerTsConfig": "src/tsconfig.worker.json",
|
||||
"browser": "src/main.ts",
|
||||
"stylePreprocessorOptions": {
|
||||
"includePaths": ["."],
|
||||
"sass": {
|
||||
"silenceDeprecations": [
|
||||
"mixed-decls",
|
||||
"color-functions",
|
||||
"global-builtin",
|
||||
"import"
|
||||
]
|
||||
}
|
||||
"includePaths": [".", "src", "src/styles"]
|
||||
}
|
||||
},
|
||||
"configurations": {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
@use 'angular-material-css-vars' as mat-css-vars;
|
||||
|
||||
@import 'styles/functions/_ddivide';
|
||||
// Forward functions so they can be used without namespace
|
||||
@forward 'styles/functions/_ddivide';
|
||||
@use 'styles/functions/_ddivide';
|
||||
|
||||
@import 'styles/mixins/mixins';
|
||||
@import 'styles/extends/extends';
|
||||
// Forward all mixins so they can be used without namespace
|
||||
@forward 'styles/mixins/_mixins';
|
||||
@use 'styles/mixins/_mixins';
|
||||
@use 'styles/extends/extends';
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
// TODO split up into more manageable bits
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
button .badge {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
// MAIN LAYOUT
|
||||
// -----------
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
//border: 1px solid var(--c-light-20);
|
||||
|
|
@ -18,8 +18,6 @@
|
|||
min-height: 300px;
|
||||
}
|
||||
|
||||
border-color: var(--extra-border-color);
|
||||
|
||||
planner-task {
|
||||
margin-bottom: 8px;
|
||||
margin-right: 4px;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: grid;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
::ng-deep {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
mat-dialog-content {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
padding-bottom: var(--s2);
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.form-wrapper {
|
||||
overflow: hidden;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host ::ng-deep {
|
||||
.mat-mdc-form-field {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
position: fixed;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host p {
|
||||
text-align: center;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.dialog-content {
|
||||
@include mq(xs) {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
// NOTE 0 because we want the inner scrollbars at the very right
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../tasks/task/task.component.mixins';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
//@include grabCursor();
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
@include mq(xxs) {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
// table styled by ./src/styles/components/issue-table.scss
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
// table styled by ./src/styles/components/issue-table.scss
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
// table styled by ./src/styles/components/issue-table.scss
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
// table styled by ./src/styles/components/issue-table.scss
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
text-align: center;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
--note-font-size: 14px;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
background-color: inherit;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host,
|
||||
:host * {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import '../../../../common';
|
||||
@import '../../tasks/task/task.component.mixins';
|
||||
@use '_globals' as *;
|
||||
@use '../../tasks/task/task.component.mixins' as *;
|
||||
|
||||
:host {
|
||||
flex: 1;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import '../../../../common';
|
||||
@import '../../tasks/task/task.component.mixins';
|
||||
@use '_globals' as *;
|
||||
@use '../../tasks/task/task.component.mixins' as *;
|
||||
|
||||
:host {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import '../../../../common';
|
||||
@import '../../tasks/task/task.component.mixins';
|
||||
@use '_globals' as *;
|
||||
@use '../../tasks/task/task.component.mixins' as *;
|
||||
|
||||
:host {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
overflow: auto;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import '../../../../common';
|
||||
@import '../../tasks/task/task.component.mixins';
|
||||
@use '_globals' as *;
|
||||
@use '../../tasks/task/task.component.mixins' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import '../../../../common';
|
||||
@import '../../tasks/task/task.component.mixins';
|
||||
@use '_globals' as *;
|
||||
@use '../../tasks/task/task.component.mixins' as *;
|
||||
|
||||
:host {
|
||||
border-radius: 6px;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
border: 2px dashed var(--c-accent);
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
// TODO split up into more manageable bits
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@use 'angular-material-css-vars' as mat-css-vars;
|
||||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.month-grid-container {
|
||||
display: grid;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@use 'angular-material-css-vars' as mat-css-vars;
|
||||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.week-grid-container {
|
||||
--schedule-time-width: 3em;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
--nr-of-days: 5;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.streak-info {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
@use 'sass:math';
|
||||
|
||||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: inline-flex;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use '_globals' as *;
|
||||
|
||||
// Shared task styling mixins and utilities
|
||||
@mixin task-box-base() {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.clear-btn {
|
||||
opacity: 0.5;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.wrap-time {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
mat-dialog-content {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.dialog-help-wrapper {
|
||||
:host-context([dir='rtl']) & {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
//text-align: center;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
--this-height: 88px;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import '../../../../../common.scss';
|
||||
@import '../task-context-menu-touch-fix.scss';
|
||||
@use '_globals' as *;
|
||||
@use '../task-context-menu-touch-fix.scss';
|
||||
|
||||
.key-i {
|
||||
opacity: 0.4;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import '../../../../common';
|
||||
@import '../task/task.component.mixins';
|
||||
@use '_globals' as *;
|
||||
@use '../task/task.component.mixins' as *;
|
||||
|
||||
:host {
|
||||
position: relative;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,6 @@
|
|||
@use '_globals' as *;
|
||||
@use 'task.component.mixins' as *;
|
||||
|
||||
// TASK BOX STYLES
|
||||
// ---------------
|
||||
// NOTE: needs to come first to be overwritten by :host.isCurrent
|
||||
|
|
|
|||
|
|
@ -1,3 +1,6 @@
|
|||
@use '_globals' as *;
|
||||
@use 'task.component.mixins' as *;
|
||||
|
||||
// CONTROLS
|
||||
// --------
|
||||
.all-controls-wrapper {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import '../../../../../common';
|
||||
@import '../task.component.mixins';
|
||||
@use '_globals' as *;
|
||||
@use '../task.component.mixins' as *;
|
||||
|
||||
:host {
|
||||
transform-origin: right center;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
// Import only to access the material design color variables
|
||||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
// Import only to access the material design color variables
|
||||
@mixin isDone($direct-parent-only-sel: false) {
|
||||
@if $direct-parent-only-sel {
|
||||
.inner-wrapper.isDone > #{$direct-parent-only-sel} > & {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@import './task.component.mixins';
|
||||
@import './task-base';
|
||||
@import './task-controls';
|
||||
@use '_globals' as *;
|
||||
@use './task.component.mixins' as *;
|
||||
@use './task-base';
|
||||
@use './task-controls';
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.dialog-content {
|
||||
// 600px
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import './../../../../_common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import './../../../_common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
overflow: hidden !important;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host-context([dir='rtl']) {
|
||||
direction: rtl;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
text-align: center;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
form {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.page-settings {
|
||||
text-align: start;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
$summary-point-inner-margin: var(--s);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import './../../../_common';
|
||||
@import './../../features/tasks/task/task.component.mixins';
|
||||
@use '_globals' as *;
|
||||
@use '../../features/tasks/task/task.component.mixins' as *;
|
||||
|
||||
:host ::ng-deep mat-card-content {
|
||||
padding: 0 !important;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
@import '../../../../common';
|
||||
@import '../../../../styles/components/scrollbars';
|
||||
@use '_globals' as *;
|
||||
|
||||
@use '../../../../styles/components/scrollbars';
|
||||
|
||||
.plugin-index-container {
|
||||
height: 100%;
|
||||
|
|
@ -82,7 +83,7 @@
|
|||
height: 100%;
|
||||
border: none;
|
||||
background: transparent;
|
||||
@include _scrollBarStyles;
|
||||
@include scrollbars.scrollBarStyles;
|
||||
|
||||
&.hidden {
|
||||
visibility: hidden;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
$z-this-content: calc(var(--z-side-panel-task-and-notes) + 1);
|
||||
$z-this-backdrop: calc(var(--z-task-side-bar-over) - 1);
|
||||
|
|
@ -31,10 +31,11 @@ $z-this-backdrop: calc(var(--z-task-side-bar-over) - 1);
|
|||
min-width: 200px;
|
||||
// NOTE: prevents overlapping with nav when open
|
||||
max-width: 700px;
|
||||
background: transparent;
|
||||
background: var(--selected-task-bg-color);
|
||||
//border: 1px solid;
|
||||
//border-right: 0;
|
||||
//border-bottom: 0;
|
||||
//border-color: var(--extra-border-color);
|
||||
//box-shadow: 0px 8px 10px -5px var(--c-dark-20), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px var(--divider-color) !important;
|
||||
|
||||
@include mq(sm, max) {
|
||||
|
|
@ -46,9 +47,6 @@ $z-this-backdrop: calc(var(--z-task-side-bar-over) - 1);
|
|||
max-width: 100%;
|
||||
}
|
||||
|
||||
background: var(--selected-task-bg-color);
|
||||
//border-color: var(--extra-border-color);
|
||||
|
||||
:host.isOver & {
|
||||
position: fixed;
|
||||
width: 80vw !important;
|
||||
|
|
@ -100,6 +98,9 @@ $z-this-backdrop: calc(var(--z-task-side-bar-over) - 1);
|
|||
box-shadow: var(--whiteframe-shadow-2dp);
|
||||
border-radius: 50%;
|
||||
border: 1px solid;
|
||||
color: var(--text-color);
|
||||
background: var(--bg-lightest);
|
||||
border-color: var(--extra-border-color);
|
||||
|
||||
@include mq(xs) {
|
||||
top: 0;
|
||||
|
|
@ -115,10 +116,6 @@ $z-this-backdrop: calc(var(--z-task-side-bar-over) - 1);
|
|||
outline: none;
|
||||
}
|
||||
|
||||
color: var(--text-color);
|
||||
background: var(--bg-lightest);
|
||||
border-color: var(--extra-border-color);
|
||||
|
||||
@include mq(xs) {
|
||||
background: var(--bg-slightly-lighter);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use '_globals' as *;
|
||||
|
||||
$z-this-content: calc(var(--z-side-panel-task-and-notes) + 1);
|
||||
$z-this-backdrop: calc(var(--z-task-side-bar-over) - 1);
|
||||
$z-this-side: calc(#{$z-this-content} + 2);
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
position: fixed;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
$this-size: 130px;
|
||||
$this-handle-size: 20px;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../_common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: inline-block;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../../common';
|
||||
@use '_globals' as *;
|
||||
//@import '../../../tasks/task/task.component.mixins';
|
||||
|
||||
// TODO rename to task title component
|
||||
|
|
|
|||
|
|
@ -1,16 +1,18 @@
|
|||
@use 'sass:meta';
|
||||
@use 'styles/font/material-icons';
|
||||
|
||||
@use 'sass:math';
|
||||
|
||||
@import '../node_modules/@fontsource/roboto/400.css';
|
||||
@import '../node_modules/@fontsource/roboto/400-italic.css';
|
||||
@import '../node_modules/@fontsource/roboto/700.css';
|
||||
@import '../node_modules/@fontsource/roboto/300.css';
|
||||
@import './styles/font/material-icons';
|
||||
|
||||
@import './styles/_css-variables';
|
||||
@import './styles/themes';
|
||||
@import './styles/page';
|
||||
@import './styles/util';
|
||||
@import './styles/components/components';
|
||||
@include meta.load-css('styles/_css-variables');
|
||||
@include meta.load-css('styles/themes');
|
||||
@include meta.load-css('styles/page');
|
||||
@include meta.load-css('styles/util');
|
||||
@include meta.load-css('styles/components/components');
|
||||
|
||||
* {
|
||||
//box-shadow: none !important;
|
||||
|
|
|
|||
8
src/styles/_globals.scss
Normal file
8
src/styles/_globals.scss
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
// Global mixins and functions that are available in all component styles
|
||||
// This file forwards all mixins without namespace so they can be used directly
|
||||
|
||||
// Forward functions
|
||||
@forward 'functions/_ddivide';
|
||||
|
||||
// Forward all mixins
|
||||
@forward 'mixins/_mixins';
|
||||
|
|
@ -1,19 +1,19 @@
|
|||
@import './emoji';
|
||||
@import './scrollbars';
|
||||
@import './table';
|
||||
@import './markdown';
|
||||
@import './fab-wrapper';
|
||||
@import './backdrop';
|
||||
@import './formly-rows';
|
||||
@import './native-datepicker';
|
||||
@import './issue-table';
|
||||
@import './enlarge-img';
|
||||
@import './overwrite-material';
|
||||
@import './global-error-alert';
|
||||
@import './wrap-buttons';
|
||||
@import './shepherd';
|
||||
@import './multi-btn-wrapper';
|
||||
@import './planner-shared';
|
||||
@import './mentions';
|
||||
@use './emoji';
|
||||
@use './scrollbars';
|
||||
@use './table';
|
||||
@use './markdown';
|
||||
@use './fab-wrapper';
|
||||
@use './backdrop';
|
||||
@use './formly-rows';
|
||||
@use './native-datepicker';
|
||||
@use './issue-table';
|
||||
@use './enlarge-img';
|
||||
@use './overwrite-material';
|
||||
@use './global-error-alert';
|
||||
@use './wrap-buttons';
|
||||
@use './shepherd';
|
||||
@use './multi-btn-wrapper';
|
||||
@use './planner-shared';
|
||||
@use './mentions';
|
||||
|
||||
//@import '../../app/ui/custom-datetime-picker/sass/picker';
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use '../mixins/_media-queries';
|
||||
|
||||
:root {
|
||||
//--mat-fab-small-container-elevation-shadow: var(--whiteframe-shadow-4dp);
|
||||
--mat-dialog-container-small-max-width: 94vw;
|
||||
|
|
@ -34,7 +36,7 @@
|
|||
}
|
||||
|
||||
.cdk-overlay-pane.mat-mdc-dialog-panel {
|
||||
@include mq(xs, max) {
|
||||
@include media-queries.mq(xs, max) {
|
||||
max-width: 96vw !important;
|
||||
}
|
||||
}
|
||||
|
|
@ -52,7 +54,7 @@ body .mat-mdc-dialog-surface {
|
|||
}
|
||||
|
||||
.mat-mdc-dialog-panel {
|
||||
@include mq(xs) {
|
||||
@include media-queries.mq(xs) {
|
||||
//--mat-dialog-container-min-width: 350px;
|
||||
}
|
||||
}
|
||||
|
|
@ -77,7 +79,7 @@ body .mat-mdc-dialog-surface {
|
|||
width: 100% !important;
|
||||
max-width: none !important;
|
||||
|
||||
@include mq(xs) {
|
||||
@include media-queries.mq(xs) {
|
||||
margin: var(--s2);
|
||||
max-height: 95vh !important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,12 @@
|
|||
@use '../mixins/_media-queries';
|
||||
|
||||
.fab-wrapper {
|
||||
position: fixed;
|
||||
right: 32px;
|
||||
bottom: 32px;
|
||||
z-index: 333;
|
||||
|
||||
@include mq(xs, max) {
|
||||
@include media-queries.mq(xs, max) {
|
||||
right: 50%;
|
||||
transform: translateX(50%);
|
||||
bottom: 16px;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../../common';
|
||||
@use '_globals' as *;
|
||||
|
||||
.formly-row {
|
||||
@include mq(xs) {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
@use '../mixins/_scroll';
|
||||
|
||||
.markdown-preview,
|
||||
.markdown {
|
||||
@include scrollY;
|
||||
@include scroll.scrollY;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
overflow-wrap: break-word;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use '../mixins/_is-touch-device';
|
||||
|
||||
.g-multi-btn-wrapper {
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
|
@ -36,7 +38,7 @@
|
|||
height: 40px;
|
||||
}
|
||||
|
||||
@include mousePrimaryDevice(true) {
|
||||
@include is-touch-device.mousePrimaryDevice(true) {
|
||||
opacity: 0;
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -45,7 +47,7 @@
|
|||
&:focus,
|
||||
&:hover {
|
||||
button:nth-of-type(n + 2) {
|
||||
@include mousePrimaryDevice(true) {
|
||||
@include is-touch-device.mousePrimaryDevice(true) {
|
||||
opacity: 0.8;
|
||||
display: inline-flex;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
@import '../../common';
|
||||
@use '../../_common';
|
||||
@use '../mixins/_media-queries';
|
||||
|
||||
// to share between planner-task and planner-calendar-event
|
||||
.planner-time-remaining-shared {
|
||||
|
|
@ -11,18 +12,18 @@
|
|||
line-height: 1;
|
||||
margin-left: auto;
|
||||
font-size: var(--planner-font-size-mobile);
|
||||
color: var(--text-color-muted);
|
||||
|
||||
@include mq(xs) {
|
||||
@include media-queries.mq(xs) {
|
||||
font-size: var(--planner-font-size);
|
||||
}
|
||||
color: var(--text-color-muted);
|
||||
|
||||
mat-icon {
|
||||
vertical-align: middle;
|
||||
margin-top: -2px;
|
||||
height: 14px !important;
|
||||
|
||||
@include mq(xs) {
|
||||
@include media-queries.mq(xs) {
|
||||
height: 16px !important;
|
||||
font-size: var(--planner-font-size);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
@import '../mixins/media-queries';
|
||||
@use '../mixins/_media-queries';
|
||||
|
||||
@mixin _scrollBarStyles() {
|
||||
@mixin scrollBarStyles() {
|
||||
scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
|
||||
scrollbar-width: 4px;
|
||||
|
||||
|
|
@ -27,14 +27,14 @@
|
|||
}
|
||||
}
|
||||
|
||||
@include mq(xs) {
|
||||
@include media-queries.mq(xs) {
|
||||
.isNoMac {
|
||||
@include _scrollBarStyles;
|
||||
@include scrollBarStyles;
|
||||
}
|
||||
}
|
||||
|
||||
@include mq(xs, max) {
|
||||
@include media-queries.mq(xs, max) {
|
||||
.isNoTouchOnly {
|
||||
@include _scrollBarStyles;
|
||||
@include scrollBarStyles;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use '../mixins/_theming';
|
||||
|
||||
//@import "shepherd.js/dist/css/shepherd.css";
|
||||
|
||||
.shepherd-modal-overlay-container {
|
||||
|
|
@ -45,7 +47,7 @@
|
|||
line-height: 2em;
|
||||
position: relative;
|
||||
|
||||
@include darkTheme(true) {
|
||||
@include theming.darkTheme(true) {
|
||||
background: var(--dark8) !important;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use '../mixins/_media-queries';
|
||||
|
||||
table {
|
||||
th,
|
||||
td {
|
||||
|
|
@ -6,7 +8,7 @@ table {
|
|||
overflow-y: visible !important;
|
||||
}
|
||||
|
||||
@include mq(xs) {
|
||||
@include media-queries.mq(xs) {
|
||||
th,
|
||||
td {
|
||||
padding: 0 var(--s);
|
||||
|
|
|
|||
|
|
@ -1,2 +1,2 @@
|
|||
@import 'clearfix';
|
||||
@import 'list-reset';
|
||||
@use './clearfix';
|
||||
@use './list-reset';
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../mixins/material-icon';
|
||||
@use '../mixins/material-icon';
|
||||
|
||||
// Download from:
|
||||
// https://github.com/google/material-design-icons/tree/master/font
|
||||
|
|
@ -14,5 +14,5 @@
|
|||
}
|
||||
|
||||
.material-icons {
|
||||
@include materialIconBase();
|
||||
@include material-icon.materialIconBase();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use './theming';
|
||||
|
||||
//$shadow-edit-on-click-light: 0 0 4px 0 var(--c-dark-80), var(--whiteframe-shadow-14dp);
|
||||
//$shadow-edit-on-click-dark: 0 0 4px 0 var(--bg)-lightest, var(--whiteframe-shadow-14dp);
|
||||
$shadow-edit-on-click-dark: var(--whiteframe-shadow-15dp);
|
||||
|
|
@ -11,7 +13,7 @@ $shadow-edit-on-click-light: var(--whiteframe-shadow-7dp);
|
|||
border: 1px solid var(--c-accent);
|
||||
//border: 1px solid var(--extra-border-color);
|
||||
|
||||
@include darkTheme() {
|
||||
@include theming.darkTheme() {
|
||||
background: var(--dark24);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,14 +1,17 @@
|
|||
@import 'theming';
|
||||
@import 'positioning';
|
||||
@import 'text';
|
||||
@import 'grab-cursor';
|
||||
@import 'note-style';
|
||||
@import 'hardware';
|
||||
@import 'pseudo';
|
||||
@import 'scroll';
|
||||
@import 'main-container';
|
||||
@import 'inline-edit-elevation';
|
||||
@import 'is-touch-device';
|
||||
@import 'responsive-ratio';
|
||||
@import 'material-icon';
|
||||
@import 'media-queries';
|
||||
// Forward all mixins so they can be used without namespace in components
|
||||
@forward '_theming';
|
||||
@forward '_positioning';
|
||||
@forward '_text';
|
||||
@forward '_grab-cursor';
|
||||
@forward '_note-style';
|
||||
@forward '_hardware';
|
||||
@forward '_pseudo';
|
||||
@forward '_scroll';
|
||||
@forward '_main-container';
|
||||
@forward '_inline-edit-elevation';
|
||||
@forward '_is-touch-device';
|
||||
@forward '_responsive-ratio';
|
||||
@forward '_material-icon';
|
||||
@forward '_media-queries';
|
||||
|
||||
// Internal @use statements removed to avoid potential circular dependency issues
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue