fix styling issues
This commit is contained in:
parent
0bbc5289ad
commit
d6e4ae5600
|
@ -15,10 +15,11 @@
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="text">
|
<div class="text">
|
||||||
|
|
||||||
<TextArea
|
<TextArea
|
||||||
bind:value
|
bind:value
|
||||||
placeholder="Enter your name"
|
placeholder=""
|
||||||
label="Construct your text" />
|
label="Select bindable properties from the right." />
|
||||||
</div>
|
</div>
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<ul>
|
<ul>
|
||||||
|
@ -31,12 +32,11 @@
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.container {
|
.container {
|
||||||
grid-gap: 20px;
|
|
||||||
padding: 20px;
|
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: auto auto;
|
grid-template-columns: auto auto;
|
||||||
}
|
}
|
||||||
.text {
|
.text {
|
||||||
|
padding: var(--spacing-s) 0 var(--spacing-s) var(--spacing-s);
|
||||||
width: 600px;
|
width: 600px;
|
||||||
display: grid;
|
display: grid;
|
||||||
}
|
}
|
||||||
|
@ -47,8 +47,9 @@
|
||||||
list-style: none;
|
list-style: none;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: var(--spacing-s) 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
li {
|
li {
|
||||||
display: flex;
|
display: flex;
|
||||||
font-family: var(--font-sans);
|
font-family: var(--font-sans);
|
||||||
|
@ -59,4 +60,12 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
li:hover {
|
||||||
|
background-color: var(--grey-2);
|
||||||
|
}
|
||||||
|
|
||||||
|
li:active {
|
||||||
|
color: var(--blue);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue