XPUB
/
gradshow24
6
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

mobile more

Browse Source
master
ada 5 months ago
parent c19dd0b7f6
commit c5546bda83
2 changed files with 77 additions and 66 deletions
Show Stats Download Patch File Download Diff File

11
index.html
Unescape Escape View File

@ -11,11 +11,6 @@
<body> <body>
<div id="row1"> <div id="row1">
<div class=" container">
<h2>xpub 22–24</h2>
<h1>vulnerable interfaces</h1>
</div>
<div class="content-list" id="index-contents"> <div class="content-list" id="index-contents">
<img src="/img/purple.png" alt="purple" class="img"> <img src="/img/purple.png" alt="purple" class="img">
<a href="/ada/index.html" class=" content">Backplaces</a> <a href="/ada/index.html" class=" content">Backplaces</a>
@ -45,6 +40,12 @@
</div> </div>
<div class=" container">
<h2>xpub 22–24</h2>
<h1>vulnerable interfaces</h1>
</div>
<div id="row2"> <div id="row2">
<div id="content"><h1 id="introduction">Introduction</h1> <div id="content"><h1 id="introduction">Introduction</h1>
<h2 id="act-1.">Act 1.</h2> <h2 id="act-1.">Act 1.</h2>

132
style.css
Unescape Escape View File

@ -20,31 +20,6 @@ body {
box-sizing: border-box; box-sizing: border-box;
} }
.container {
display: flex;
flex-direction: column;
align-items: flex-start;
position: absolute;
bottom: 0;
left: 70px;
margin-bottom: 70px;
}
h1 {
font-family: 'Platypi-Bold', serif;
font-size: 50px;
max-width: 20%;
margin: 0;
}
.container h2 {
font-family: 'Platypi-Regular', serif;
font-size: 40px;
max-width: 30%;
margin: 0;
margin-bottom: -0.5rem;
}
.content-list { .content-list {
max-width: 633px; max-width: 633px;
margin: auto; margin: auto;
@ -64,52 +39,65 @@ h1 {
filter: saturate(2); filter: saturate(2);
} }
#row1, #row2 { .container {
width: 100%; display: flex;
flex-direction: column;
align-items: flex-start;
margin: 200px 0;
}
h1 {
font-family: 'Platypi-Bold', serif;
font-size: 50px;
max-width: 20%;
margin: 0;
} }
.container h2 {
font-family: 'Platypi-Regular', serif;
font-size: 40px;
max-width: 30%;
margin: 0;
margin-bottom: -0.5rem;
}
#content{ #content {
font-size: 22px; font-size: 22px;
line-height: 1.7rem; line-height: 1.7rem;
max-width: 633px; max-width: 633px;
margin: auto; margin: auto;
margin-right: 0; margin-right: 0;
margin-top: 430px; margin-top: -100px;
margin-bottom: 200px;
} }
#content p{ #content p {
margin-left: 25mm; margin-left: 25mm;
} }
#content h1{display: none;} #content h1 {display: none;}
#content h2, #content h3{ #content h2, #content h3 {
text-decoration: underline; text-decoration: underline;
text-align: center; text-align: center;
} }
#content strong{ #content strong {
position: absolute; position: absolute;
margin-left: -44mm; margin-left: -44mm;
width: 44mm; width: 44mm;
} }
@keyframes wiggle {
25% {
@keyframes wiggle{ transform: scale(0.8, 1.3);
25%{
transform: scale(0.8,1.3);
} }
50%{ 50% {
transform: scale(1.1,0.8); transform: scale(1.1, 0.8);
} }
75%{ 75% {
transform: scale(0.7,1.2); transform: scale(0.7, 1.2);
} }
} }
.content-list a:hover img, .content-list a:hover img,
.content-list img:hover { .content-list img:hover {
animation: wiggle 0.6s infinite; animation: wiggle 0.6s infinite;
@ -118,38 +106,60 @@ h1 {
@media (max-width: 768px) { @media (max-width: 768px) {
body { body {
font-size: 21px; font-size: 21px;
line-height: 1.5rem; line-height: 1.5rem;
padding: 0 50px; padding: 0 50px;
} }
.container { .container {
margin-left: -20px; margin-left: -20px;
line-height: 2rem; line-height: 2rem;
margin: 20px 0; /* Adjusted for mobile */
} }
.container h1 { .container h1 {
font-size: 30px; font-size: 30px;
max-width: 200px; max-width: 200px;
} }
.container h2 { .container h2 {
font-size: 20px; font-size: 20px;
max-width: 70px; max-width: 70px;
} }
.content-list { .content-list {
max-width: 90%; max-width: 90%;
margin-top: 30px; margin-top: 30px;
margin-right: -20px; margin-right: -20px;
} }
.content-list img { .content-list img {
width: 25px; width: 25px;
} }
.about { #content {
padding: 20px; font-size: 15px;
line-height: 1.2rem;
max-width: -webkit-fill-available;
margin: auto;
margin-right: 0;
margin-top: 50px;
}
#content p {
width: 220px;
margin-left: 20mm;
}
#content h1 {display: none;}
#content h2, #content h3 {
text-decoration: underline;
text-align: center;
} }
}
#content strong {
position: absolute;
margin-left: -20mm;
width: 14mm;
}
}

Write Preview
Loading…
Cancel
Save