add lit_styling to index.css
This commit is contained in:
parent
d9802da6ea
commit
f8c82ec912
2 changed files with 45 additions and 0 deletions
1
src/index.css
vendored
1
src/index.css
vendored
|
@ -1,6 +1,7 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
@import "./lit_navigation_style.css";
|
||||
|
||||
div[tabindex] {
|
||||
flex: 1;
|
||||
|
|
44
src/lit_navigation_style.css
vendored
Normal file
44
src/lit_navigation_style.css
vendored
Normal file
|
@ -0,0 +1,44 @@
|
|||
.litbutton{
|
||||
color: #755d86;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.litbutton:before {
|
||||
content: "[";
|
||||
margin-right: 10px;
|
||||
display: inline-block;
|
||||
opacity: 0;
|
||||
-webkit-transform: translateX(20px);
|
||||
-moz-transform: translateX(20px);
|
||||
transform: translateX(20px);
|
||||
-webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
|
||||
-moz-transition: -moz-transform 0.3s, opacity 0.2s;
|
||||
transition: transform 0.3s, opacity 0.2s;
|
||||
}
|
||||
|
||||
.litbutton:after {
|
||||
content: "]";
|
||||
margin-left: 10px;
|
||||
display: inline-block;
|
||||
opacity: 0;
|
||||
-webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
|
||||
-moz-transition: -moz-transform 0.3s, opacity 0.2s;
|
||||
transition: transform 0.3s, opacity 0.2s;
|
||||
-webkit-transform: translateX(-20px);
|
||||
-moz-transform: translateX(-20px);
|
||||
transform: translateX(-20px);
|
||||
}
|
||||
.litbutton:hover{
|
||||
color: #3a97a3;
|
||||
}
|
||||
.litbutton-active{
|
||||
color: #3a97a3;
|
||||
}
|
||||
.litbutton:hover:before,
|
||||
.litbutton:hover:after {
|
||||
color: #3a97a3;
|
||||
opacity: 1;
|
||||
-webkit-transform: translateX(0px);
|
||||
-moz-transform: translateX(0px);
|
||||
transform: translateX(0px);
|
||||
}
|
Loading…
Reference in a new issue