Dhaverd/ New-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Подверстал резюме пода разные экраны

This commit is contained in:
Dhaverd 2024-04-10 11:37:27 +08:00
parent 55221c066c
commit bc7509423d
5 changed files with 24 additions and 272 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

254
resources/css/app.css
View File

@ -1,254 +0,0 @@
@media (min-width: 600px){
.text-xs-button-1 {
font-size: 6rem !important;
font-weight: 300;
line-height: 6rem;
letter-spacing: -0.015625em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xs-button-2 {
font-size: 3.75rem !important;
font-weight: 300;
line-height: 3.75rem;
letter-spacing: -0.0083333333em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xs-button-3 {
font-size: 3rem !important;
font-weight: 400;
line-height: 3.125rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xs-button-4 {
font-size: 2.125rem !important;
font-weight: 400;
line-height: 2.5rem;
letter-spacing: 0.0073529412em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xs-button-5 {
font-size: 1.5rem !important;
font-weight: 400;
line-height: 2rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xs-button-6{
font-size: 1.25rem !important;
font-weight: 500;
line-height: 2rem;
letter-spacing: 0.0125em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
}
@media (min-width: 960px){
.text-sm-button-1 {
font-size: 6rem !important;
font-weight: 300;
line-height: 6rem;
letter-spacing: -0.015625em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-sm-button-2 {
font-size: 3.75rem !important;
font-weight: 300;
line-height: 3.75rem;
letter-spacing: -0.0083333333em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-sm-button-3 {
font-size: 3rem !important;
font-weight: 400;
line-height: 3.125rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-sm-button-4 {
font-size: 2.125rem !important;
font-weight: 400;
line-height: 2.5rem;
letter-spacing: 0.0073529412em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-sm-button-5 {
font-size: 1.5rem !important;
font-weight: 400;
line-height: 2rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-sm-button-6{
font-size: 1.25rem !important;
font-weight: 500;
line-height: 2rem;
letter-spacing: 0.0125em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
}
@media (min-width: 1280px){
.text-md-button-1 {
font-size: 6rem !important;
font-weight: 300;
line-height: 6rem;
letter-spacing: -0.015625em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-md-button-2 {
font-size: 3.75rem !important;
font-weight: 300;
line-height: 3.75rem;
letter-spacing: -0.0083333333em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-md-button-3 {
font-size: 3rem !important;
font-weight: 400;
line-height: 3.125rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-md-button-4 {
font-size: 2.125rem !important;
font-weight: 400;
line-height: 2.5rem;
letter-spacing: 0.0073529412em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-md-button-5 {
font-size: 1.5rem !important;
font-weight: 400;
line-height: 2rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-md-button-6{
font-size: 1.25rem !important;
font-weight: 500;
line-height: 2rem;
letter-spacing: 0.0125em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
}
@media (min-width: 1920px){
.text-lg-button-1 {
font-size: 6rem !important;
font-weight: 300;
line-height: 6rem;
letter-spacing: -0.015625em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-lg-button-2 {
font-size: 3.75rem !important;
font-weight: 300;
line-height: 3.75rem;
letter-spacing: -0.0083333333em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-lg-button-3 {
font-size: 3rem !important;
font-weight: 400;
line-height: 3.125rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-lg-button-4 {
font-size: 2.125rem !important;
font-weight: 400;
line-height: 2.5rem;
letter-spacing: 0.0073529412em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-lg-button-5 {
font-size: 1.5rem !important;
font-weight: 400;
line-height: 2rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-lg-button-6{
font-size: 1.25rem !important;
font-weight: 500;
line-height: 2rem;
letter-spacing: 0.0125em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
}
@media (min-width: 2560px){
.text-xl-button-1 {
font-size: 6rem !important;
font-weight: 300;
line-height: 6rem;
letter-spacing: -0.015625em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xl-button-2 {
font-size: 3.75rem !important;
font-weight: 300;
line-height: 3.75rem;
letter-spacing: -0.0083333333em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xl-button-3 {
font-size: 3rem !important;
font-weight: 400;
line-height: 3.125rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xl-button-4 {
font-size: 2.125rem !important;
font-weight: 400;
line-height: 2.5rem;
letter-spacing: 0.0073529412em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xl-button-5 {
font-size: 1.5rem !important;
font-weight: 400;
line-height: 2rem;
letter-spacing: normal !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
.text-xl-button-6{
font-size: 1.25rem !important;
font-weight: 500;
line-height: 2rem;
letter-spacing: 0.0125em !important;
font-family: "Roboto", sans-serif !important;
text-transform: none !important;
}
}

12
resources/views/resume/About/Education.vue
View File

@ -1,18 +1,18 @@
<template> <template>
<div> <div>
<p class="text-h5 pb-3">Образование</p> <p class="text-xl-h3 text-lg-h4 text-md-h4 text-sm-h5 text-h6 pb-3">Образование</p>
<v-table class="pb-5 main-sheet-bg"> <v-table class="pb-5 main-sheet-bg text-xl-h5 text-lg-h6 text-md-body-1 text-sm-body-1 text-body-2">
<tbody> <tbody>
<tr> <tr>
<td>2020</td> <td class="pb-2">2020</td>
<td> <td class="pb-2">
<p>Братский государственный университет, Братск</p> <p>Братский государственный университет, Братск</p>
<p>Факультет экономики и управления, Прикладная информатика в экономике (бакалавриат)</p> <p>Факультет экономики и управления, Прикладная информатика в экономике (бакалавриат)</p>
</td> </td>
</tr> </tr>
<tr> <tr>
<td>2024</td> <td class="pt-2 pb-2">2024</td>
<td> <td class="pt-2 pb-2">
<p>Братский государственный университет, Братск</p> <p>Братский государственный университет, Братск</p>
<p>Факультет энергетики и автоматики, Веб технологии и информационный анализ данных (магистратура)</p> <p>Факультет энергетики и автоматики, Веб технологии и информационный анализ данных (магистратура)</p>
</td> </td>

12
resources/views/resume/About/Experience.vue
View File

@ -1,15 +1,15 @@
<template> <template>
<div> <div>
<p class="text-h5 pb-3">Опыт работы</p> <p class="text-xl-h3 text-lg-h4 text-md-h4 text-sm-h5 text-h6 pb-3">Опыт работы</p>
<v-table class="pb-5 main-sheet-bg"> <v-table class="pb-5 main-sheet-bg text-xl-h5 text-lg-h6 text-md-body-1 text-sm-body-1 text-body-2">
<tbody> <tbody>
<tr> <tr>
<td>Февраль 2022 — август 2023</td> <td class="pb-2">Февраль 2022 — август 2023</td>
<td><p>Муниципальное казенное учреждение «Центр информационно-технического и транспортного обслуживания» муниципального образования города Братска</p></td> <td class="pb-2"><p>Муниципальное казенное учреждение «Центр информационно-технического и транспортного обслуживания» муниципального образования города Братска</p></td>
</tr> </tr>
<tr> <tr>
<td>Сентябрь 2023 — по настоящее время</td> <td class="pt-2 pb-2">Сентябрь 2023 — по настоящее время</td>
<td>Государственное Автономное Учреждение «Иркутский областной многофункциональный центр предоставления государственных и муниципальных услуг»</td> <td class="pt-2 pb-2">Государственное Автономное Учреждение «Иркутский областной многофункциональный центр предоставления государственных и муниципальных услуг»</td>
</tr> </tr>
</tbody> </tbody>
</v-table> </v-table>

4
resources/views/resume/About/Skills.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<p class="text-h5 pb-3">Профессиональные навыки</p> <p class="text-xl-h3 text-md-h4 text-sm-h5 text-h6 pb-3">Профессиональные навыки</p>
<p style="text-indent: 1em; text-align: justify" class="pb-5">Хорошо знаю Java, на прошлом месте работы в основном занимался разработкой консольных/десктопных приложений на данном языке <p style="text-indent: 1em; text-align: justify" class="pb-5 text-body-2 text-xl-h5 text-lg-h6 text-md-body-1 text-sm-body-1">Хорошо знаю Java, на прошлом месте работы в основном занимался разработкой консольных/десктопных приложений на данном языке
(муниципальный сектор). Планирую в ближайшее время изучить Spring Framework. В работе активно использую Git. Из СУБД плотно работаю с (муниципальный сектор). Планирую в ближайшее время изучить Spring Framework. В работе активно использую Git. Из СУБД плотно работаю с
MySQL, Postgresql. Иногда по работе приходилось писать или дорабатывать небольшие сайты на HTML+CSS+JS (и иногда PHP) и MySQL, Postgresql. Иногда по работе приходилось писать или дорабатывать небольшие сайты на HTML+CSS+JS (и иногда PHP) и
дорабатывать веб-приложение на ASP.NET (Жил. фонд). На текущем месте работы занимаюсь разработкой, доработкой и поддержкой сайтов и веб-приложений дорабатывать веб-приложение на ASP.NET (Жил. фонд). На текущем месте работы занимаюсь разработкой, доработкой и поддержкой сайтов и веб-приложений

14
resources/views/resume/PersonalInfo.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div class="d-flex justify-end align-center"> <div class="d-flex justify-end align-center">
<v-table class="main-sheet-bg pl-5" :class="[this.isWide ? 'w-25' : 'w-66']" style="text-align: left"> <v-table class="main-sheet-bg text-xl-h6 text-lg-body-1 text-md-body-1 text-sm-body-1 text-caption pl-5" :class="[this.isMore700 ? this.isWide ? 'w-25' : 'w-66' : 'w-100']" style="text-align: left">
<tbody> <tbody>
<tr> <tr>
<td><v-icon :icon="`mdi-account`"></v-icon>Возраст</td> <td><v-icon :icon="`mdi-account`"></v-icon>Возраст</td>
@ -20,7 +20,7 @@
</tr> </tr>
</tbody> </tbody>
</v-table> </v-table>
<div class="w-33"> <div v-if="this.isMore700" class="w-33">
<v-img class="image-gradient" src="./resume.png"></v-img> <v-img class="image-gradient" src="./resume.png"></v-img>
</div> </div>
</div> </div>
@ -38,7 +38,8 @@ export default {
}, },
windowHeight: document.documentElement.clientHeight, windowHeight: document.documentElement.clientHeight,
windowWidth: document.documentElement.clientWidth, windowWidth: document.documentElement.clientWidth,
isWide: window.innerWidth > 1000, isWide: window.innerWidth > 1750,
isMore700: window.innerWidth > 700,
tableClass: 'w-25' tableClass: 'w-25'
}), }),
created() { created() {
@ -52,13 +53,18 @@ export default {
myEventHandler(e) { myEventHandler(e) {
this.windowHeight = document.documentElement.clientHeight; this.windowHeight = document.documentElement.clientHeight;
this.windowWidth = document.documentElement.clientWidth; this.windowWidth = document.documentElement.clientWidth;
if (this.windowWidth < 1000){ if (this.windowWidth < 1750){
this.isWide = false; this.isWide = false;
this.tableClass = 'w-66'; this.tableClass = 'w-66';
} else { } else {
this.isWide = true; this.isWide = true;
this.tableClass = 'w-33'; this.tableClass = 'w-33';
} }
if (this.windowWidth < 700){
this.isMore700 = false;
} else {
this.isMore700 = true;
}
} }
} }
} }