youwen5/gallium-workshop
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update responsive design

Browse source
This commit is contained in:
Youwen Wu 2023-10-12 01:04:49 -07:00
parent 42bd2caa66
commit 9937df58f0
2 changed files with 58 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
public/index.css
View file

@ -164,21 +164,47 @@ footer p {
/* z-index: 1; */ /* z-index: 1; */
} }
/* all other screens */ /* all other screens (massive screens) */
@media only screen and not (max-width : 1200px) { @media only screen and not (max-width : 1850px) {
/* Styles */ /* Styles */
.bg-text { .bg-text {
font-size: 25vh; /* font-size: 25vh; */
font-size: 18rem;
opacity: 0.15; opacity: 0.15;
} }
} }
/* large size screen */
@media only screen @media only screen
and (max-width : 1200px) { and (max-width : 1850px) {
/* Styles */ /* Styles */
.bg-text { .bg-text {
font-size: 20vw; font-size: 15rem;
opacity: 0.25; opacity: 0.15;
/* margin-top: 10vh */
}
}
/* medium size screen */
@media only screen
and (max-width : 1500px) {
/* Styles */
.bg-text {
font-size: 12rem;
opacity: 0.15;
word-break: break-word;
margin-top: 8vh;
/* margin-top: 10vh */
}
}
/* phablet size screen */
@media only screen
and (max-width : 1100px) {
/* Styles */
.bg-text {
font-size: 10rem;
opacity: 0.15;
word-break: break-word; word-break: break-word;
margin-top: 8vh; margin-top: 8vh;
/* margin-top: 10vh */ /* margin-top: 10vh */
@ -190,8 +216,9 @@ and (max-width : 1200px) {
and (max-width : 600px) { and (max-width : 600px) {
/* Styles */ /* Styles */
.bg-text { .bg-text {
font-size: 30vw; z-index: 1;
opacity: 0.25; font-size: 8rem;
opacity: 0.1;
word-break: break-word; word-break: break-word;
margin-top: 22vh; margin-top: 22vh;
} }

23
public/index.html
View file

@ -83,6 +83,29 @@
<p>Quake 3 Arena fully playable in the browser and hosted within the SRVUSD intranet</p> <p>Quake 3 Arena fully playable in the browser and hosted within the SRVUSD intranet</p>
</div> </div>
</div> </div>
<h2>Hardware Projects</h2>
<div class="projects-list">
<div class="project">
<!-- <img src="assets/img/quake-3-arena.png" /> -->
<h3>Jankbook Pro</h3>
<p>Dell 3100 2-in-1 Chromebook, unenrolled and loaded with custom firmware allowing booting to Linux</p>
</div>
<div class="project">
<!-- <img src="assets/img/quake-3-arena.png" /> -->
<h3>Toughbook</h3>
<p>Decommissioned robotics laptop. Probably not a real toughbook, but it sure looks like one</p>
</div>
<div class="project">
<!-- <img src="assets/img/quake-3-arena.png" /> -->
<h3>ESP Deauther</h3>
<p>Work-in-progress multi-vector network offensive security testing device, based on an ESP development board</p>
</div>
<div class="project">
<!-- <img src="assets/img/quake-3-arena.png" /> -->
<h3>Gallium Intranet</h3>
<p>A private network hosted by Gallium workshop in order to facilitate easy local area connections to other devices</p>
</div>
</div>
<h2>Honorary Members</h2> <h2>Honorary Members</h2>
<div class="members-list"> <div class="members-list">
<div class="member"> <div class="member">