Xargon/RetroDECK-Website
1
0
Fork 0
mirror of https://github.com/RetroDECK/RetroDECK-Website.git synced 2024-11-21 22:45:39 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add d-pad icons for carousel

Browse source
This commit is contained in:
Adam Iannazzone 2024-09-26 14:02:20 -04:00
parent 155a3ae809
commit 0a26a7c10d
6 changed files with 34 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
assets/pixel-icons/steamdeck_dpad_left.svg Executable file
View file

@ -0,0 +1,7 @@
<svg width="64" height="64" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs/>
<g>
<path stroke="none" fill="#FFFFFF" d="M23 23 L23 12 Q23 8 27 8 L37 8 Q41 8 41 12 L41 23 52 23 Q56 23 56 27 L56 37 Q56 41 52 41 L41 41 41 52 Q41 56 37 56 L27 56 Q23 56 23 52 L23 41 23 23"/>
<path stroke="none" fill="#E73246" d="M23 23 L23 41 12 41 Q8 41 8 37 L8 27 Q8 23 12 23 L23 23"/>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 430 B

6
assets/pixel-icons/steamdeck_dpad_left_outline.svg Executable file
View file

@ -0,0 +1,6 @@
<svg width="64" height="64" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs/>
<g>
<path stroke="none" fill="#FFFFFF" d="M27 8 L37 8 Q41 8 41 12 L41 23 52 23 Q56 23 56 27 L56 37 Q56 41 52 41 L41 41 41 52 Q41 56 37 56 L27 56 Q23 56 23 52 L23 41 12 41 Q8 41 8 37 L8 27 Q8 23 12 23 L23 23 23 12 Q23 8 27 8 M37 11 L27 11 Q26 11 26 12 L26 52 Q26 53 27 53 L37 53 Q38 53 38 52 L38 38 52 38 Q53 38 53 37 L53 27 Q53 26 52 26 L38 26 38 12 Q38 11 37 11"/>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 502 B

7
assets/pixel-icons/steamdeck_dpad_right.svg Executable file
View file

@ -0,0 +1,7 @@
<svg width="64" height="64" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs/>
<g>
<path stroke="none" fill="#FFFFFF" d="M41 23 L41 41 41 52 Q41 56 37 56 L27 56 Q23 56 23 52 L23 41 12 41 Q8 41 8 37 L8 27 Q8 23 12 23 L23 23 23 12 Q23 8 27 8 L37 8 Q41 8 41 12 L41 23"/>
<path stroke="none" fill="#E73246" d="M41 23 L52 23 Q56 23 56 27 L56 37 Q56 41 52 41 L41 41 41 23"/>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 430 B

6
assets/pixel-icons/steamdeck_dpad_right_outline.svg Executable file
View file

@ -0,0 +1,6 @@
<svg width="64" height="64" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs/>
<g>
<path stroke="none" fill="#FFFFFF" d="M27 8 L37 8 Q41 8 41 12 L41 23 52 23 Q56 23 56 27 L56 37 Q56 41 52 41 L41 41 41 52 Q41 56 37 56 L27 56 Q23 56 23 52 L23 41 12 41 Q8 41 8 37 L8 27 Q8 23 12 23 L23 23 23 12 Q23 8 27 8 M37 11 L27 11 Q26 11 26 12 L26 26 12 26 Q11 26 11 27 L11 37 Q11 38 12 38 L26 38 26 52 Q26 53 27 53 L37 53 Q38 53 38 52 L38 12 Q38 11 37 11"/>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 502 B

8
css/style.css
View file

@ -119,22 +119,22 @@ footer {
cursor:auto; cursor:auto;
} */ } */
.empty-feature-container { /* .empty-feature-container {
visibility: hidden; visibility: hidden;
} } */
img.screenshot { img.screenshot {
border: white 2px solid; border: white 2px solid;
border-radius: 5px; border-radius: 5px;
margin: auto; margin: auto;
width: 150%; /* width: 150%; */
} }
.feature-card { .feature-card {
background: var(--rd-blue); background: var(--rd-blue);
border: white 2px solid; border: white 2px solid;
border-radius: 5px; border-radius: 5px;
transition: 0.5s; /* transition: 0.5s; */
width: 75%; width: 75%;
} }

6
index.html
View file

@ -342,11 +342,13 @@
</div> </div>
</div> </div>
<button class="carousel-control-prev" type="button" data-bs-target="#features-carousel" data-bs-slide="prev" id="carousel-prev"> <button class="carousel-control-prev" type="button" data-bs-target="#features-carousel" data-bs-slide="prev" id="carousel-prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span> <!-- <span class="carousel-control-prev-icon" aria-hidden="true"></span> -->
<img class="d-pad d-none d-md-block" src="assets/pixel-icons/steamdeck_dpad_left_outline.svg" aria-hidden="true"/>
<span class="visually-hidden">Previous</span> <span class="visually-hidden">Previous</span>
</button> </button>
<button class="carousel-control-next" type="button" data-bs-target="#features-carousel" data-bs-slide="next" id="carousel-next"> <button class="carousel-control-next" type="button" data-bs-target="#features-carousel" data-bs-slide="next" id="carousel-next">
<span class="carousel-control-next-icon" aria-hidden="true"></span> <!-- <span class="carousel-control-next-icon" aria-hidden="true"></span> -->
<img class="d-pad d-none d-md-block" src="assets/pixel-icons/steamdeck_dpad_right_outline.svg" aria-hidden="true"/>
<span class="visually-hidden">Next</span> <span class="visually-hidden">Next</span>
</button> </button>
</div> </div>