Compare commits
No commits in common. "e3d6d0c3793e12ea25ef22fcee0e5ddd8386bc3f" and "7e0f332f761d4e4c07150a54597086766ee65ffb" have entirely different histories.
e3d6d0c379
...
7e0f332f76
44
src/App.vue
44
src/App.vue
|
@ -22,52 +22,8 @@ export default {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
:root {
|
|
||||||
--text-color: #003049;
|
|
||||||
--secondary-text-color: #eae2b7;
|
|
||||||
--theme-color: #003049;
|
|
||||||
--background-color: #eae2b7;
|
|
||||||
--secondary-background: #d62828;
|
|
||||||
background-color: var(--background-color);
|
|
||||||
color: var(--text-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
* {
|
* {
|
||||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
|
||||||
Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
.shortcuthelp {
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
color: var(--background-color);
|
|
||||||
background-color: var(--theme-color);
|
|
||||||
padding: 0.5rem;
|
|
||||||
margin: 1rem 1rem 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 450px) {
|
|
||||||
.shortcuthelp {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
|
||||||
list-style-type: none;
|
|
||||||
color: var(--background-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
kbd {
|
|
||||||
background-color: var(--secondary-background);
|
|
||||||
color: var(--secondary-text-color);
|
|
||||||
display: inline-block;
|
|
||||||
padding: 0.1rem;
|
|
||||||
margin: 0.1rem 0.5rem;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -32,7 +32,7 @@ export default {
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
addNote() {
|
addNote() {
|
||||||
this.notes.push({ id: this.notes.length, text: this.content })
|
this.notes.push({ id: this.notes.length + 1, text: this.content })
|
||||||
this.content = ''
|
this.content = ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -86,38 +86,34 @@ export default {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
@media (min-width: 575px) {
|
|
||||||
.note {
|
|
||||||
width: 550px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
border-width: 0 0 0.1rem 0;
|
border-width: 0 0 1px 0;
|
||||||
border-color: var(--theme-color);
|
border-color: black;
|
||||||
resize: none;
|
resize: none;
|
||||||
background-color: var(--background-color);
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.note {
|
.note {
|
||||||
padding: 0.5rem;
|
border-width: 1px;
|
||||||
margin-bottom: 0.5rem;
|
padding: 5px;
|
||||||
border: 0.1rem solid transparent;
|
margin-bottom: 5px;
|
||||||
max-width: 550px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.selected {
|
.selected {
|
||||||
border: 0.1rem dashed var(--theme-color);
|
border-style: dashed;
|
||||||
|
border-width: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.noteid {
|
.noteid {
|
||||||
background-color: var(--theme-color);
|
background-color: slateblue;
|
||||||
color: var(--secondary-text-color);
|
color: white;
|
||||||
padding: 0 0.5rem;
|
border-radius: 5px;
|
||||||
display: inline-block;
|
margin-right: 5px;
|
||||||
width: 5rem;
|
margin-bottom: 2px;
|
||||||
margin-right: 0.5rem;
|
padding: 1px 15px;
|
||||||
|
font-size: 0.7rem;
|
||||||
|
display: block;
|
||||||
|
width: 15px;
|
||||||
|
font-family: monospace;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue