clean model (A)
This commit is contained in:
marlon-erler
Vendored
+304
-304
@@ -1,78 +1,3 @@
|
||||
/* src/base.css */
|
||||
#home-page,
|
||||
#home-page #chat-section,
|
||||
#chat-page,
|
||||
#chat-page #main > div {
|
||||
animation: slide-up var(--animation-duration) ease;
|
||||
}
|
||||
#background-wrapper {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: var(--safe-area-left);
|
||||
right: var(--safe-area-right);
|
||||
bottom: 0px;
|
||||
z-index: 1;
|
||||
pointer-events: none;
|
||||
overflow: hidden;
|
||||
opacity: 0.4;
|
||||
}
|
||||
main {
|
||||
z-index: 2;
|
||||
}
|
||||
#background-wrapper div {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -80px;
|
||||
left: -80px;
|
||||
right: -80px;
|
||||
bottom: -80px;
|
||||
z-index: -1;
|
||||
pointer-events: none;
|
||||
filter: blur(40px);
|
||||
}
|
||||
#background-wrapper #sky {
|
||||
left: -100%;
|
||||
bottom: -50%;
|
||||
--color-1: hsl(188, 100%, 83%);
|
||||
--color-2: hsl(194, 72%, 56%);
|
||||
background-image: radial-gradient(var(--color-1), var(--color-2));
|
||||
}
|
||||
#background-wrapper #grass-1 {
|
||||
--color-1: hsl(150, 100%, 30%);
|
||||
--color-2: hsl(150, 100%, 25%);
|
||||
background-image:
|
||||
linear-gradient(
|
||||
350deg,
|
||||
var(--color-1),
|
||||
var(--color-2) 30%,
|
||||
transparent 40%);
|
||||
}
|
||||
#background-wrapper #grass-2 {
|
||||
--color-1: hsl(110, 100%, 40%);
|
||||
--color-2: hsl(110, 100%, 35%);
|
||||
background-image:
|
||||
linear-gradient(
|
||||
9deg,
|
||||
var(--color-1),
|
||||
var(--color-2) 30%,
|
||||
transparent 35%);
|
||||
}
|
||||
body[theme=dark] #background-wrapper {
|
||||
opacity: 0.5;
|
||||
}
|
||||
body[theme=dark] #background-wrapper #sky {
|
||||
--color-1: hsl(188, 100%, 30%);
|
||||
--color-2: hsl(194, 72%, 24%);
|
||||
}
|
||||
body[theme=dark] #background-wrapper #grass-1 {
|
||||
--color-1: hsl(120, 30%, 30%);
|
||||
--color-2: hsl(120, 30%, 24%);
|
||||
}
|
||||
body[theme=dark] #background-wrapper #grass-2 {
|
||||
--color-1: hsl(110, 60%, 30%);
|
||||
--color-2: hsl(110, 50%, 24%);
|
||||
}
|
||||
|
||||
/* src/colors.css */
|
||||
[color]:not([color=standard]) {
|
||||
--primary: hsl(var(--hue), 100%, var(--accent-luma));
|
||||
@@ -238,6 +163,143 @@ body[theme=dark] [color]:not([color=standard]).subtle-background {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* src/base.css */
|
||||
#home-page,
|
||||
#home-page #chat-section,
|
||||
#chat-page,
|
||||
#chat-page #main > div {
|
||||
animation: slide-up var(--animation-duration) ease;
|
||||
}
|
||||
#background-wrapper {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: var(--safe-area-left);
|
||||
right: var(--safe-area-right);
|
||||
bottom: 0px;
|
||||
z-index: 1;
|
||||
pointer-events: none;
|
||||
overflow: hidden;
|
||||
opacity: 0.4;
|
||||
}
|
||||
main {
|
||||
z-index: 2;
|
||||
}
|
||||
#background-wrapper div {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -80px;
|
||||
left: -80px;
|
||||
right: -80px;
|
||||
bottom: -80px;
|
||||
z-index: -1;
|
||||
pointer-events: none;
|
||||
filter: blur(40px);
|
||||
}
|
||||
#background-wrapper #sky {
|
||||
left: -100%;
|
||||
bottom: -50%;
|
||||
--color-1: hsl(188, 100%, 83%);
|
||||
--color-2: hsl(194, 72%, 56%);
|
||||
background-image: radial-gradient(var(--color-1), var(--color-2));
|
||||
}
|
||||
#background-wrapper #grass-1 {
|
||||
--color-1: hsl(150, 100%, 30%);
|
||||
--color-2: hsl(150, 100%, 25%);
|
||||
background-image:
|
||||
linear-gradient(
|
||||
350deg,
|
||||
var(--color-1),
|
||||
var(--color-2) 30%,
|
||||
transparent 40%);
|
||||
}
|
||||
#background-wrapper #grass-2 {
|
||||
--color-1: hsl(110, 100%, 40%);
|
||||
--color-2: hsl(110, 100%, 35%);
|
||||
background-image:
|
||||
linear-gradient(
|
||||
9deg,
|
||||
var(--color-1),
|
||||
var(--color-2) 30%,
|
||||
transparent 35%);
|
||||
}
|
||||
body[theme=dark] #background-wrapper {
|
||||
opacity: 0.5;
|
||||
}
|
||||
body[theme=dark] #background-wrapper #sky {
|
||||
--color-1: hsl(188, 100%, 30%);
|
||||
--color-2: hsl(194, 72%, 24%);
|
||||
}
|
||||
body[theme=dark] #background-wrapper #grass-1 {
|
||||
--color-1: hsl(120, 30%, 30%);
|
||||
--color-2: hsl(120, 30%, 24%);
|
||||
}
|
||||
body[theme=dark] #background-wrapper #grass-2 {
|
||||
--color-1: hsl(110, 60%, 30%);
|
||||
--color-2: hsl(110, 50%, 24%);
|
||||
}
|
||||
|
||||
/* src/View/homePage.css */
|
||||
#home-page > div {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: var(--large-gap);
|
||||
scroll-snap-type: x mandatory;
|
||||
scroll-behavior: smooth;
|
||||
overflow: hidden;
|
||||
overflow-x: scroll;
|
||||
padding: 0px;
|
||||
}
|
||||
#home-page > div > div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
gap: var(--gap-between-tiles);
|
||||
padding: var(--content-padding);
|
||||
padding-top: calc(var(--header-height) + var(--content-margin));
|
||||
width: 100%;
|
||||
min-width: 100%;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
scroll-snap-align: center;
|
||||
}
|
||||
#home-page #overview-section,
|
||||
#home-page #chat-section {
|
||||
padding-bottom: calc(var(--content-padding) + var(--header-height) + var(--safe-area-bottom));
|
||||
}
|
||||
#home-page #chat-grid {
|
||||
margin-top: var(--content-padding);
|
||||
display: grid;
|
||||
gap: var(--gap-between-tiles);
|
||||
grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
#home-page > div {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
#home-page #overview-section {
|
||||
width: 20rem;
|
||||
min-width: 20rem;
|
||||
}
|
||||
#home-page #chat-section {
|
||||
flex: 1;
|
||||
min-width: unset;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
#home-page #overview-section,
|
||||
#home-page #chat-section {
|
||||
padding-left: 3rem;
|
||||
padding-right: 3rem;
|
||||
}
|
||||
#home-page #chat-grid {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
#home-page #overview-section {
|
||||
width: var(--max-input-width);
|
||||
min-width: var(--max-input-width);
|
||||
}
|
||||
}
|
||||
|
||||
/* src/View/chatPage.css */
|
||||
#chat-page-wrapper {
|
||||
display: none;
|
||||
@@ -408,179 +470,95 @@ body[showing-chat] #chat-page-wrapper {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* src/View/homePage.css */
|
||||
#home-page > div {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: var(--large-gap);
|
||||
scroll-snap-type: x mandatory;
|
||||
scroll-behavior: smooth;
|
||||
overflow: hidden;
|
||||
overflow-x: scroll;
|
||||
/* src/View/ChatPages/taskPage.css */
|
||||
#chat-page > div > #main > #task-page > .pane-wrapper > .pane > .main-content {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
padding: 0px;
|
||||
}
|
||||
#home-page > div > div {
|
||||
#chat-page > div > #main > #task-page > .pane-wrapper > .pane > .main-content > div {
|
||||
animation: slide-up var(--animation-duration);
|
||||
}
|
||||
#chat-page > div > #main > #task-page .task-grid {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
gap: var(--gap-between-tiles);
|
||||
padding: var(--content-padding);
|
||||
padding-top: calc(var(--header-height) + var(--content-margin));
|
||||
}
|
||||
#chat-page > div > #main > #task-page .kanban-board-wrapper,
|
||||
#chat-page > div > #main > #task-page .status-page-content {
|
||||
display: flex;
|
||||
align-items: start;
|
||||
gap: var(--large-gap);
|
||||
width: 100%;
|
||||
min-width: 100%;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
scroll-snap-align: center;
|
||||
}
|
||||
#home-page #overview-section,
|
||||
#home-page #chat-section {
|
||||
padding-bottom: calc(var(--content-padding) + var(--header-height) + var(--safe-area-bottom));
|
||||
}
|
||||
#home-page #chat-grid {
|
||||
margin-top: var(--content-padding);
|
||||
display: grid;
|
||||
gap: var(--gap-between-tiles);
|
||||
grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
#home-page > div {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
#home-page #overview-section {
|
||||
width: 20rem;
|
||||
min-width: 20rem;
|
||||
}
|
||||
#home-page #chat-section {
|
||||
flex: 1;
|
||||
min-width: unset;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
#home-page #overview-section,
|
||||
#home-page #chat-section {
|
||||
padding-left: 3rem;
|
||||
padding-right: 3rem;
|
||||
}
|
||||
#home-page #chat-grid {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
#home-page #overview-section {
|
||||
width: var(--max-input-width);
|
||||
min-width: var(--max-input-width);
|
||||
}
|
||||
}
|
||||
|
||||
/* src/View/ChatPages/calendarPage.css */
|
||||
#chat-page > div > #main > #calendar-page > .pane-wrapper > .pane > .toolbar .input-wrapper {
|
||||
display: flex;
|
||||
padding: var(--gap-between-tiles);
|
||||
gap: var(--gap-between-tiles);
|
||||
}
|
||||
#chat-page > div > #main > #calendar-page > .pane-wrapper > .pane > .toolbar .input-wrapper > input {
|
||||
min-height: unset;
|
||||
height: calc(var(--control-height) - 2 * var(--gap-between-tiles));
|
||||
appearance: textfield;
|
||||
-moz-appearance: textfield;
|
||||
padding-right: 0px;
|
||||
}
|
||||
#calendar-page .input-wrapper > input::-webkit-outer-spin-button,
|
||||
#calendar-page .input-wrapper > input::-webkit-innner-spin-button {
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
margin: 0px;
|
||||
}
|
||||
#chat-page > div > #main > #calendar-page > .pane-wrapper > .pane > .toolbar .input-wrapper > .year-input {
|
||||
width: 4.4rem;
|
||||
}
|
||||
#chat-page > div > #main > #calendar-page > .pane-wrapper > .pane > .toolbar .input-wrapper > .month-input {
|
||||
width: 3.1rem;
|
||||
}
|
||||
@media (max-width: 1024px) {
|
||||
#chat-page > div > #main > #calendar-page {
|
||||
flex-direction: column;
|
||||
}
|
||||
#chat-page > div > #main > #calendar-page .grid-pane-wrapper {
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
}
|
||||
|
||||
/* src/View/Components/monthGrid.css */
|
||||
.month-grid-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--gap-between-tiles);
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
.month-grid-wrapper .day-labels {
|
||||
flex: 0;
|
||||
padding: var(--content-padding);
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
.month-grid-wrapper > div {
|
||||
display: grid;
|
||||
gap: var(--gap-between-tiles);
|
||||
grid-template-columns: repeat(7, minmax(0px, 1fr));
|
||||
animation: slide-up var(--animation-duration);
|
||||
}
|
||||
.month-grid {
|
||||
overflow: visible;
|
||||
padding: var(--content-padding);
|
||||
padding-top: 0px;
|
||||
flex: 1;
|
||||
grid-auto-rows: 1fr;
|
||||
}
|
||||
.month-grid .tile {
|
||||
animation: slide-up var(--animation-duration);
|
||||
overflow: hidden;
|
||||
align-items: start;
|
||||
}
|
||||
.month-grid .tile[today] b {
|
||||
color: var(--primary);
|
||||
}
|
||||
.month-grid .tile > div {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.month-grid .tile .event-count {
|
||||
display: none;
|
||||
background-color: var(--text-normal);
|
||||
color: var(--background);
|
||||
opacity: 0.6;
|
||||
border-radius: 100%;
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
font-size: 0.6rem;
|
||||
font-weight: bold;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.month-grid .tile .event-count[has-events] {
|
||||
background-color: var(--primary);
|
||||
opacity: 1;
|
||||
}
|
||||
.month-grid .tile .event-list {
|
||||
#chat-page > div > #main > #task-page .kanban-board-wrapper .kanban-column,
|
||||
#chat-page > div > #main > #task-page .status-grid-wrapper .status-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
gap: var(--gap-between-tiles);
|
||||
}
|
||||
.month-grid .tile .event-list span {
|
||||
animation: slide-up var(--animation-duration);
|
||||
#chat-page > div > #main > #task-page .property-input-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
@media (max-width: 640px) and (max-height: 1200px) {
|
||||
.month-grid .tile {
|
||||
padding: 0px;
|
||||
#chat-page > div > #main > #task-page .kanban-board-wrapper .kanban-column,
|
||||
#chat-page > div > #main > #task-page .property-input-wrapper,
|
||||
#chat-page > div > #main > #task-page .status-grid-wrapper .status-column,
|
||||
#chat-page > div > #main > #task-page .status-name-row > *,
|
||||
#chat-page > div > #main > #task-page .status-name-row::before {
|
||||
width: 18rem;
|
||||
min-width: 18rem;
|
||||
max-width: 18rem;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .status-name-row,
|
||||
#chat-page > div > #main > #task-page .status-grid-wrapper {
|
||||
display: flex;
|
||||
gap: var(--large-gap);
|
||||
}
|
||||
#chat-page > div > #main > #task-page .status-page-content,
|
||||
#chat-page > div > #main > #task-page .status-grid-wrapper {
|
||||
flex-direction: column;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .status-name-row::before {
|
||||
content: "";
|
||||
display: flex;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .board-close-button {
|
||||
display: none;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .board-toggle-button {
|
||||
display: flex;
|
||||
}
|
||||
#chat-page > div > #main > #task-page[isshowingboard][showingboardlist=false] #board-list {
|
||||
display: none;
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
#chat-page > div > #main > #task-page .task-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
|
||||
}
|
||||
.month-grid .tile > div {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@media (max-width: 1024px) {
|
||||
#chat-page > div > #main > #task-page #board-list {
|
||||
display: false;
|
||||
}
|
||||
.month-grid .tile .event-count {
|
||||
#chat-page > div > #main > #task-page #board-content {
|
||||
display: none;
|
||||
}
|
||||
#chat-page > div > #main > #task-page[isshowingboard] #board-list {
|
||||
display: none;
|
||||
}
|
||||
#chat-page > div > #main > #task-page[isshowingboard] #board-content {
|
||||
display: flex;
|
||||
}
|
||||
.month-grid .tile .event-list {
|
||||
#chat-page > div > #main > #task-page .board-close-button {
|
||||
display: flex;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .board-toggle-button {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -810,95 +788,117 @@ body[showing-chat] #chat-page-wrapper {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
|
||||
/* src/View/ChatPages/taskPage.css */
|
||||
#chat-page > div > #main > #task-page > .pane-wrapper > .pane > .main-content {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
padding: 0px;
|
||||
}
|
||||
#chat-page > div > #main > #task-page > .pane-wrapper > .pane > .main-content > div {
|
||||
animation: slide-up var(--animation-duration);
|
||||
}
|
||||
#chat-page > div > #main > #task-page .task-grid {
|
||||
/* src/View/ChatPages/calendarPage.css */
|
||||
#chat-page > div > #main > #calendar-page > .pane-wrapper > .pane > .toolbar .input-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--gap-between-tiles);
|
||||
padding: var(--content-padding);
|
||||
}
|
||||
#chat-page > div > #main > #task-page .kanban-board-wrapper,
|
||||
#chat-page > div > #main > #task-page .status-page-content {
|
||||
display: flex;
|
||||
align-items: start;
|
||||
gap: var(--large-gap);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
padding: var(--content-padding);
|
||||
}
|
||||
#chat-page > div > #main > #task-page .kanban-board-wrapper .kanban-column,
|
||||
#chat-page > div > #main > #task-page .status-grid-wrapper .status-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: var(--gap-between-tiles);
|
||||
gap: var(--gap-between-tiles);
|
||||
}
|
||||
#chat-page > div > #main > #task-page .property-input-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
#chat-page > div > #main > #calendar-page > .pane-wrapper > .pane > .toolbar .input-wrapper > input {
|
||||
min-height: unset;
|
||||
height: calc(var(--control-height) - 2 * var(--gap-between-tiles));
|
||||
appearance: textfield;
|
||||
-moz-appearance: textfield;
|
||||
padding-right: 0px;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .kanban-board-wrapper .kanban-column,
|
||||
#chat-page > div > #main > #task-page .property-input-wrapper,
|
||||
#chat-page > div > #main > #task-page .status-grid-wrapper .status-column,
|
||||
#chat-page > div > #main > #task-page .status-name-row > *,
|
||||
#chat-page > div > #main > #task-page .status-name-row::before {
|
||||
width: 18rem;
|
||||
min-width: 18rem;
|
||||
max-width: 18rem;
|
||||
#calendar-page .input-wrapper > input::-webkit-outer-spin-button,
|
||||
#calendar-page .input-wrapper > input::-webkit-innner-spin-button {
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
margin: 0px;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .status-name-row,
|
||||
#chat-page > div > #main > #task-page .status-grid-wrapper {
|
||||
display: flex;
|
||||
gap: var(--large-gap);
|
||||
#chat-page > div > #main > #calendar-page > .pane-wrapper > .pane > .toolbar .input-wrapper > .year-input {
|
||||
width: 4.4rem;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .status-page-content,
|
||||
#chat-page > div > #main > #task-page .status-grid-wrapper {
|
||||
flex-direction: column;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .status-name-row::before {
|
||||
content: "";
|
||||
display: flex;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .board-close-button {
|
||||
display: none;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .board-toggle-button {
|
||||
display: flex;
|
||||
}
|
||||
#chat-page > div > #main > #task-page[isshowingboard][showingboardlist=false] #board-list {
|
||||
display: none;
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
#chat-page > div > #main > #task-page .task-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
|
||||
}
|
||||
#chat-page > div > #main > #calendar-page > .pane-wrapper > .pane > .toolbar .input-wrapper > .month-input {
|
||||
width: 3.1rem;
|
||||
}
|
||||
@media (max-width: 1024px) {
|
||||
#chat-page > div > #main > #task-page #board-list {
|
||||
display: false;
|
||||
#chat-page > div > #main > #calendar-page {
|
||||
flex-direction: column;
|
||||
}
|
||||
#chat-page > div > #main > #task-page #board-content {
|
||||
display: none;
|
||||
#chat-page > div > #main > #calendar-page .grid-pane-wrapper {
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
#chat-page > div > #main > #task-page[isshowingboard] #board-list {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* src/View/Components/monthGrid.css */
|
||||
.month-grid-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--gap-between-tiles);
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
.month-grid-wrapper .day-labels {
|
||||
flex: 0;
|
||||
padding: var(--content-padding);
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
.month-grid-wrapper > div {
|
||||
display: grid;
|
||||
gap: var(--gap-between-tiles);
|
||||
grid-template-columns: repeat(7, minmax(0px, 1fr));
|
||||
animation: slide-up var(--animation-duration);
|
||||
}
|
||||
.month-grid {
|
||||
overflow: visible;
|
||||
padding: var(--content-padding);
|
||||
padding-top: 0px;
|
||||
flex: 1;
|
||||
grid-auto-rows: 1fr;
|
||||
}
|
||||
.month-grid .tile {
|
||||
animation: slide-up var(--animation-duration);
|
||||
overflow: hidden;
|
||||
align-items: start;
|
||||
}
|
||||
.month-grid .tile[today] b {
|
||||
color: var(--primary);
|
||||
}
|
||||
.month-grid .tile > div {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.month-grid .tile .event-count {
|
||||
display: none;
|
||||
background-color: var(--text-normal);
|
||||
color: var(--background);
|
||||
opacity: 0.6;
|
||||
border-radius: 100%;
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
font-size: 0.6rem;
|
||||
font-weight: bold;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.month-grid .tile .event-count[has-events] {
|
||||
background-color: var(--primary);
|
||||
opacity: 1;
|
||||
}
|
||||
.month-grid .tile .event-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
gap: var(--gap-between-tiles);
|
||||
}
|
||||
.month-grid .tile .event-list span {
|
||||
animation: slide-up var(--animation-duration);
|
||||
}
|
||||
@media (max-width: 640px) and (max-height: 1200px) {
|
||||
.month-grid .tile {
|
||||
padding: 0px;
|
||||
}
|
||||
#chat-page > div > #main > #task-page[isshowingboard] #board-content {
|
||||
.month-grid .tile > div {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.month-grid .tile .event-count {
|
||||
display: flex;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .board-close-button {
|
||||
display: flex;
|
||||
}
|
||||
#chat-page > div > #main > #task-page .board-toggle-button {
|
||||
.month-grid .tile .event-list {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
Vendored
+4289
-4282
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user