a small relational database with user-editable schema for manual data entry
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

200 lines
2.8 KiB

*, *::before, *::after {
box-sizing: border-box;
}
html, textarea, select {
font-family: "IBM Plex", "DejaVu Sans", "Helvetica", sans-serif;
}
.Form {
display: block;
width: 900px;
margin: 0 auto;
}
nav.top-nav {
margin-bottom: .5rem;
border-bottom: 1px solid silver;
}
nav.top-nav, .content {
margin: 0 auto;
width: 900px;
}
a {
color: gray;
text-decoration: none;
}
a:hover {
color: black;
text-decoration: underline;
}
nav.top-nav a {
display: inline-block;
padding: .75rem;
color: gray;
text-decoration: none;
}
nav.top-nav a:hover {
color: black;
text-decoration: underline;
}
.Form .Row {
display: flex;
padding: .25rem;
}
.Form .Row.indented {
padding-left: 10.25rem;
}
input[type="text"],
input[type="number"],
textarea,
.tag-input {
border: 1px solid silver;
padding: 0.5rem;
border-radius: 5px;
font-size: 1rem;
}
input[type="text"]:focus,
input[type="number"]:focus,
textarea:focus,
.tag-input.active {
box-shadow: inset 0 0 0 1px #3c97ff;
border-color: #3c97ff;
outline: 0 none !important;
}
.Form label {
flex-shrink: 0;
width: 10rem;
height: 2.1rem;
line-height: 2.1rem;
vertical-align: middle;
text-align: right;
display: inline-block;
padding-right: .5rem;
align-self: flex-start;
}
.Form input[type="text"],
.Form input[type="number"],
.Form select {
height: 2.1rem;
width: 15rem;
}
.Form textarea {
flex-shrink: 1;
width: 30rem;
height: 6rem;
}
.Form label.checkbox-wrap {
width: 15rem;
padding-right: 1rem;
text-align: left !important;
}
.tag-input {
position: relative;
width: 30rem;
padding-bottom: 0rem !important;
}
.tag-input input,
.tag-input input:focus {
border: 0 transparent;
padding: 0;
margin: 0;
box-shadow: none;
outline: 0 none !important;
}
.cards-table {
border-collapse: collapse;
margin: 0 auto;
margin-top: 1rem;
}
.cards-table .actions {
font-size: 90%;
}
.cards-table td,
.cards-table th {
padding: .5rem;
}
.cards-table thead th {
border-bottom: 2px solid silver;
}
.cards-table tbody td {
border-bottom: 1px solid silver;
}
.cards-table tbody tr:last-child td {
border-bottom: 2px solid silver;
}
.cards-table td.tags {
padding: .25rem;
}
.cards-table .tag {
background: #E2E1DF;
font-size: 90%;
padding: 0.25rem .45rem;
border-radius: 3px;
display: inline-block;
}
.paginate {
margin: 1rem auto;
width: 300px;
text-align: center;
white-space: nowrap;
}
.paginate span,
.paginate a {
padding: .5rem 1rem;
border-radius: .5rem;
border: 1px solid silver;
text-decoration: none;
}
.paginate span.num {
border: 1px solid #ccc;
color: gray;
}
.paginate a {
cursor: pointer;
user-select: none;
}
.paginate a:hover {
background: #ccc;
text-decoration: none;
}
.paginate .disabled {
opacity: .5;
cursor: default;
}
.paginate .disabled:hover {
color: gray;
background: transparent;
}