Merge pull request #684 from Textualize/delay-transition

Delay transition
This commit is contained in:
Will McGugan
2022-08-31 11:47:01 +01:00
committed by GitHub
9 changed files with 602 additions and 52 deletions

View File

@@ -4,18 +4,18 @@
* {
transition: color 300ms linear, background 300ms linear;
}
}
*:hover {
/* tint: 30% red;
/* tint: 30% red;
/* outline: heavy red; */
}
App > Screen {
background: $surface;
color: $text-surface;
color: $text-surface;
layers: base sidebar;
color: $text-background;
@@ -23,12 +23,12 @@ App > Screen {
layout: vertical;
overflow: hidden;
}
#tree-container {
overflow-y: auto;
height: 20;
height: 20;
margin: 1 2;
background: $panel;
padding: 1 2;
@@ -37,7 +37,7 @@ App > Screen {
DirectoryTree {
padding: 0 1;
height: auto;
}
@@ -48,8 +48,8 @@ DataTable {
/* tint: 10% green; */
/* opacity: 50%; */
padding: 1;
margin: 1 2;
height: 24;
margin: 1 2;
height: 24;
}
#sidebar {
@@ -59,7 +59,7 @@ DataTable {
width: 30;
margin-bottom: 1;
offset-x: -100%;
transition: offset 500ms in_out_cubic;
layer: sidebar;
}
@@ -98,7 +98,7 @@ Tweet {
height:12;
width: 100%;
margin: 0 2;
margin:0 2;
background: $panel;
color: $text-panel;
@@ -123,9 +123,9 @@ Tweet {
layout: vertical;
}
.code {
.code {
height: auto;
}
@@ -135,12 +135,12 @@ TweetHeader {
color: $text-accent
}
TweetBody {
TweetBody {
width: 100%;
background: $panel;
color: $text-panel;
height: auto;
padding: 0 1 0 0;
height: auto;
padding: 0 1 0 0;
}
Tweet.scroll-horizontal TweetBody {
@@ -160,7 +160,7 @@ Tweet.scroll-horizontal TweetBody {
/* padding: 1 0 0 0 ; */
transition: background 400ms in_out_cubic, color 400ms in_out_cubic;
}
.button:hover {
@@ -180,7 +180,7 @@ Tweet.scroll-horizontal TweetBody {
color: $text-accent;
background: $accent;
height: 1;
content-align: center middle;
dock:bottom;
}
@@ -215,7 +215,7 @@ Error {
color: $text-error;
border-top: tall $error-darken-2;
border-bottom: tall $error-darken-2;
padding: 0;
text-style: bold;
align-horizontal: center;
@@ -228,21 +228,21 @@ Warning {
color: $text-warning-fade-1;
border-top: tall $warning-darken-2;
border-bottom: tall $warning-darken-2;
text-style: bold;
align-horizontal: center;
}
Success {
width: 100%;
height:auto;
height:auto;
box-sizing: border-box;
background: $success;
color: $text-success-fade-1;
color: $text-success-fade-1;
border-top: hkey $success-darken-2;
border-bottom: hkey $success-darken-2;
border-bottom: hkey $success-darken-2;
text-style: bold ;