adjust layout for mobile devices

This commit is contained in:
amphineko 2020-03-21 20:54:09 +08:00
parent 7e37fc75b8
commit e16b140c7e
No known key found for this signature in database
GPG Key ID: 4582E6587852EF42
4 changed files with 24 additions and 9 deletions

View File

@ -86,4 +86,9 @@ html {
.intro .block .split {
padding: 0 0.5em;
}
.intro p {
border-left: none;
padding: 0.2em;
}
}

View File

@ -116,7 +116,7 @@
<div class="split grid-50 mobile-grid-100">
<figure class="identities">
<figcaption>open-source</figcaption>
<figcaption><i class="fad fa-external-link-alt"></i>open-source</figcaption>
<ul>
<li>
<a href="https://github.com/amphineko/">
@ -129,7 +129,7 @@
</figure>
<figure class="identities">
<figcaption>social network</figcaption>
<figcaption><i class="fad fa-external-link-alt"></i>social network</figcaption>
<ul>
<li class="shutdown">
<a href="#">
@ -189,7 +189,7 @@
<div class="split grid-50 mobile-grid-100">
<figure class="identities">
<figcaption>profiles</figcaption>
<figcaption><i class="fad fa-external-link-alt"></i>profiles</figcaption>
<ul>
<li>
<a href="https://osu.ppy.sh/users/1344051">

View File

@ -9,8 +9,15 @@ figure.identities:last-child {
figure.identities figcaption {
color: #777;
line-height: 1.5em;
padding: 0 2.25em;
line-height: 2em;
padding: 0 0.25em;
}
figure.identities figcaption i {
font-size: 1.21em;
margin-right: 0.5ch; /* margin from mystery space after identity brand icons */
text-align: center;
width: 1.5em;
}
figure.identities ul {

View File

@ -33,19 +33,22 @@
}
.intro .label-group {
border-left: 0.25em solid #006080;
border-left: 0.2em solid #4600806b;
margin-top: 2em;
width: 100%;
}
.intro .label-group .header.alt {
color: #777;
margin-left: 1em;
font-size: 1em;
padding: 0 0.25em;
}
.intro .label-group .header.alt .fa-tag {
transform: rotate(-15deg);
margin-right: 0.5em;
font-size: 1.21em;
margin-right: 0.5ch;
text-align: center;
width: 1.5em;
}
.intro .label-group .label {