rhnvrm
/
rohanverma.net
Tarkkaile 1
Äänestä 0
Fork 0
Koodi Ongelmat 0 Pull-pyynnöt 0 Julkaisut 0 Wiki Activity
Selaa lähdekoodia

feat: new website

pull/1/head
Rohan Verma 7 vuotta sitten
vanhempi
0085195c4e
commit
695f1143e8
20 muutettua tiedostoa jossa 15225 lisäystä ja 208 poistoa
Yhdistetty näkymä
Diff Options
Show Stats Download Patch File Download Diff File
  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. BIN
      public/background.jpg
  11. BIN
      public/favicon.ico
  12. +18
    -0
      public/index.html
  13. +28
    -0
      src/App.vue
  14. BIN
      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 Näytä tiedosto

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 Näytä tiedosto

# rohanverma.net # 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 Näytä tiedosto

module.exports = {
"presets": [
[
"@vue/app",
{
"useBuiltIns": "entry"
}
]
]
}

+ 0
- 17
bower.json Näytä tiedosto

{
"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 Näytä tiedosto

<!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 Näytä tiedosto

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 Näytä tiedosto

<!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
File diff suppressed because it is too large
Näytä tiedosto


+ 56
- 0
package.json Näytä tiedosto

{
"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"
]
}

BIN
public/background.jpg Näytä tiedosto

Before After
Width: 600  |  Height: 335  |  Size: 13KB

BIN
public/favicon.ico Näytä tiedosto

Before After

+ 18
- 0
public/index.html Näytä tiedosto

<!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 Näytä tiedosto

<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>


BIN
src/assets/logo.png Näytä tiedosto

Before After
Width: 120  |  Height: 120  |  Size: 6.7KB

+ 43
- 0
src/components/ContactCard.vue Näytä tiedosto

<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 Näytä tiedosto

<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 Näytä tiedosto

<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 Näytä tiedosto

<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 Näytä tiedosto

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 Näytä tiedosto

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'
})

Write Preview
Loading…
Peruuta
Tallenna