fix styling issues

This commit is contained in:
kevmodrome 2020-08-25 11:40:48 +02:00
parent 0bbc5289ad
commit d6e4ae5600
1 changed files with 14 additions and 5 deletions

View File

@ -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>