├── README.md ├── html_finalprojimages ├── readme.md ├── js.png ├── html5.png ├── phone.png ├── envelope.png ├── waving-hand.png └── checkmark--outline.svg ├── script.js ├── style.css └── index.html /README.md: -------------------------------------------------------------------------------- 1 | # my-portfolio -------------------------------------------------------------------------------- /html_finalprojimages/readme.md: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /html_finalprojimages/js.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SRIESWAR18/my-portfolio/HEAD/html_finalprojimages/js.png -------------------------------------------------------------------------------- /html_finalprojimages/html5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SRIESWAR18/my-portfolio/HEAD/html_finalprojimages/html5.png -------------------------------------------------------------------------------- /html_finalprojimages/phone.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SRIESWAR18/my-portfolio/HEAD/html_finalprojimages/phone.png -------------------------------------------------------------------------------- /html_finalprojimages/envelope.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SRIESWAR18/my-portfolio/HEAD/html_finalprojimages/envelope.png -------------------------------------------------------------------------------- /html_finalprojimages/waving-hand.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SRIESWAR18/my-portfolio/HEAD/html_finalprojimages/waving-hand.png -------------------------------------------------------------------------------- /script.js: -------------------------------------------------------------------------------- 1 | function addRecommendation() { 2 | // Get the message of the new recommendation 3 | let recommendation = document.getElementById("new_recommendation"); 4 | // If the user has left a recommendation, display a pop-up 5 | if (recommendation.value != null && recommendation.value.trim() != "") { 6 | console.log("New recommendation added"); 7 | //Call showPopup here 8 | showPopup(true); 9 | // Create a new 'recommendation' element and set it's value to the user's message 10 | var element = document.createElement("div"); 11 | element.setAttribute("class","recommendation"); 12 | element.innerHTML = "\“\" + recommendation.value + "\”\"; 13 | // Add this element to the end of the list of recommendations 14 | document.getElementById("all_recommendations").appendChild(element); 15 | 16 | // Reset the value of the textarea 17 | recommendation.value = ""; 18 | } 19 | } 20 | 21 | function showPopup(bool) { 22 | if (bool) { 23 | document.getElementById('popup').style.visibility = 'visible' 24 | } else { 25 | document.getElementById('popup').style.visibility = 'hidden' 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; 3 | } 4 | 5 | /* Navigation Bar */ 6 | 7 | #home { 8 | background-color: #7600bc; 9 | padding-bottom: 1cm; 10 | margin-left:-1cm; 11 | margin-right:-1cm; 12 | margin-top:-1cm; 13 | padding-top: 2cm; 14 | padding-bottom: 2cm; 15 | height: 5mm; 16 | } 17 | 18 | .topmenu { 19 | color: lightgray; 20 | margin: 10px; 21 | padding: 20px; 22 | font-size: 20px; 23 | text-decoration:none; 24 | } 25 | 26 | .topmenu:hover { 27 | color: white; 28 | font-weight: bolder; 29 | text-decoration: underline; 30 | /* Add the styles here */ 31 | } 32 | 33 | .topdiv { 34 | float: right; 35 | padding-right: 1cm; 36 | } 37 | 38 | .profile_name { 39 | float: left; 40 | padding-left: 2cm; 41 | color: antiquewhite; 42 | font-size: 30px; 43 | /* Add the styles here */ 44 | } 45 | 46 | .profile_name .contact_info { 47 | font-size: 15px; 48 | font-style: italic; 49 | display: flex; 50 | align-items: center; 51 | flex-direction: row; 52 | } 53 | 54 | .contact_info img { 55 | width:25px; 56 | margin-right: 10px; 57 | float:left; 58 | } 59 | 60 | /* Titles */ 61 | 62 | h2 { 63 | text-align: justify; 64 | font-size: 50px; 65 | text-align: center; 66 | float: left; 67 | color: #7600bc; 68 | margin: 30px; 69 | margin-left: 60px; 70 | margin-top: 40px; 71 | margin-bottom: 0px; 72 | } 73 | 74 | .introduction { 75 | text-align: justify; 76 | font-size: 30px; 77 | text-align: center; 78 | float: left; 79 | margin-top: 30px; 80 | margin-bottom: 20px; 81 | animation-duration: 5s; 82 | position: relative; 83 | } 84 | 85 | /* Used in the About Me sections */ 86 | 87 | .container { 88 | display: flex; 89 | } 90 | 91 | /* About Me */ 92 | 93 | .about-me { 94 | display: flex; 95 | align-items: center; 96 | } 97 | 98 | #about-me h1 { 99 | font-size: 65px; 100 | margin-top: 90px; 101 | color: #7600bc; 102 | } 103 | 104 | #about-me p { 105 | font-size: 25px; 106 | color: rgb(128, 128, 128); 107 | margin-top: -1cm; 108 | } 109 | 110 | .profile_image { 111 | width: 550px; 112 | height: fit-content; 113 | vertical-align: middle; 114 | margin: 10px; 115 | } 116 | 117 | /* Skills */ 118 | 119 | .all_skills { 120 | display: flex; 121 | flex-direction: row; 122 | flex-flow: wrap; 123 | } 124 | 125 | .skill { 126 | border: 1px solid gray; 127 | display: block; 128 | border-radius: 6px; 129 | text-align: center; 130 | margin: 50px; 131 | padding: 10px; 132 | width: 2in; 133 | font-size: 20px; 134 | box-shadow: 0 3px 10px gray; 135 | } 136 | 137 | .skill img { 138 | height: 35px; 139 | align-items: center; 140 | } 141 | 142 | .skills h6 { 143 | align-items: center; 144 | font-size: 20px; 145 | margin-block-start: 8px; 146 | margin-block-end: 5px; 147 | font-weight: bold; 148 | } 149 | 150 | .skills p { 151 | align-items: center; 152 | font-size: 15px; 153 | color: gray; 154 | margin-block-start: 5px; 155 | margin-block-end: 5px; 156 | } 157 | 158 | .flex_center { 159 | display: flex; 160 | align-items: center; 161 | justify-content: center; 162 | } 163 | 164 | /* Projects */ 165 | 166 | .projects-container { 167 | margin-top: 30px; 168 | margin-left: 60px; 169 | } 170 | 171 | .projects-container hr { 172 | border: 1px solid lightgray; 173 | width: 75%; 174 | margin-left: 5cm; 175 | } 176 | 177 | .project-card { 178 | margin: 0 15px 15px 30px; 179 | padding-bottom: 5px; 180 | } 181 | 182 | .project-card h3 { 183 | font-size: 25px; 184 | margin-left: 30px; 185 | } 186 | 187 | .project-card li { 188 | font-size: 20px; 189 | margin-left: 30px; 190 | } 191 | 192 | /* Recommendations */ 193 | 194 | .all_recommendations { 195 | display: flex; 196 | align-items: center; 197 | margin-left: 1in; 198 | flex-direction: row; 199 | flex-flow: wrap; 200 | padding: 20px; 201 | } 202 | 203 | .recommendation { 204 | font-style: italic; 205 | text-align: left; 206 | width: 21.875rem; 207 | padding: 1rem; 208 | background-color: #fff; 209 | border-radius: 11px; 210 | box-shadow: 0 3px 10px var(--primary-shadow); 211 | padding: 20px; 212 | margin: 10px; 213 | border:1px solid gray; 214 | font-size: 18px; 215 | height:150px 216 | } 217 | 218 | .recommendation span { 219 | color: #7600bc; 220 | font-size: 20px; 221 | font-family: 'Times New Roman', Times, serif; 222 | } 223 | 224 | /* Scroll to Top Button */ 225 | 226 | .iconbutton{ 227 | width: 48px; 228 | height: 48px; 229 | border-radius: 100%; 230 | background-color: #7600bc; 231 | display: flex; 232 | align-items: center; 233 | justify-content: center; 234 | position: fixed; 235 | right: 3%; 236 | bottom: 3%; 237 | cursor: pointer; 238 | } 239 | 240 | /* Form Pop-up */ 241 | 242 | .popup { 243 | width:400px; 244 | background-color: #e8bcf0; 245 | border-radius: 3mm; 246 | top: 50%; 247 | left:50%; 248 | transform: translate(-50%,-50%); 249 | text-align: center; 250 | position: fixed; 251 | /* padding: 30px; */ 252 | visibility: hidden; 253 | } 254 | 255 | .popup img { 256 | padding-top: 20px; 257 | size : 20px; 258 | } 259 | 260 | .popup button { 261 | background-color: #fff; 262 | border: 1px solid #7600bc; 263 | color: #7600bc; 264 | display: block; 265 | border-radius: 6px; 266 | text-align: center; 267 | margin: 50px; 268 | padding: 10px; 269 | width: 2in; 270 | font-size: 20px; 271 | margin-left: 25%; 272 | } 273 | 274 | .popup button:hover { 275 | background-color: #fff; 276 | border: 2px solid #7600bc; 277 | color: #7600bc; 278 | display: block; 279 | font-weight: bolder; 280 | text-align: center; 281 | cursor: pointer; 282 | margin-left: 25%; 283 | } 284 | 285 | /* Recommendation Form */ 286 | 287 | input, textarea { 288 | font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; 289 | margin: 10px; 290 | width:100%; 291 | } 292 | 293 | fieldset { 294 | display: flexbox; 295 | align-content: center; 296 | justify-content: center; 297 | padding: 25px; 298 | margin-left: 50px; 299 | margin-right: 50px; 300 | border: thin solid white; 301 | width: 50%; 302 | } 303 | 304 | /* Buttons */ 305 | 306 | button { 307 | background-color: #fff; 308 | border: 1px solid #7600bc; 309 | color: #7600bc; 310 | display: block; 311 | border-radius: 6px; 312 | text-align: center; 313 | margin: 50px; 314 | padding: 10px; 315 | width: 2in; 316 | font-size: 20px; 317 | } 318 | 319 | button:hover { 320 | background-color: #7600bc; 321 | border: 1px solid #7600bc; 322 | color: #fff; 323 | display: block; 324 | border-radius: 6px; 325 | text-align: center; 326 | cursor: pointer; 327 | } 328 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Srieswar - Portfolio 5 | 6 | 7 | 8 | 9 | 10 | 35 | 36 | 37 |
38 |
39 | 40 |
41 | 42 |
43 |

44 | Hi, I'm Srieswar! 45 |

46 |

47 | I’am Sri, Looking for a beginner role where I implement my knowledge and improve my career. I wish to work in a team of motivated individuals who wish to work towards the advancement of the company and its goals. 48 |

49 |
50 |
51 | 52 | 53 |
54 |

Skills

55 |
56 | 57 |
58 |
59 | 60 |
HTML
61 |

2 years experience

62 |
63 | 64 |
65 | 66 |
JavaScript
67 |

2 years experience

68 |
69 | 70 |
71 | 72 |
Java
73 |

1 year experience

74 |
75 |
76 | 77 |
React
78 |

6 months experience

79 |
80 |
81 | 82 |
Css
83 |

3 years experience

84 |
85 | 86 | 87 | 88 | 89 |
90 |
91 | 92 | 93 |
94 |

95 | Projects 96 |

97 |
98 | 99 |
100 |
101 |

Tourisphere

102 |
    103 |
  • Tourisphere is related to travelling management system.It is a web application which helps people to travel easily and it intract with the guide ,tourist and the administrator
  • 104 |
105 |
106 |
107 |
108 |

Speech To Text

109 |
    110 |
  • This project aims to develop a robust and accurate. speech-to-text system using advanced machine learning techniques.
  • 111 |
112 |
113 |
114 |
115 |

Automatic file organizer

116 |
    117 |
  • Automated file organizer helps to organize the directory of the file by giving their paths on the system.
  • 118 |
119 |
120 |
121 |
122 |
123 | 124 | 125 |
126 |

Recommendations

127 |
128 |
129 |
130 | 131 | Srieswar is a very quick learner and quickly grasps key concepts of Web development. 132 | he got a great attitude & he is an excellent team player. 133 | he has a curious mind and asks the right question. 134 | he takes initiative within a team and has potentials to lead the team. 135 | 136 |
137 |
138 | 139 | Working with Srieswar has been an awesome experience. 140 | he is highly knowledgable and always goes the extra step to make sure everything is right. 141 | For any future projects that need his expertise I would definitely want to work with his again. 142 | 143 |
144 |
145 | 146 | I had worked along with Srieswar during the initial phase of our venture which needed Web development. 147 | he is a committed resource who has in depth knowledge about the domain. 148 | he will be an asset for any organisation! 149 | 150 |
151 |
152 |
153 | 154 | 155 |
156 |
157 |
158 | Leave a Recommendation 159 |
160 | 161 |
162 | 163 |
164 |
165 |
166 |
167 | 168 |
169 | 170 | 171 | 172 | 173 | 174 | 175 |
176 | 177 | 182 | 183 | 184 | -------------------------------------------------------------------------------- /html_finalprojimages/checkmark--outline.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | --------------------------------------------------------------------------------