vitaliy-sharandin commited on
Commit
5d45c77
Β·
1 Parent(s): 16b5286

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +134 -93
index.html CHANGED
@@ -5,118 +5,159 @@
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Vitaliy Sharandin Data Science Portfolio</title>
7
  <style>
8
- body {
9
- font-family: Arial, sans-serif;
10
- background-color: #0d1117; /* Dark background */
11
- color: #c9d1d9; /* Light text */
12
- margin: 0;
13
- padding: 0;
14
- }
15
- .container {
16
- display: flex;
17
- flex-direction: column;
18
- align-items: center;
19
- margin-top: 20px;
20
- }
21
- .project {
22
- border: 2px solid #30363d; /* Slightly lighter border for dark theme */
23
- border-radius: 10px;
24
- padding: 10px;
25
- margin: 10px;
26
- background-color: #161b22; /* Darker elements background */
27
- transition: background-color 0.3s ease;
28
- display: flex;
29
- align-items: center;
30
- width: 80%;
31
- box-shadow: 0 8px 24px rgba(0,0,0,0.5); /* Deeper shadow for contrast */
32
- }
33
- .project:hover {
34
- background-color: #21262d; /* Lighter background on hover */
35
- }
36
- .thumbnail {
37
- margin-right: 15px;
38
- border-radius: 5px;
39
- width: 150px; /* Adjust as needed */
40
- }
41
- .project-info {
42
- display: flex;
43
- flex-direction: column;
44
- }
45
- .project-title {
46
- font-size: 1.2em;
47
- margin: 0;
48
- color: #58a6ff; /* Bright color for titles */
49
- }
50
- .project-link {
51
- text-decoration: none;
52
- color: #58a6ff; /* Match the title color */
53
- margin-top: 5px;
54
- }
55
- .project-link:hover {
56
- text-decoration: underline;
57
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
58
  </style>
59
  </head>
60
  <body>
61
  <div class="container">
62
  <h1>πŸš€ Vitaliy Sharandin Data Science Portfolio</h1>
63
 
64
- <!-- Project 1 -->
65
- <div class="project">
66
- <img class="thumbnail" src="thumbnail/video_translation.jpg" alt="Video Translation Thumbnail">
67
- <div class="project-info">
68
- <h2 class="project-title">Video Translation with Speech Diarization and Voice Cloning</h2>
69
- <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/nlp/language-translation/video-translation-with-speech-diarization-and-voice-cloning.ipynb" target="_blank">Open in Colab</a>
70
- <a class="project-link" href="https://huggingface.co/spaces/vitaliy-sharandin/Video_translation_with_speaker_diarization_and_voice_cloning" target="_blank">View in Spaces</a>
71
- </div>
72
- </div>
73
 
74
- <!-- Project 2 -->
75
- <div class="project">
76
- <img class="thumbnail" src="thumbnail/wiseai.jpg" alt="WiseAI Thumbnail">
77
- <div class="project-info">
78
- <h2 class="project-title">WiseAI</h2>
79
- <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/nlp/fine-tuned-llm/wiseai.ipynb" target="_blank">Open in Colab</a>
80
- <a class="project-link" href="https://huggingface.co/spaces/vitaliy-sharandin/WiseAI" target="_blank">View in Spaces</a>
 
 
 
 
 
81
  </div>
82
- </div>
83
-
84
- <!-- Project 3 -->
85
- <div class="project">
86
- <img class="thumbnail" src="thumbnail/energy_demand.jpg" alt="Energy Demand Thumbnail">
87
- <div class="project-info">
88
- <h2 class="project-title">Energy Demand Based on Weather</h2>
89
- <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/regression/Energy_demand_based_on_weather.ipynb" target="_blank">Open in Colab</a>
 
90
  </div>
 
91
  </div>
92
 
93
- <!-- Project 4 -->
94
- <div class="project">
95
- <img class="thumbnail" src="thumbnail/ai_risks.jpg" alt="AI Risks Analysis Thumbnail">
96
- <div class="project-info">
97
- <h2 class="project-title">AI Risks Analysis (EDA)</h2>
98
- <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/eda/AI_risks_EDA.ipynb" target="_blank">Open in Colab</a>
 
 
 
 
 
99
  </div>
100
  </div>
101
 
102
- <!-- Project 5 -->
103
- <div class="project">
104
- <img class="thumbnail" src="thumbnail/pollution_temp_krakow.jpg" alt="Global Pollution Thumbnail">
105
- <div class="project-info">
106
- <h2 class="project-title">Global Pollution and Temperature Phenomena Influence on Krakow</h2>
107
- <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/eda/Global_pollution_and_temperature_phenomena_influence_on_Krakow.ipynb" target="_blank">Open in Colab</a>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
108
  </div>
109
  </div>
110
 
111
- <!-- Project 6 -->
112
- <div class="project">
113
- <img class="thumbnail" src="thumbnail/fraud_detection.jpg" alt="Fraud Detection Thumbnail">
114
- <div class="project-info">
115
- <h2 class="project-title">Fraud Detection</h2>
116
- <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/classification/Fraud_detection.ipynb" target="_blank">Open in Colab</a>
 
 
 
 
 
 
117
  </div>
118
  </div>
119
-
120
  </div>
121
  </body>
122
  </html>
 
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Vitaliy Sharandin Data Science Portfolio</title>
7
  <style>
8
+ body {
9
+ font-family: Arial, sans-serif;
10
+ background-color: #0d1117; /* Dark background */
11
+ color: #c9d1d9; /* Light text */
12
+ margin: 0;
13
+ padding: 0;
14
+ }
15
+ .container {
16
+ max-width: 1200px; /* Adjust the max width as needed */
17
+ margin: 20px auto;
18
+ padding: 0 10px;
19
+ }
20
+ .section {
21
+ margin-bottom: 30px;
22
+ }
23
+ .section-title {
24
+ color: #ffffff;
25
+ margin: 10px 0;
26
+ }
27
+ .project-row {
28
+ display: flex;
29
+ flex-wrap: wrap;
30
+ justify-content: space-between; /* This will ensure the two projects per row are spaced out */
31
+ }
32
+ .project {
33
+ border: 2px solid #30363d;
34
+ border-radius: 10px;
35
+ padding: 10px;
36
+ margin: 10px 0;
37
+ background-color: #161b22;
38
+ transition: background-color 0.3s ease;
39
+ flex-basis: calc(50% - 20px); /* Two projects per row, minus margin */
40
+ box-shadow: 0 8px 24px rgba(0,0,0,0.5);
41
+ }
42
+ .project:hover {
43
+ background-color: #21262d;
44
+ }
45
+ .thumbnail {
46
+ width: 100%;
47
+ border-radius: 5px;
48
+ }
49
+ .project-info {
50
+ padding: 10px;
51
+ position: relative;
52
+ }
53
+ .project-title {
54
+ font-size: 1.2em;
55
+ color: #ffffff; /* White color for titles */
56
+ position: absolute; /* Position the title in the top left */
57
+ top: 10px;
58
+ left: 10px;
59
+ margin: 0;
60
+ }
61
+ .project-link {
62
+ display: block;
63
+ text-decoration: none;
64
+ color: #58a6ff;
65
+ margin: 10px auto;
66
+ text-align: center;
67
+ padding: 8px 20px; /* Narrower buttons */
68
+ background-color: #21262d;
69
+ border-radius: 20px;
70
+ width: auto;
71
+ box-sizing: border-box;
72
+ }
73
+ .project-link:hover {
74
+ text-decoration: underline;
75
+ }
76
  </style>
77
  </head>
78
  <body>
79
  <div class="container">
80
  <h1>πŸš€ Vitaliy Sharandin Data Science Portfolio</h1>
81
 
 
 
 
 
 
 
 
 
 
82
 
83
+ <!-- NLP Section -->
84
+ <div class="section">
85
+ <h2 class="section-title">NLP</h2>
86
+ <div class="project-row">
87
+ <!-- Project 1 -->
88
+ <div class="project">
89
+ <img class="thumbnail" src="thumbnail/video_translation.jpg" alt="Video Translation Thumbnail">
90
+ <div class="project-info">
91
+ <h2 class="project-title">Video Translation with Speech Diarization and Voice Cloning</h2>
92
+ <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/nlp/language-translation/video-translation-with-speech-diarization-and-voice-cloning.ipynb" target="_blank">Open in Colab</a>
93
+ <a class="project-link" href="https://huggingface.co/spaces/vitaliy-sharandin/Video_translation_with_speaker_diarization_and_voice_cloning" target="_blank">View in Spaces</a>
94
+ </div>
95
  </div>
96
+
97
+ <!-- Project 2 -->
98
+ <div class="project">
99
+ <img class="thumbnail" src="thumbnail/wiseai.jpg" alt="WiseAI Thumbnail">
100
+ <div class="project-info">
101
+ <h2 class="project-title">WiseAI</h2>
102
+ <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/nlp/fine-tuned-llm/wiseai.ipynb" target="_blank">Open in Colab</a>
103
+ <a class="project-link" href="https://huggingface.co/spaces/vitaliy-sharandin/WiseAI" target="_blank">View in Spaces</a>
104
+ </div>
105
  </div>
106
+ </div>
107
  </div>
108
 
109
+ <div class="section">
110
+ <h2 class="section-title">Regression</h2>
111
+ <div class="project-row">
112
+ <!-- Project 3 -->
113
+ <div class="project">
114
+ <img class="thumbnail" src="thumbnail/energy_demand.jpg" alt="Energy Demand Thumbnail">
115
+ <div class="project-info">
116
+ <h2 class="project-title">Energy Demand Based on Weather</h2>
117
+ <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/regression/Energy_demand_based_on_weather.ipynb" target="_blank">Open in Colab</a>
118
+ </div>
119
+ </div>
120
  </div>
121
  </div>
122
 
123
+ <!-- EDA Section -->
124
+ <div class="section">
125
+ <h2 class="section-title">EDA</h2>
126
+ <div class="project-row">
127
+ <!-- Project 4 -->
128
+ <div class="project">
129
+ <img class="thumbnail" src="thumbnail/ai_risks.jpg" alt="AI Risks Analysis Thumbnail">
130
+ <div class="project-info">
131
+ <h2 class="project-title">AI Risks Analysis (EDA)</h2>
132
+ <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/eda/AI_risks_EDA.ipynb" target="_blank">Open in Colab</a>
133
+ </div>
134
+ </div>
135
+
136
+ <!-- Project 5 -->
137
+ <div class="project">
138
+ <img class="thumbnail" src="thumbnail/pollution_temp_krakow.jpg" alt="Global Pollution Thumbnail">
139
+ <div class="project-info">
140
+ <h2 class="project-title">Global Pollution and Temperature Phenomena Influence on Krakow</h2>
141
+ <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/eda/Global_pollution_and_temperature_phenomena_influence_on_Krakow.ipynb" target="_blank">Open in Colab</a>
142
+ </div>
143
+ </div>
144
  </div>
145
  </div>
146
 
147
+ <!-- Classification Section -->
148
+ <div class="section">
149
+ <h2 class="section-title">Classification</h2>
150
+ <div class="project-row">
151
+ <!-- Project 6 -->
152
+ <div class="project">
153
+ <img class="thumbnail" src="thumbnail/fraud_detection.jpg" alt="Fraud Detection Thumbnail">
154
+ <div class="project-info">
155
+ <h2 class="project-title">Fraud Detection</h2>
156
+ <a class="project-link" href="https://colab.research.google.com/github/vitaliy-sharandin/data_science_projects/blob/master/portfolio/classification/Fraud_detection.ipynb" target="_blank">Open in Colab</a>
157
+ </div>
158
+ </div>
159
  </div>
160
  </div>
 
161
  </div>
162
  </body>
163
  </html>