Mirrors/gamesearch
1
0
Fork 0
mirror of https://github.com/IdleEndeavor/gamesearch.git synced 2025-04-29 22:24:33 +02:00
Code Issues Packages Projects Releases Wiki Activity

3.5.0

Browse Source 
Redesign of Mobile UI

Ported Engine switcher over to mobile
Re-added link to Github page
Made the search bar and search logo more responsive and prominent
Updated ReadMe
This commit is contained in:
IdleEndeavor 2024-07-13 22:02:17 +01:00
parent 740b0b7cf5
commit c8280bebf7
5 changed files with 100 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
.DS_Store vendored
View File

Binary file not shown.

3
README.md
View File

@ -3,13 +3,14 @@ Rave Game Seach Engine assists users in discovering free Video Game downloads.
We only use sources deemed safe by the wider Video Game piracy communities on the r/piracy and r/PiratedGames megathreads. We only use sources deemed safe by the wider Video Game piracy communities on the r/piracy and r/PiratedGames megathreads.
![Screenshot of Rave Game Search Engine Homepage](img/ravesearch.png) ![Screenshot of Rave Game Search Engine Homepage](img/ravesearch.png)
![Screenshot of Rave Game Search Engine Mobile Homepage](img/ravesearch-mobile.png)
# Features # Features
- Assists in the finding of free Video Game download links - Assists in the finding of free Video Game download links
- Only indexes links confirmed to be virus-free. - Only indexes links confirmed to be virus-free.
- Supports direct searches via browser address bars - Supports direct searches via browser address bars
- Uses Google search indexing to provide results quickly - Uses Google search indexing to provide results quickly
- Simple UI for easy use - Simple and responsive UI for easy use
# Setting-up Direct URL Search # Setting-up Direct URL Search
1. Visit the Search Engine settings on your browser 1. Visit the Search Engine settings on your browser

132
css/index.css
View File

@ -6,10 +6,18 @@
font-style: normal; font-style: normal;
} }
:root {
--bg-color: #121212;
--text-color: #ffffff;
--primary-color: #F63F4D;
--secondary-color: #f63f4e78;
}
body { body {
margin: 0; margin: 0;
padding: 0; padding: 0;
background-color: #121212; background-color: var(--bg-color);
height: 100%; height: 100%;
font-family: Roboto; font-family: Roboto;
} }
@ -36,7 +44,7 @@ body {
} }
.tips { .tips {
color: white; color: var(--text-color);
} }
/* Fade animation for banner images */ /* Fade animation for banner images */
@ -60,7 +68,7 @@ body {
.engine-swticher a { .engine-swticher a {
padding: 5px; padding: 5px;
font-size: 20px; font-size: 20px;
color: white; color: var(--text-color);
text-decoration: none; text-decoration: none;
} }
@ -78,7 +86,7 @@ body {
.engine-swticher-2 .item { .engine-swticher-2 .item {
position: relative; position: relative;
color: white; /* Text color */ color: var(--text-color); /* Text color */
padding: 10px; padding: 10px;
margin-bottom: 10px; /* Space between items */ margin-bottom: 10px; /* Space between items */
border: 5px solid white; /* White border */ border: 5px solid white; /* White border */
@ -98,11 +106,11 @@ body {
top: 5px; top: 5px;
right: 5px; right: 5px;
cursor: pointer; cursor: pointer;
color: white; color: var(--text-color);
} }
/* .engine-swticher-2 .item:hover { /* .engine-swticher-2 .item:hover {
background-color: #F63F4D; /* Darker background on hover background-color: var(--primary-color); /* Darker background on hover
color: #000000; color: #000000;
} */ } */
@ -126,7 +134,7 @@ body {
padding: 5px; padding: 5px;
font-size: 16px; font-size: 16px;
width: 20%; width: 20%;
color: white; color: var(--text-color);
text-decoration: none; text-decoration: none;
} }
@ -143,7 +151,7 @@ body {
.terms a { .terms a {
padding: 5px; padding: 5px;
font-size: 16px; font-size: 16px;
color: white; color: var(--text-color);
text-decoration: none; text-decoration: none;
} }
@ -151,8 +159,8 @@ body {
/* search button */ /* search button */
.gsc-search-button .gsc-search-button-v2 { .gsc-search-button .gsc-search-button-v2 {
border-radius: 50%; border-radius: 50%;
border-color: #F63F4D; border-color: var(--primary-color);
background-color: #F63F4D; background-color: var(--primary-color);
height: 45px; height: 45px;
width: 45px; width: 45px;
margin: auto; margin: auto;
@ -162,10 +170,10 @@ body {
/* search input box */ /* search input box */
.gsc-input-box input.gsc-input, .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus { .gsc-input-box input.gsc-input, .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus {
border-radius: 20px !important; /* rounded corner */ border-radius: 20px !important; /* rounded corner */
border-color: #F63F4D !important; border-color: var(--primary-color) !important;
border-width: 5px !important; border-width: 5px !important;
background-color: #121212 !important; /* inner background colour */ background-color: var(--bg-color) !important; /* inner background colour */
color: white; color: var(--text-color);
font-family: 'Roboto'; font-family: 'Roboto';
font-size: 20px; font-size: 20px;
} }
@ -206,7 +214,7 @@ body {
} }
/* colours result titles white (including visited results) */ /* colours result titles white (including visited results) */
.gs-webResult.gs-result a.gs-title:link, .gs-webResult.gs-result a.gs-title:link b, .gs-imageResult a.gs-title:link, .gs-imageResult a.gs-title:link b { .gs-webResult.gs-result a.gs-title:link, .gs-webResult.gs-result a.gs-title:link b, .gs-imageResult a.gs-title:link, .gs-imageResult a.gs-title:link b {
color: white !important; color: var(--text-color) !important;
font-size: 20px; font-size: 20px;
} }
/* styles URL under result titles */ /* styles URL under result titles */
@ -216,8 +224,8 @@ body {
} }
/* colouring of search result background and border */ /* colouring of search result background and border */
.gsc-webResult.gsc-result, .gsc-results .gsc-imageResult { .gsc-webResult.gsc-result, .gsc-results .gsc-imageResult {
background-color: #121212 !important; background-color: var(--bg-color) !important;
border-color: #F63F4D !important; border-color: var(--primary-color) !important;
border: none !important; border: none !important;
padding-bottom: 5px !important; padding-bottom: 5px !important;
} }
@ -227,24 +235,24 @@ body {
} }
/* Styles pagination switcher */ /* Styles pagination switcher */
.gsc-results .gsc-cursor-box .gsc-cursor-page { .gsc-results .gsc-cursor-box .gsc-cursor-page {
border-color: #F63F4D !important; border-color: var(--primary-color) !important;
border-radius: 50% !important; border-radius: 50% !important;
background-color: transparent !important; background-color: transparent !important;
color: white !important; color: var(--text-color) !important;
padding: 5px 10px !important; padding: 5px 10px !important;
margin: 5px; margin: 5px;
} }
/* Styles active page pagination switcher */ /* Styles active page pagination switcher */
.gsc-results .gsc-cursor-box .gsc-cursor-current-page { .gsc-results .gsc-cursor-box .gsc-cursor-current-page {
border-color: #F63F4D !important; border-color: var(--primary-color) !important;
color: #F63F4D !important; color: var(--primary-color) !important;
border-bottom: 2px solid #F63F4D !important; border-bottom: 2px solid var(--primary-color) !important;
padding: 5px 10px !important; padding: 5px 10px !important;
} }
.gsc-results .gsc-cursor { .gsc-results .gsc-cursor {
color: #F63F4D !important; color: var(--primary-color) !important;
fill: #F63F4D !important; fill: var(--primary-color) !important;
} }
/* makes pagination switcher background transparent */ /* makes pagination switcher background transparent */
.gsc-results { .gsc-results {
@ -252,20 +260,20 @@ body {
} }
/* colours search phrase clear button */ /* colours search phrase clear button */
.gsst_a .gscb_a { .gsst_a .gscb_a {
color: #F63F4D !important; color: var(--primary-color) !important;
cursor: pointer; cursor: pointer;
} }
/* styles sizing and colouring of autocomplete suggestions */ /* styles sizing and colouring of autocomplete suggestions */
.gsc-completion-container { .gsc-completion-container {
color: white !important; color: var(--text-color) !important;
border-color: #F63F4D !important; border-color: var(--primary-color) !important;
border-radius: 10px !important; border-radius: 10px !important;
padding: 10px !important; padding: 10px !important;
} }
/* styles autocomplete suggestion when hovered */ /* styles autocomplete suggestion when hovered */
.gssb_a:hover { .gssb_a:hover {
background: #F63F4D !important; background: var(--primary-color) !important;
color: white !important; color: var(--text-color) !important;
} }
/* removes border-line below filters switcher and removes border on mobile view */ /* removes border-line below filters switcher and removes border on mobile view */
.gsc-refinementsArea { .gsc-refinementsArea {
@ -275,19 +283,19 @@ body {
} }
/* changes colour of scrollable gradient in mobile view */ /* changes colour of scrollable gradient in mobile view */
.gsc-refinementsGradient { .gsc-refinementsGradient {
background: linear-gradient(to left,#F63F4D,rgba(255,255,255,0)) !important; background: linear-gradient(to left,var(--primary-color),rgba(255,255,255,0)) !important;
} }
/* styles inactive filter tabs */ /* styles inactive filter tabs */
.gsc-tabHeader.gsc-tabhInactive, .gsc-refinementHeader.gsc-refinementhInactive { .gsc-tabHeader.gsc-tabhInactive, .gsc-refinementHeader.gsc-refinementhInactive {
color: white !important; color: var(--text-color) !important;
border-color: #121212 !important; border-color: var(--bg-color) !important;
background-color: #121212 !important; background-color: var(--bg-color) !important;
} }
/* styles active filter tabs */ /* styles active filter tabs */
.gsc-tabHeader.gsc-tabhActive, .gsc-refinementHeader.gsc-refinementhActive { .gsc-tabHeader.gsc-tabhActive, .gsc-refinementHeader.gsc-refinementhActive {
color: #F63F4D !important; color: var(--primary-color) !important;
border-color: #F63F4D !important; border-color: var(--primary-color) !important;
background-color: #121212 !important; background-color: var(--bg-color) !important;
} }
/* styles tags on search results */ /* styles tags on search results */
.gsc-control-cse .gsc-table-result { .gsc-control-cse .gsc-table-result {
@ -311,7 +319,41 @@ body {
/* removes ads from the search results */ /* removes ads from the search results */
.gsc-adBlock { .gsc-adBlock {
display: none !important; display: none !important;
} }
.toggle-container {
display: none; /* Initially hide the toggle container */
position: fixed;
justify-content: center;
top: 15px;
left: 50%;
transform: translateX(-50%);
border-radius: 50px;
z-index: 1000;
width: 80%;
padding: 0 10px;
}
.toggle-btn {
display: inline-block;
padding: 10px 20px;
color: var(--text-color);
text-decoration: none;
border-radius: 20px;
border-width: 5px;
transition: background-color 0.3s ease;
text-align: center;
box-sizing: border-box;
}
#primary {
background-color: var(--primary-color);
color: var(--text-color);
}
.toggle-btn:hover {
background-color: var(--secondary-color);
}
/* Screen-size dependant options */ /* Screen-size dependant options */
@media (max-width: 1000px) { @media (max-width: 1000px) {
@ -320,21 +362,21 @@ body {
position: relative; position: relative;
text-align: left; text-align: left;
top: 25%; top: 25%;
width: 80%; width: 90%;
} }
.maindiv img { .maindiv img {
max-width: 75%; max-width: 90%;
}
.terms {
display: none;
} }
.engine-swticher { .engine-swticher {
display: none; display: none;
} }
.toggle-container {
display: flex;
}
.engine-switcher-2 { .engine-switcher-2 {
display: none; display: none;
} }
@ -343,6 +385,12 @@ body {
display: none; display: none;
} }
/* search input box */
.gsc-input-box input.gsc-input, .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus {
border-radius: 50px !important; /* rounded corner */
margin-right: 5px !important;
}
.games-found { .games-found {
display: none; display: none;
} }

BIN
img/ravesearch-mobile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 226 KiB

8
index.html
View File

@ -22,6 +22,7 @@
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<!-- Engine Switcher --> <!-- Engine Switcher -->
<div class="engine-swticher"> <div class="engine-swticher">
<a href="https://ravegamesearch.pages.dev">> Game Search</a> <a href="https://ravegamesearch.pages.dev">> Game Search</a>
@ -29,6 +30,12 @@
<a href="https://ravesoftwaresearch.pages.dev">Software Search</a> <a href="https://ravesoftwaresearch.pages.dev">Software Search</a>
</div> </div>
<div class="toggle-container">
<a href="https://ravegamesearch.pages.dev" id="primary" class="toggle-btn">Games</a>
<a href="https://ravebooksearch.com" class="toggle-btn">Books</a>
<a href="https://ravesoftwaresearch.pages.dev" class="toggle-btn">Software</a>
</div>
<!-- Notification Centre --> <!-- Notification Centre -->
<div class="engine-swticher-2"> <div class="engine-swticher-2">
<!-- First Item: Donation message and button--> <!-- First Item: Donation message and button-->
@ -96,6 +103,7 @@
}); });
}); });
</script> </script>
<!-- Search Box, logo banner and advertisement--> <!-- Search Box, logo banner and advertisement-->
<div class="maindiv"> <div class="maindiv">
<div class="searchlogo"> <div class="searchlogo">