Gnarwhal/achievements_project
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added box-shadows

Browse source
This commit is contained in:
Gnarwhal 2021-01-22 03:12:42 -05:00
parent 77e451520e
commit 0a16c8e708
Signed by: Gnarwhal
GPG key ID: 0989A73D8C421174
2 changed files with 22 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
front_end/index.html
View file

@ -88,8 +88,8 @@
<p class="page-header-text">Achievements</p>
<div class="page-header-separator"></div>
<div class="list-page-search">
<label for="game-search">Search</label>
<input id="game-search" type="text" placeholder="Name, Keyword, etc..." name="game-search" />
<label for="achievement-search">Search</label>
<input id="achievement-search" type="text" placeholder="Name, Keyword, etc..." name="achievement-search" />
</div>
<div class="list-page-partitions">
<div class="list-page-filter-partition">
@ -265,19 +265,19 @@
<div class="page-subheader-separator"></div>
<div class="profile-game-entry">
<img class="profile-game-entry-icon" src="res/dummy_game.png" alt="Some Game Icon" />
<p class="profile-game-entry-name">Lorem Ipsum</p>
<p class="profile-game-entry-name">Latin</p>
</div>
<div class="profile-game-entry">
<img class="profile-game-entry-icon" src="res/dummy_game.png" alt="Some Game Icon" />
<p class="profile-game-entry-name">Lorem Ipsum</p>
<p class="profile-game-entry-name">Latin</p>
</div>
<div class="profile-game-entry">
<img class="profile-game-entry-icon" src="res/dummy_game.png" alt="Some Game Icon" />
<p class="profile-game-entry-name">Lorem Ipsum</p>
<p class="profile-game-entry-name">Latin</p>
</div>
<div class="profile-game-entry">
<img class="profile-game-entry-icon" src="res/dummy_game.png" alt="Some Game Icon" />
<p class="profile-game-entry-name">Lorem Ipsum</p>
<p class="profile-game-entry-name">Latin</p>
</div>
</div>
<div id="profile-achievements">

18
front_end/styles/index.css
View file

@ -1,4 +1,5 @@
:root {
--background-dark: #111115;
--background: #22222A;
--foreground: #EEEEEE;
--distinction: #44444F;
@ -20,7 +21,7 @@
}
html, body {
background-color: var(--background);
background-color: var(--background-dark);
margin: 0;
border: 0;
@ -32,6 +33,8 @@ html, body {
}
#navbar {
z-index: 1;
position: fixed;
background-color: var(--navbar-background);
@ -45,6 +48,8 @@ html, body {
flex-direction: row;
justify-content: space-between;
align-items: center;
box-shadow: 0px 0px 5px 10px rgba(0, 0, 0, 0.5);
}
#navbar-left {
@ -108,12 +113,19 @@ html, body {
}
.page {
z-index: 0;
box-sizing: border-box;
padding: 0px 64px;
width: 100%;
height: max-content;
height: 100%;
background-color: var(--background);
box-shadow: 0px 0px 5px 10px rgba(0, 0, 0, 0.5);
overflow-y: auto;
display: none;
}
@ -449,6 +461,8 @@ html, body {
#profile-page {
max-width: 1920px;
display: block;
}
#profile-section-1 {