Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
F
feather
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Kulya
feather
Commits
6ebc2a09
Commit
6ebc2a09
authored
8 years ago
by
Cole Bemis
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Create IconContainer component
parent
a85b7b63
Changes
4
Show whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
35 additions
and
78 deletions
+35
-78
index.html
index.html
+1
-25
App.vue
src/App.vue
+11
-4
IconContainer.vue
src/IconContainer.vue
+22
-0
main.js
src/main.js
+1
-49
No files found.
index.html
View file @
6ebc2a09
...
...
@@ -3,33 +3,9 @@
<head>
<meta
charset=
"UTF-8"
>
<title>
Feather
</title>
<style>
body
{
margin
:
0
;
}
</style>
</head>
<body>
<div
id=
"app"
>
<!-- <icon-container v-for="icon in icons" :name="icon"></icon-container> -->
</div>
<!-- <script type="text/x-template" id="icon-template">
<div class="icon"></div>
</script>
<script type="text/x-template" id="icon-container-template">
<div class="icon-container">
<a :href="`icons/${name}.svg`" download>
<icon :name="name" size="48"></icon>
</a>
</div>
</script> -->
<div
id=
"app"
></div>
<script
src=
"bundle.js"
></script>
</body>
</html>
\ No newline at end of file
This diff is collapsed.
Click to expand it.
src/App.vue
View file @
6ebc2a09
<
template
>
<div><icon
name=
"square"
size=
"48"
></icon></div>
<div>
<icon-container
v-for=
"icon in icons"
:name=
"icon"
></icon-container>
</div>
</
template
>
<
script
>
import
{
mapState
}
from
'
vuex
'
;
import
Icon
from
'
./Icon
'
;
import
Icon
Container
from
'
./IconContainer
'
;
export
default
{
name
:
'
App
'
,
components
:
{
Icon
},
components
:
{
Icon
Container
},
computed
:
mapState
([
'
icons
'
])
}
</
script
>
<
style
lang=
"stylus"
>
body
margin 0
</
style
>
\ No newline at end of file
This diff is collapsed.
Click to expand it.
src/IconContainer.vue
0 → 100644
View file @
6ebc2a09
<
template
>
<div
class=
"icon-container"
>
<a
:href=
"`icons/$
{name}.svg`" download>
<icon
:name=
"name"
size=
"48"
></icon>
</a>
</div>
</
template
>
<
script
>
import
Icon
from
'
./Icon
'
;
export
default
{
name
:
'
IconContainer
'
,
components
:
{
Icon
},
props
:
{
name
:
{
type
:
String
,
required
:
true
}
}
}
</
script
>
\ No newline at end of file
This diff is collapsed.
Click to expand it.
src/main.js
View file @
6ebc2a09
...
...
@@ -23,51 +23,3 @@ new Vue({
components
:
{
App
},
template
:
'
<app/>
'
});
\ No newline at end of file
// Vue.component('icon', {
// props: {
// name: {
// type: String,
// required: true
// },
// size: {
// type: String,
// default: '24'
// }
// },
// template: '#icon-template',
// mounted() {
// fetch(`./icons/${this.name}.svg`)
// .then(response => {
// if (response.ok) {
// return response.text();
// }
// throw new Error(`Cannot find ${this.name}.svg`);
// })
// .then(svgText => {
// const svgDocument = new DOMParser().parseFromString(svgText, 'image/svg+xml');
// const svgIcon = svgDocument.querySelector('svg').cloneNode(true);
// svgIcon.setAttribute('width', this.size);
// svgIcon.setAttribute('height', this.size);
// this.$el.appendChild(svgIcon);
// })
// .catch(error => {
// console.error(error);
// });
// }
// });
// Vue.component('icon-container', {
// props: {
// name: {
// type: String,
// required: true
// }
// },
// template: '#icon-container-template'
// })
This diff is collapsed.
Click to expand it.
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment