1

mobile support

This commit is contained in:
Evan Pratten 2021-03-10 15:23:23 -05:00
parent deabfa9496
commit a0950c8138
2 changed files with 40 additions and 30 deletions

View File

@ -43,13 +43,13 @@
#align-wrapper { #align-wrapper {
position: absolute; position: absolute;
top: 35vh; top: 35vh;
margin-left: 10vw;
@media (min-width: 843px) {
margin-left: 5vw;
}
@media (min-width: 1105px) {
margin-left: 10vw; margin-left: 10vw;
} @media (min-width: 843px) {
margin-left: 5vw;
}
@media (min-width: 1105px) {
margin-left: 10vw;
}
z-index: 2; z-index: 2;
h1 { h1 {
@ -62,32 +62,42 @@
} }
} }
#software-experience { #software-experience {
background-color: var(--color-dark-purple); background-color: var(--color-dark-purple);
min-height: 100vh; min-height: 100vh;
.content{ .content {
color: white; color: white;
padding-top:30vh; padding-top: 30vh;
h1{ h1 {
text-transform: uppercase; text-transform: uppercase;
} }
.work-experience-item{ .work-experience-list {
background-color: unset; @media (max-width: 993px) {
border-color: white; padding-top: 10px;
padding:10px; -ms-flex: none !important;
transition: color 0.4s cubic-bezier(0, 0, 0.58, 1), border 0.4s cubic-bezier(0, 0, 0.58, 1); flex: none !important;
max-width: none !important;
width: 100%;
}
}
&:hover { .work-experience-item {
cursor: pointer; background-color: unset;
border-color:var(--color-red); border-color: white;
color:var(--color-red); padding: 10px;
transition: color 0.1s cubic-bezier(0, 0, 0.58, 1), border 0.1s cubic-bezier(0, 0, 0.58, 1); transition: color 0.4s cubic-bezier(0, 0, 0.58, 1),
} border 0.4s cubic-bezier(0, 0, 0.58, 1);
}
}
&:hover {
cursor: pointer;
border-color: var(--color-red);
color: var(--color-red);
transition: color 0.1s cubic-bezier(0, 0, 0.58, 1),
border 0.1s cubic-bezier(0, 0, 0.58, 1);
}
}
}
} }

View File

@ -25,7 +25,7 @@ layout: raw_page
<h3>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris maximus a augue id egestas. <h3>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris maximus a augue id egestas.
Etiam maximus velit at mauris viverra inte</h3> Etiam maximus velit at mauris viverra inte</h3>
</div> </div>
<div class="col-7"> <div class="col-7 work-experience-list">
<!-- <ul class="list-group"> --> <!-- <ul class="list-group"> -->
{% for job in site.data.work_experience %} {% for job in site.data.work_experience %}
<li class="card work-experience-item" onclick="document.location='{{job.url}}';"> <li class="card work-experience-item" onclick="document.location='{{job.url}}';">