Merge pull request #332 from Budibase/Data-components-UI-tidy-up
Data Components UI Update
This commit is contained in:
commit
7e2922615b
|
@ -59,6 +59,7 @@
|
|||
</script>
|
||||
|
||||
<form class="form" on:submit|preventDefault>
|
||||
<h1>{modelDef.name} Form</h1>
|
||||
<div class="form-content">
|
||||
{#each fields as field}
|
||||
<div class="form-item">
|
||||
|
@ -79,14 +80,14 @@
|
|||
|
||||
<style>
|
||||
.form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form-content {
|
||||
margin-bottom: 20px;
|
||||
justify-content: space-between;
|
||||
align-items: baseline;
|
||||
|
||||
}
|
||||
|
||||
.input {
|
||||
|
@ -100,13 +101,13 @@
|
|||
|
||||
.form-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
font-weight: bold;
|
||||
margin-bottom: 8px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
hr {
|
||||
|
|
|
@ -65,24 +65,31 @@
|
|||
}
|
||||
|
||||
thead {
|
||||
background: #f9f9f9;
|
||||
background: #393C44;
|
||||
border: 1px solid #ccc;
|
||||
height: 40px;
|
||||
text-align: left;
|
||||
margin-right: 60px;
|
||||
}
|
||||
|
||||
thead th {
|
||||
color: var(--button-text);
|
||||
color: #ffffff;
|
||||
text-transform: capitalize;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
text-rendering: optimizeLegibility;
|
||||
letter-spacing: 1px;
|
||||
justify-content: left;
|
||||
padding: 16px 20px 16px 8px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
tbody tr {
|
||||
border-bottom: 1px solid #ccc;
|
||||
transition: 0.3s background-color;
|
||||
color: var(--secondary100);
|
||||
color: #393C44;
|
||||
font-size: 14px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
tbody tr:hover {
|
||||
|
|
|
@ -79,7 +79,7 @@
|
|||
|
||||
<div class="login-button-container">
|
||||
<button disabled={loading} on:click={login} class={_buttonClass}>
|
||||
{loginButtonLabel}
|
||||
Log in to {name}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
|
Loading…
Reference in New Issue