Web designing
This commit is contained in:
		
							
								
								
									
										11
									
								
								src/App.vue
									
									
									
									
									
								
							
							
						
						
									
										11
									
								
								src/App.vue
									
									
									
									
									
								
							| @@ -1,9 +1,6 @@ | |||||||
| <template> | <template> | ||||||
|   <div id="app"> |   <div id="app"> | ||||||
|     <div id="nav"> |     <navigation/> | ||||||
|       <router-link to="/">Home</router-link> | |  | ||||||
|       <router-link to="/about">About</router-link> |  | ||||||
|     </div> |  | ||||||
|     <router-view/> |     <router-view/> | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
| @@ -30,3 +27,9 @@ | |||||||
|   } |   } | ||||||
| } | } | ||||||
| </style> | </style> | ||||||
|  | <script> | ||||||
|  | import Navigation from '@/components/Navigation.vue' | ||||||
|  | export default { | ||||||
|  |   components: { Navigation } | ||||||
|  | } | ||||||
|  | </script> | ||||||
|   | |||||||
| @@ -1,58 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <div class="hello"> |  | ||||||
|     <h1>{{ msg }}</h1> |  | ||||||
|     <p> |  | ||||||
|       For a guide and recipes on how to configure / customize this project,<br> |  | ||||||
|       check out the |  | ||||||
|       <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>. |  | ||||||
|     </p> |  | ||||||
|     <h3>Installed CLI Plugins</h3> |  | ||||||
|     <ul> |  | ||||||
|       <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li> |  | ||||||
|       <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li> |  | ||||||
|     </ul> |  | ||||||
|     <h3>Essential Links</h3> |  | ||||||
|     <ul> |  | ||||||
|       <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li> |  | ||||||
|       <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li> |  | ||||||
|       <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li> |  | ||||||
|       <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li> |  | ||||||
|       <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li> |  | ||||||
|     </ul> |  | ||||||
|     <h3>Ecosystem</h3> |  | ||||||
|     <ul> |  | ||||||
|       <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li> |  | ||||||
|       <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li> |  | ||||||
|       <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li> |  | ||||||
|       <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li> |  | ||||||
|       <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li> |  | ||||||
|     </ul> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| export default { |  | ||||||
|   name: 'HelloWorld', |  | ||||||
|   props: { |  | ||||||
|     msg: String |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <!-- Add "scoped" attribute to limit CSS to this component only --> |  | ||||||
| <style scoped lang="scss"> |  | ||||||
| h3 { |  | ||||||
|   margin: 40px 0 0; |  | ||||||
| } |  | ||||||
| ul { |  | ||||||
|   list-style-type: none; |  | ||||||
|   padding: 0; |  | ||||||
| } |  | ||||||
| li { |  | ||||||
|   display: inline-block; |  | ||||||
|   margin: 0 10px; |  | ||||||
| } |  | ||||||
| a { |  | ||||||
|   color: #42b983; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
							
								
								
									
										27
									
								
								src/components/HomePageElement.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										27
									
								
								src/components/HomePageElement.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,27 @@ | |||||||
|  | <template> | ||||||
|  |   <div class="hello"> | ||||||
|  |     <h1>{{ msg }}</h1> | ||||||
|  |     <p>Witam na mojej stronie głównej. Wszystkich zainteresowanych oczywiście 😁</p> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  |  | ||||||
|  | <script> | ||||||
|  |  | ||||||
|  | </script> | ||||||
|  |  | ||||||
|  | <style scoped lang="scss"> | ||||||
|  | h3 { | ||||||
|  |   margin: 40px 0 0; | ||||||
|  | } | ||||||
|  | ul { | ||||||
|  |   list-style-type: none; | ||||||
|  |   padding: 0; | ||||||
|  | } | ||||||
|  | li { | ||||||
|  |   display: inline-block; | ||||||
|  |   margin: 0 10px; | ||||||
|  | } | ||||||
|  | a { | ||||||
|  |   color: #42b983; | ||||||
|  | } | ||||||
|  | </style> | ||||||
							
								
								
									
										6
									
								
								src/components/Navigation.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										6
									
								
								src/components/Navigation.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,6 @@ | |||||||
|  | <template> | ||||||
|  |   <div id="nav"> | ||||||
|  |     <router-link to="/">Strona główna</router-link> | | ||||||
|  |     <router-link to="/about">O mnie</router-link> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
| @@ -1,7 +1,9 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="about"> |   <div class="about"> | ||||||
|     <h1>O mnie</h1> |     <h1>O mnie</h1> | ||||||
|     <p>Witajcie!</p> |     <p>Nazywam się Kamil Niemczycki, jestem studentem kierunku Informatyka o specjalności Programowanie Aplikacji Mobilnych i Internetowych.</p> | ||||||
|     <p>Nazywam się Kamil Niemczycki, jestem studentem uczelni Państwowej Wyższej Szkoły Zawodowej im. Witelona w Legnicy.</p> |     <p>Swoją przygodę w internecie rozpocząłem od nagrywania poradników, które umieszczałem na moim starym kanale youtube Moje Poradniki (wcześniej Niemczycki12). Z czasem zacząłem odczuwać potrzebę wypowiedzenia się, co spowodowało, że utworzyłem drugi kanał NiKCamii (wcześniej KamilNiemczycki), który był miejscem gdzie dodawałem Vlogi.</p> | ||||||
|  |     <p>Aktualnie zajmuję się projektowaniem i programowaniem aplikacji web w postaci stron www, wykorzystując od strony backend'u język skryptowy PHP. Znam także język znaczników - HTML 5, jego kompana - CSS, jak i podstawy JavaScript(), które są wykorzystwyane w frontend'dzie.</p> | ||||||
|  |     <p>Backend, frontend ❤</p> | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
|   | |||||||
| @@ -1,13 +1,12 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="home"> |   <div class="home"> | ||||||
|     <img alt="Vue logo" src="../assets/logo.png"> |     <img alt="KamilCraft.com logo" src="https://kamilcraft.com/assets/img/logo.png"> | ||||||
|     <HelloWorld msg="Welcome to Your Vue.js App"/> |     <HelloWorld msg="Witam serdecznie 🤗"/> | ||||||
|   </div> |   </div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| // @ is an alias to /src | import HelloWorld from '@/components/HomePageElement.vue' | ||||||
| import HelloWorld from '@/components/HelloWorld.vue' |  | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: 'Home', |   name: 'Home', | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user