lesson 131: add the AddResource form
This commit is contained in:
parent
aca6d408e3
commit
92065daccc
|
@ -1,10 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<button :type="type" :class="mode"><slot></slot></button>
|
<button :class="mode"><slot></slot></button>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
props: ['type', 'mode']
|
props: ['mode']
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -1,9 +1,53 @@
|
||||||
<template>
|
<template>
|
||||||
<h2>Add Resource</h2>
|
<base-card>
|
||||||
|
<form>
|
||||||
|
<div class="form-control">
|
||||||
|
<label for="title">Title</label>
|
||||||
|
<input type="text" name="title" id="title" />
|
||||||
|
</div>
|
||||||
|
<div class="form-control">
|
||||||
|
<label for="description">Description</label>
|
||||||
|
<textarea name="description" id="description" rows="3"></textarea>
|
||||||
|
</div>
|
||||||
|
<div class="form-control">
|
||||||
|
<label for="link">Link</label>
|
||||||
|
<input type="text" name="link" id="link" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<base-button type="submit">Add Resource</base-button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</base-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {};
|
export default {};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style></style>
|
<style scoped>
|
||||||
|
label {
|
||||||
|
font-weight: bold;
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
input,
|
||||||
|
textarea {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
font: inherit;
|
||||||
|
padding: 0.15rem;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
input:focus,
|
||||||
|
textarea:focus {
|
||||||
|
outline: none;
|
||||||
|
border-color: #3a0061;
|
||||||
|
background-color: #f7ebff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-control {
|
||||||
|
margin: 1rem 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
Reference in New Issue