Skip to content

Commit 728b362

Browse files
committed
Article gg_sunstone
updated contact css classes - removed about me - Main page reorder
1 parent f2a17ec commit 728b362

File tree

11 files changed

+102
-33
lines changed

11 files changed

+102
-33
lines changed

assets/css/main.css

Lines changed: 39 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,12 @@
1818

1919
.first-text {
2020
text-align: center;
21+
margin: 0 0 0.25em 0;
22+
}
23+
24+
.date {
25+
border-bottom: solid 1px #c9c9c9;
26+
text-align: center;
2127
}
2228

2329
.other-socials {
@@ -28,10 +34,20 @@
2834
margin: 0 0 1em 0;
2935
}
3036

31-
.video-center {
32-
display: block;
33-
margin: auto;
37+
38+
.video {
39+
border-radius: 4px;
40+
border: 0;
41+
display: inline-block;
42+
position: relative;
3443
}
44+
.video.center {
45+
display: block;
46+
margin: auto;
47+
/*width: 80%;
48+
height: 32em;*/
49+
}
50+
3551

3652
.image-center {
3753
display: block;
@@ -271,7 +287,7 @@ input, select, textarea {
271287
@media screen and (max-width: 1280px) {
272288

273289
body, input, select, textarea {
274-
font-size: 10pt;
290+
font-size: 11pt;
275291
}
276292

277293
}
@@ -282,7 +298,7 @@ input, select, textarea {
282298
-ms-transition: border-bottom-color 0.2s ease, color 0.2s ease;
283299
transition: border-bottom-color 0.2s ease, color 0.2s ease;
284300
text-decoration: none;
285-
color: #585858;
301+
color: #a8a8a8;
286302
border-bottom: dotted 1px rgba(88, 88, 88, 0.5);
287303
}
288304

@@ -303,6 +319,14 @@ input, select, textarea {
303319
margin: 0 0 2em 0;
304320
}
305321

322+
p.center {
323+
text-align: center;
324+
}
325+
326+
p.justify {
327+
text-align: justify;
328+
}
329+
306330
h1 {
307331
font-size: 2.75em;
308332
font-weight: 700;
@@ -433,10 +457,20 @@ input, select, textarea {
433457
margin: 2em 0;
434458
}
435459

460+
hr.big {
461+
border-bottom: solid 3px #c9c9c9;
462+
}
463+
436464
hr.major {
437465
margin: 3em 0;
438466
}
439467

468+
hr.small {
469+
margin: 1em 0;
470+
width: 80%;
471+
transform: translateX(12.5%);
472+
}
473+
440474
.align-left {
441475
text-align: left;
442476
}

contact.html

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@
4040
</nav>-->
4141

4242
</div>
43-
<div class="banner-still">
43+
<div class="banner-still index">
4444
<img src="images/banner.png" alt="" class="banner-image">
4545
</div>
4646
</header>
@@ -61,17 +61,24 @@ <h2>Menu</h2>
6161
<div id="main">
6262
<div class="inner">
6363
<h1 class="first-text">Contact me!</h1>
64-
<hr />
64+
<hr class="big">
6565
<p class="first-text">Don't be afraid to say hi in any of my socials, always happy to talk :D<br>I'm "<b>Adrihfu</b>" in almost every social.</p>
6666
<section class="other-socials">
6767
<ul class="icons-contact">
6868
<li class="contact"><a href="mailto:adrihfu2001@gmail.com" class="icon solid style4 fa-solid fa-envelope"><span class="label-show-style4">Email</span></a></li>
69-
<li class="contact"><a href="https://www.artstation.com/adrihfu" class="icon brands style4 fa-solid fa-artstation"><span class="label-show-style4">Artstation</span></a></li>
69+
<li class="contact"><a href="https://www.linkedin.com/in/adrihfu/" class="icon brands style4 fa-solid fa-linkedin"><span class="label-show-style4">LinkedIn</span></a></li>
7070
<li class="contact"><a href="https://github.com/Adrihfu" class="icon brands style4 fa-solid fa-github"><span class="label-show-style4">GitHub</span></a></li>
71+
</ul>
72+
<hr class="small">
73+
<ul class="icons-contact">
74+
<li class="contact"><a href="https://www.artstation.com/adrihfu" class="icon brands style4 fa-solid fa-artstation"><span class="label-show-style4">Artstation</span></a></li>
7175
<li class="contact"><a href="https://adrihfu.itch.io/" class="icon brands style4 fa-solid fa-itch-io"><span class="label-show-style4">itch.io</span></a></li>
7276
<li class="contact"><a href="https://adrihfu.newgrounds.com/" class="icon brands style4 fa-solid fa-newgrounds"><img class="image-center" src="assets/misc/ng_initials.svg" alt="" width="65%"><span class="label-show-style4 small">Newgrounds</span></a></li>
73-
<li class="contact"><a href="https://www.linkedin.com/in/adrihfu/" class="icon brands style4 fa-solid fa-linkedin"><span class="label-show-style4">LinkedIn</span></a></li>
7477
<li class="contact"><a href="https://steamcommunity.com/id/adrihfu" class="icon brands style4 fa-solid fa-steam"><span class="label-show-style4">Steam</span></a></li>
78+
<li class="contact"><a href="mailto:@adrihfu" class="icon brands style4 fa-solid fa-discord"><span class="label-show-style4">Discord</span></a></li>
79+
</ul>
80+
<hr class="small">
81+
<ul class="icons-contact">
7582
<li class="contact"><a href="https://twitter.com/adrihfuelmen" class="icon brands style4 fa-solid fa-twitter"><span class="label-show-style4">Twitter</span></a></li>
7683
<li class="contact"><a href="https://bsky.app/profile/adrihfu.bsky.social" class="icon brands style4 fa-solid fa-bluesky"><span class="label-show-style4">BlueSky</span></a></li>
7784
<li class="contact"><a href="https://www.instagram.com/adrihfu" class="icon brands style4 fa-solid fa-instagram"><span class="label-show-style4">Instagram</span></a></li>

generic.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -61,8 +61,8 @@ <h2>Menu</h2>
6161
<div id="main">
6262
<div class="inner">
6363
<h1 class="first-text">Generic Page</h1>
64-
<hr>
65-
<span class="image main"><img src="images/placeholder3.png" alt="" /></span>
64+
<p class="date">Created in 11/03/2026 - Last update <b>11/03/2026</b></p>
65+
<span class="image main"><img src="images/placeholder2.png" alt="" /></span>
6666
<p>Donec eget ex magna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque venenatis dolor imperdiet dolor mattis sagittis. Praesent rutrum sem diam, vitae egestas enim auctor sit amet. Pellentesque leo mauris, consectetur id ipsum sit amet, fergiat. Pellentesque in mi eu massa lacinia malesuada et a elit. Donec urna ex, lacinia in purus ac, pretium pulvinar mauris. Curabitur sapien risus, commodo eget turpis at, elementum convallis elit. Pellentesque enim turpis, hendrerit tristique.</p>
6767
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis dapibus rutrum facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam tristique libero eu nibh porttitor fermentum. Nullam venenatis erat id vehicula viverra. Nunc ultrices eros ut ultricies condimentum. Mauris risus lacus, blandit sit amet venenatis non, bibendum vitae dolor. Nunc lorem mauris, fringilla in aliquam at, euismod in lectus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In non lorem sit amet elit placerat maximus. Pellentesque aliquam maximus risus, vel venenatis mauris vehicula hendrerit.</p>
6868
<p>Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque venenatis dolor imperdiet dolor mattis sagittis. Praesent rutrum sem diam, vitae egestas enim auctor sit amet. Pellentesque leo mauris, consectetur id ipsum sit amet, fersapien risus, commodo eget turpis at, elementum convallis elit. Pellentesque enim turpis, hendrerit tristique lorem ipsum dolor.</p>
1.2 MB
Binary file not shown.

images/jam_sunstone/map_layout.png

51.8 KB
Loading

images/jam_sunstone/ref_mural.png

764 KB
Loading

index.html

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@
3131
</a>
3232

3333
<a href="contact.html" class="icon solid style3 fa-solid fa-bars"><p class="label-show">Contact me</p></a>
34-
34+
3535
<!-- Nav -->
3636
<!--<nav>
3737
<ul>
@@ -68,42 +68,42 @@ <h2>Menu</h2>
6868
<header>
6969
<h1 class="first-text">Level Design Portfolio</h1>
7070
<!--<p>To be honest I'm literally learning HTML & CSS to modify this template.<br>I'm this passionate about been an Blockout Artist :)</p>-->
71-
<hr>
71+
<hr class="big">
7272
</header>
7373
<section class="tiles">
7474

7575
<article>
7676
<span class="image">
77-
<img src="images/adrian-garcia_1.png" alt="" />
77+
<img src="images/pic01.jpg" alt="" />
7878
</span>
79-
<a href="about-me.html">
80-
<h2>About me</h2>
79+
<a href="quick-view.html">
80+
<h2>Quick View</h2>
8181
<div class="content">
82-
<p>Who I am & how did I start</p>
82+
<p>Videos and screenshots showing my work</p>
8383
</div>
8484
</a>
8585
</article>
8686

8787
<article>
8888
<span class="image">
89-
<img src="images/gg_sunstone_n.jpg" alt="" />
89+
<img src="images/adrian-garcia_1.png" alt="" />
9090
</span>
91-
<a href="quick-view.html">
92-
<h2>Quick View</h2>
91+
<a href="about-me.html">
92+
<h2>About me</h2>
9393
<div class="content">
94-
<p>Videos and screenshots showing my work</p>
94+
<p>Who I am & how did I start</p>
9595
</div>
9696
</a>
9797
</article>
9898

9999
<article>
100100
<span class="image">
101-
<img src="images/pic03.jpg" alt="" />
101+
<img src="images/jam_sunstone/gg_sunstone_n.jpg" alt="" />
102102
</span>
103-
<a href="generic.html">
104-
<h2>Feugiat</h2>
103+
<a href="jam_sunstone.html">
104+
<h2>Sunstone</h2>
105105
<div class="content">
106-
<p>Sed nisl arcu euismod sit amet nisi lorem etiam dolor veroeros et feugiat.</p>
106+
<p>A one hour mapping jam for CS:GO (June 2021).</p>
107107
</div>
108108
</a>
109109
</article>

about-me.html renamed to jam_sunstone.html

Lines changed: 32 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141

4242
</div>
4343
<div class="banner-still">
44-
<img src="images/banner.png" alt="" class="banner-image">
44+
<img src="images/jam_sunstone/gg_sunstone_n2.jpg" alt="" class="banner-image bottom">
4545
</div>
4646
</header>
4747

@@ -60,9 +60,37 @@ <h2>Menu</h2>
6060
<!-- Main -->
6161
<div id="main">
6262
<div class="inner">
63-
<h1 class="first-text">About me</h1>
64-
<span class="image main"><img src="images/placeholder3.png" alt="" /></span>
65-
<p>lol</p>
63+
<h1 class="first-text">Sunstone</h1>
64+
<p class="date">Article created in 14/03/2026 - Last update <b>14/03/2026</b></p>
65+
<p>video here</p>
66+
<video class="video center" width="560" height="315" src="images/jam_sunstone/gg_sunstone_camera.webm" autoplay loop muted></video>
67+
<p>Sunstone or gg_sunstone was a map I made for CS:GO in June 2021 as 1.5 hour Speedmapping challenge.<br>It was inspired by <a href="https://enriquecoli.net/">Baxayaun (Enrique Colinet)</a>, who was doing the same type of challenge while streaming it on <a href="https://www.twitch.tv/baxayaun">his Twitch.</a></p>
68+
<!--<iframe class="video center" width="560" height="315" src="https://www.youtube.com/embed/c5gTk8mf4d8?si=BBThL_BAc2I9wkU8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>-->
69+
<hr class="small">
70+
<p>I recorded all the process and uploaded to youtube.</p>
71+
<p>youtube video here</p>
72+
<p>I used the same structure has Baxa</p>
73+
<p><b>SPEEDMAPPING Challenge #01:</b>
74+
<br>THEME > Rural
75+
<br>SIZE > Small
76+
<br>MODE > Gun Game / Elimination
77+
<br>TIME > 1h 30m
78+
<br>(time only counts when building the playable area)</p>
79+
<p class="justify">With only one hour and a half I had to take priorities, which ment making sacrifies <i>(very dramatic)</i>. Is more on the lines of: only geometry don't use any models, only use dev or simple textures, focus on big and medium, etc.</p>
80+
<p class="justify">With that in mind I started the challenge.<br>
81+
The timer start only when making the map, so I took the liberty to use 15 minutes before the real timer to gather references. Since I'm from Spain and lived in rural towns, thought of doing a spanish rural town, fits perfectly.</p>
82+
<img width="500" class="image-center" src="images/jam_sunstone/ref_mural.png" alt="">
83+
<hr class="small">
84+
<p class="center">Now the real timer starts.</p>
85+
<h2 class="first-text">1:30:00</h2>
86+
<hr class="small">
87+
<p class="justify">Opened paint and started sketching the layout of the map while looking a the references, taking all Counter Strike principles into action. The mode is elimination, so no bomb sites, this type of maps works well for deathmatch and gun game. So I focus on variation in every route that can be taken. The middle ground is a place where you go when you don't know where to move, so I place the main landmark there, like in every spanish town I chose a church.</p>
88+
<img width="500" class="image-center" src="images/jam_sunstone/map_layout.png" alt="">
89+
<hr class="small">
90+
<h2 class="first-text">1:05:00</h2>
91+
<hr class="small">
92+
<p class="justify">With an hour in hand I started Hammer, ready to lay down everything. Started with a base the ground using a dev texture of blabla </p>
93+
6694
</div>
6795
</div>
6896

0 commit comments

Comments
 (0)