Commit 3eb81d8d authored by Danilo Woznica's avatar Danilo Woznica

fix(All): Fix on mobile

parent 77f1869b
......@@ -37,9 +37,11 @@ permalink: /categories/
{% endif %}
{% endfor %}
{% assign UpcomingSorted = Upcoming | sort: "dateEvent" %}
<h3 class="display--small theme_type--dark blog__section">Upcoming</h3>
<div class="{% if Upcoming.size > 3 %}blog__category{% else %}blog__category--no-highlight{% endif %}">
{% for post in Upcoming %}
{% for post in UpcomingSorted %}
<a
class="card--blog card--blog__image"
href="{{ post.url | remove: "index.html" }}"
......
......@@ -141,7 +141,7 @@
.blog__featured {
@media screen and (min-width: $tablet) {
display: grid;
grid-gap: 1em 2em;
grid-gap: 2em;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, auto);
......
......@@ -31,21 +31,6 @@
padding: 0;
}
&:after {
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
right: 0em;
width: 3em;
background-image: linear-gradient(-90deg, $grey-bg 0%, transparent 100%);
@media screen and (min-width: $tablet) {
display: none;
}
}
> div {
overflow: auto;
}
......
......@@ -30,6 +30,11 @@
.team-map__pin {
position: absolute;
opacity: 0;
display: none;
@media screen and (min-width: $tablet) {
display: block;
}
&:after {
content: "";
......@@ -115,11 +120,6 @@
line-height: 1;
opacity: 0;
transform-origin: 50% 100%;
display: none;
@media screen and (min-width: $tablet) {
display: block;
}
&:after {
content: "";
......
......@@ -10,10 +10,24 @@
}
}
@media screen and (min-width: $tablet) {
&.table--two-column {
table {
max-width: 50%;
}
}
&.table--three-column {
table {
max-width: calc(100% / 3);
}
}
}
table {
table-layout: fixed;
width: 100%;
margin-bottom: 2em;
width: 100%;
@media screen and (min-width: $tablet) {
flex: 1;
......
......@@ -95,8 +95,8 @@ strong {
display: inline-block;
padding: 0.4em 1em;
vertical-align: middle;
margin-left: 1em;
margin-right: 1em;
margin-left: 0.8em;
margin-right: 0.8em;
}
.code {
......
......@@ -100,7 +100,7 @@ redirect_from:
<div class="space--2"></div>
<div class="col--three-quarter table table--light">
<div class="col--three-quarter table table--light table--three-column">
<table>
<tbody>
<tr>
......
......@@ -103,7 +103,7 @@ redirect_from:
<div class="space--2"></div>
<div class="flex-grid grid--justify-around">
<div class="col--three-quarter table table--dark">
<div class="col--three-quarter table table--two-column table--dark">
<table>
<tbody>
<tr>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment