mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-23 14:15:13 +00:00
chore: add styled-vue example (#4712)
This commit is contained in:
parent
ecf76d91f1
commit
38e2ddf7fe
3
examples/styled-vue/README.md
Normal file
3
examples/styled-vue/README.md
Normal file
@ -0,0 +1,3 @@
|
||||
# styled-vue Example
|
||||
|
||||
See https://github.com/egoist/styled-vue
|
5
examples/styled-vue/nuxt.config.js
Normal file
5
examples/styled-vue/nuxt.config.js
Normal file
@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
modules: [
|
||||
'styled-vue/nuxt'
|
||||
]
|
||||
}
|
15
examples/styled-vue/package.json
Normal file
15
examples/styled-vue/package.json
Normal file
@ -0,0 +1,15 @@
|
||||
{
|
||||
"name": "example-styled-vue",
|
||||
"version": "1.0.0",
|
||||
"dependencies": {
|
||||
"nuxt-edge": "latest"
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "nuxt",
|
||||
"build": "nuxt build",
|
||||
"start": "nuxt start"
|
||||
},
|
||||
"devDependencies": {
|
||||
"styled-vue": "^0.1.3"
|
||||
}
|
||||
}
|
33
examples/styled-vue/pages/index.vue
Normal file
33
examples/styled-vue/pages/index.vue
Normal file
@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<div>
|
||||
<h1>styled-vue</h1>
|
||||
<a href="https://github.com/egoist/styled-vue" class="github">Check it out on GitHub.</a>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { css } from 'styled-vue'
|
||||
|
||||
export default {
|
||||
style: css`
|
||||
h1 {
|
||||
color: red;
|
||||
font-size: ${vm => vm.fontSize}px;
|
||||
}
|
||||
.github {
|
||||
color: blue;
|
||||
animation: blink 1s linear infinite;
|
||||
}
|
||||
@keyframes blink {
|
||||
50% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
`,
|
||||
data() {
|
||||
return {
|
||||
fontSize: 60
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
Loading…
Reference in New Issue
Block a user