rhnvrm
/
rohanverma.net
关注 1
点赞 0
派生 0
代码 工单 0 合并请求 0 版本发布 0 百科 动态
浏览代码

feat: new website

pull/1/head
Rohan Verma 7 年前
父节点
0085195c4e
当前提交
695f1143e8
共有 20 个文件被更改，包括 15225 次插入 和 208 次删除
分列视图
Diff 选项
显示统计 下载 Patch 文件 下载 Diff 文件
  1. +21
    -1
      .gitignore
  2. +21
    -1
      README.md
  3. +10
    -0
      babel.config.js
  4. +0
    -17
      bower.json
  5. +0
    -15
      calendar.html
  6. +0
    -55
      css/style.css
  7. +0
    -119
      index.html
  8. +14824
    -0
      package-lock.json
  9. +56
    -0
      package.json
  10. 二进制
      public/background.jpg
  11. 二进制
      public/favicon.ico
  12. +18
    -0
      public/index.html
  13. +28
    -0
      src/App.vue
  14. 二进制
      src/assets/logo.png
  15. +43
    -0
      src/components/ContactCard.vue
  16. +44
    -0
      src/components/MainPage.vue
  17. +81
    -0
      src/components/ProfileList.vue
  18. +55
    -0
      src/components/ProjectList.vue
  19. +12
    -0
      src/main.js
  20. +12
    -0
      src/plugins/vuetify.js

+ 21
- 1
.gitignore 查看文件

@@ -1 +1,21 @@
bower_components/
.DS_Store
node_modules
/dist

# local env files
.env.local
.env.*.local

# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw*

+ 21
- 1
README.md 查看文件

@@ -1,2 +1,22 @@
# rohanverma.net
My little personal website. http://rohanverma.net
My little personal homepage.

## Project setup
```
npm install
```

### Compiles and hot-reloads for development
```
npm run serve
```

### Compiles and minifies for production
```
npm run build
```

### Lints and fixes files
```
npm run lint
```

+ 10
- 0
babel.config.js 查看文件

@@ -0,0 +1,10 @@
module.exports = {
"presets": [
[
"@vue/app",
{
"useBuiltIns": "entry"
}
]
]
}

+ 0
- 17
bower.json 查看文件

@@ -1,17 +0,0 @@
{
"name": "rohanverma.net",
"homepage": "https://github.com/rhnvrm/rohanverma.net",
"authors": [
"Rohan Verma <[email protected]>"
],
"description": "My Website",
"main": "index.html",
"license": "MIT",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
]
}

+ 0
- 15
calendar.html 查看文件

@@ -1,15 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Calendar</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- <link rel="stylesheet" type="text/css" media="screen" href="main.css" /> -->
<!-- <script src="main.js"></script> -->
</head>
<body>
<iframe src="https://calendar.google.com/calendar/embed?mode=WEEK&amp;height=600&amp;wkst=1&amp;bgcolor=%23FFFFFF&amp;src=vfh8pplofpo84neu6futc500kc%40group.calendar.google.com&amp;color=%23B1440E&amp;ctz=Asia%2FCalcutta"
style="border-width:0" width="800" height="600" frameborder="0" scrolling="no"></iframe>
</body>
</html>

+ 0
- 55
css/style.css 查看文件

@@ -1,55 +0,0 @@
body{
background: linear-gradient(270deg, #00b7af, #3c67bd, #5d88df);
background-size: 600% 600%;

-webkit-animation: Gradient 15s ease infinite;
-moz-animation: Gradient 15s ease infinite;
animation: Gradient 15s ease infinite;

}

@-webkit-keyframes Gradient {
0% {
background-position: 0% 50%
}
50% {
background-position: 100% 50%
}
100% {
background-position: 0% 50%
}
}

@-moz-keyframes Gradient {
0% {
background-position: 0% 50%
}
50% {
background-position: 100% 50%
}
100% {
background-position: 0% 50%
}
}

@keyframes Gradient {
0% {
background-position: 0% 50%
}
50% {
background-position: 100% 50%
}
100% {
background-position: 0% 50%
}
}

.pmd-card-my{
width: 360px;
margin: 0 auto;
margin-top: 25px;
}

.btn-white{
background-color:lightslategrey;
}

+ 0
- 119
index.html 查看文件

@@ -1,119 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Rohan Verma</title>
<!-- Bootstrap css-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<!--Google Icon Font-->
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- Propeller css -->
<link href="bower_components/propeller/dist/css/propeller.min.css" rel="stylesheet">
<!-- Fontawesome css -->
<link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
<link href="css/style.css" rel="stylesheet">
</head>

<body>
<div class="menu pmd-floating-action" role="navigation">
<button class="btn pmd-btn-fab pmd-ripple-effect btn-success btn-white" type="button"
onclick="location.href='mailto:[email protected]?Subject=Hello%20Rohan!'">
<i class="material-icons pmd-sm">chat</i>
</button>
</div>
<div class="pmd-card-my">
<!-- Default card starts -->
<div class="pmd-card pmd-card-default pmd-z-depth-2">
<!-- Card header -->
<div class="pmd-card-title">
<div class="center-block" style="width: 128px;">
<img src="https://avatars2.githubusercontent.com/u/952036?s=512" class="img-circle pmd-z-depth-3" width="128" height="128">
</div>
</div>
<!-- Card body -->
<div class="pmd-card-title">
<h2 class="pmd-card-title-text text-center">Rohan Verma</h2>
<h3 class="pmd-card-subtitle-text text-center">Computer Science and Engineering Undergrad (Graduating 2018)</h3>
</div>
</div>
<!--Default card ends -->
</div>
<div class="pmd-card-my">
<div class="pmd-card pmd-card-default pmd-z-depth-2 pmd-card-custom-form">
<div class="pmd-card-title">
<h2 class="pmd-card-title-text">Profiles</h2>
<!-- <span class="pmd-card-subtitle-text">Secondary text</span> -->
</div>
<div class="pmd-card pmd-card-default pmd-z-depth-0">
<button class="btn pmd-btn-flat btn-primary btn-block pmd-ripple-effect" type="button" onclick="window.open('http://linkedin.com/in/rhnvrm')">Linkedin</button>
<button class="btn pmd-btn-flat btn-primary btn-block pmd-ripple-effect" type="button" onclick="window.open('http://github.com/rhnvrm/')">Github</button>
<button class="btn pmd-btn-flat btn-primary btn-block pmd-ripple-effect" type="button" onclick="window.open('http://twitter.com/rhnvrm/')">Twitter</button>
<button class="btn pmd-btn-flat btn-primary btn-block pmd-ripple-effect" type="button" onclick="window.open('http://rohanverma.net/blog/')">Blog</button>
<button class="btn pmd-btn-flat btn-primary btn-block pmd-ripple-effect" type="button" onclick="window.open('http://rohanverma.net/blog/category/project/')">Projects</button>
</div>
</div>
</div>
<!-- Card header -->
<div class="pmd-card-my">
<div class="pmd-card pmd-card-default pmd-z-depth-2 pmd-card-custom-form">
<div class="pmd-card-title">
<h2 class="pmd-card-title-text">My Projects</h2>
<!-- <span class="pmd-card-subtitle-text">Secondary text</span> -->
</div>
<div class="pmd-card pmd-card-default pmd-z-depth-0">
<ul class="list-group pmd-list pmd-card-list pmd-list-icon" id="project-list">
<li class="list-group-item pmd-ripple-effect btn-default" onclick="window.open('http://rohanverma.net/blog/wp-json/wp/v2/posts?categories=21')">
<span class="pmd-card-subtitle-text">Loading</span><br>
<div class="pmd-card-body">
Hold on! I'm fetching my projects...
</div>
</li>
</ul>
</div>
</div>
</div>
<!-- jQuery before Propeller.js -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script type="text/javascript" src="bower_components/propeller/dist/js/propeller.min.js"></script>
<!-- Fetch posts from blog and display here -->
<script>
$.get("http://rohanverma.net/blog/wp-json/wp/v2/posts?categories=21", function (data) {
$("#project-list").html("")
data.forEach(element => {
var title = element.title.rendered;
var link = element.link;
var template = `
<li class="list-group-item pmd-ripple-effect btn-default" onclick="window.open('${link}')">
<span class="pmd-card-subtitle-text">${title}</span><br>
</li>
`;
console.log(element.title.rendered)
$("#project-list").append(template);
});
});
</script>
</body>
</html>

+ 14824
- 0
package-lock.json
文件差异内容过多而无法显示
查看文件


+ 56
- 0
package.json 查看文件

@@ -0,0 +1,56 @@
{
"name": "rohanverma.net",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.0",
"@fortawesome/free-brands-svg-icons": "^5.1.1",
"@fortawesome/free-solid-svg-icons": "^5.1.0",
"@fortawesome/vue-fontawesome": "^0.1.1",
"axios": "^0.18.0",
"i": "^0.3.6",
"npm": "^6.2.0",
"vue": "^2.5.16",
"vue-axios": "^2.1.2",
"vuetify": "^1.1.4"
},
"devDependencies": {
"@babel/polyfill": "^7.0.0-beta.49",
"@fortawesome/fontawesome-free": "^5.1.1",
"@vue/cli-plugin-babel": "^3.0.0-rc.5",
"@vue/cli-plugin-eslint": "^3.0.0-rc.5",
"@vue/cli-service": "^3.0.0-rc.5",
"font-awesome": "^4.7.0",
"vue-cli-plugin-vuetify": "^0.1.6",
"vue-template-compiler": "^2.5.16"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {},
"parserOptions": {
"parser": "babel-eslint"
}
},
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}

二进制
public/background.jpg 查看文件

之前 之后
宽度: 600  |  高度: 335  |  大小: 13KB

二进制
public/favicon.ico 查看文件

之前 之后

+ 18
- 0
public/index.html 查看文件

@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link href="https://fonts.googleapis.com/css?family=Roboto:100:300,400,500,700,900|Material+Icons" rel="stylesheet">
<title>rohanverma.net</title>
</head>
<body>
<noscript>
<strong>We're sorry but rohanverma.net doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

+ 28
- 0
src/App.vue 查看文件

@@ -0,0 +1,28 @@
<template>
<v-app v-bind:style="bgc">
<v-content>
<MainPage/>
</v-content>
</v-app>
</template>

<script>
import MainPage from './components/MainPage'

export default {
name: 'App',
components: {
MainPage
},
data () {
return {
title: 'Rohan Verma',
bgc: {
backgroundColor: '#80DEEA'
}
}
}
}

</script>


二进制
src/assets/logo.png 查看文件

之前 之后
宽度: 120  |  高度: 120  |  大小: 6.7KB

+ 43
- 0
src/components/ContactCard.vue 查看文件

@@ -0,0 +1,43 @@
<template>
<v-flex xs12 sm6 md6 lg6>
<v-card width="384px" >
<v-parallax
class="white--text"
src="background.jpg"
height="164px"
>
<v-container fill-height fluid>
<v-layout fill-height>
<v-flex xs12 align-end flexbox>
<span class="headline" style="text-shadow: 1px 1px 10px #000;">Rohan Verma</span>
<br/>
<span style="text-shadow: 1px 1px 10px #000;">Software Developer</span>
<br/>
<span style="text-shadow: 1px 1px 10px #000;">@rhnvrm</span>
</v-flex>
</v-layout>
<v-layout column align-center >
<v-avatar
:tile= false
:size= 128
>
<img src="//avatars2.githubusercontent.com/u/952036?s=512" alt="Profile">
</v-avatar>
</v-layout>
</v-container>
</v-parallax>

<v-card-title primary-title >
Hello, I'm a hobby programmer currently located in Bengaluru, India. I chronicle my
(not so important) journey on these webpages.
</v-card-title>

<v-card-actions>
<v-btn flat color="blue">Get In Touch</v-btn>
<v-btn flat color="blue">Share</v-btn>
</v-card-actions>
</v-card>
</v-flex>
</template>

+ 44
- 0
src/components/MainPage.vue 查看文件

@@ -0,0 +1,44 @@
<template>
<v-container fluid>
<v-layout column align-center>
<contact-card>

</contact-card>
</v-layout>
<v-layout column align-center mt-3>
<profile-list>

</profile-list>
</v-layout>
<v-layout column align-center mt-3>
<project-list>

</project-list>
</v-layout>
</v-container>
</template>

<script>
import ContactCard from './ContactCard'
import ProfileList from './ProfileList'
import ProjectList from './ProjectList'

export default {
name: 'MainPage',
props: {
msg: String
},
components:{
ContactCard,
ProfileList,
ProjectList
},
data(){
return {
}
}
}
</script>


+ 81
- 0
src/components/ProfileList.vue 查看文件

@@ -0,0 +1,81 @@
<template>
<v-flex xs12 sm6 md6 lg6>

<v-card width="384px" >
<v-parallax
class="white--text"
src="background.jpg"
height="32px"
>
<v-container fill-height fluid>
<v-layout fill-height>
<v-flex xs12 align-end flexbox>
<span class="headline" style="text-shadow: 1px 1px 10px #000;">My Profiles</span>
</v-flex>
</v-layout>

</v-container>
</v-parallax>
<v-list>
<v-list-tile @click="redirect_href('linkedin')">
<v-list-tile-content>
<v-list-tile-title>Linkedin</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-icon>fab fa-linkedin</v-icon>
</v-list-tile-action>
</v-list-tile>
<v-list-tile @click="redirect_href('github')">
<v-list-tile-content>
<v-list-tile-title>Github</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-icon>fab fa-github-square</v-icon>
</v-list-tile-action>
</v-list-tile>
<v-list-tile @click="redirect_href('github')">
<v-list-tile-content>
<v-list-tile-title>Twitter</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-icon>fab fa-twitter</v-icon>
</v-list-tile-action>
</v-list-tile>
<v-list-tile @click="redirect_href('blog')">
<v-list-tile-content>
<v-list-tile-title>Blog</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-icon>fab fa-wordpress</v-icon>
</v-list-tile-action>
</v-list-tile>
</v-list>
</v-card>
</v-flex>
</template>

<script>
export default {
methods: {
redirect_href (profile) {
switch (profile) {
case "linkedin":
window.location.href = "http://www.linkedin.com/in/rhnvrm/"
break;
case "twitter":
window.location.href = "http://twitter.com/rhnvrm"
break;
case "github":
window.location.href = "http://github.com/rhnvrm"
break;
case "blog":
window.location.href = "http://rohanverma.net/blog"
break;
default:
break;
}
}
}
}
</script>

+ 55
- 0
src/components/ProjectList.vue 查看文件

@@ -0,0 +1,55 @@
<template>
<v-flex xs12 sm6 md6 lg6>

<v-card width="384px" >
<v-parallax
class="white--text"
src="background.jpg"
height="32px"
>
<v-container fill-height fluid>
<v-layout fill-height>
<v-flex xs12 align-end flexbox>
<span class="headline" style="text-shadow: 1px 1px 10px #000;">My Projects</span>
</v-flex>
</v-layout>

</v-container>
</v-parallax>
<v-list v-for="project in projects" v-bind:key="project.id">
<v-list-tile @click ='redirect_url(project.link)'>
<v-list-tile-content>
<v-list-tile-title v-html="project.title.rendered"></v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-icon>fas fa-arrow-circle-right</v-icon>
</v-list-tile-action>
</v-list-tile>
</v-list>
</v-card>
</v-flex>
</template>

<script>
export default {

data () {
return {
projects: []
}
},
mounted: function() {
this.getProjects().then(res => {
this.projects = res.data;
});
},
methods: {
getProjects: function(){
return this.$http.get("http://rohanverma.net/blog/wp-json/wp/v2/posts?categories=21")
},
redirect_url: function(url){
window.location.href = url
}
}
}
</script>

+ 12
- 0
src/main.js 查看文件

@@ -0,0 +1,12 @@
import '@babel/polyfill'
import Vue from 'vue'
import './plugins/vuetify'
import App from './App.vue'


Vue.config.productionTip = false


new Vue({
render: h => h(App)
}).$mount('#app')

+ 12
- 0
src/plugins/vuetify.js 查看文件

@@ -0,0 +1,12 @@
import Vue from 'vue'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'
import '@fortawesome/fontawesome-free/css/all.css'
import axios from 'axios'
import VueAxios from 'vue-axios'
Vue.use(VueAxios, axios)
Vue.use(Vuetify, {
iconfont: 'fa'
})

撰写 预览
正在加载...
取消
保存