mirror of
https://github.com/IdleEndeavor/gamesearch.git
synced 2025-05-16 14:27:07 +02:00
Mega Improvements
added: - preloader - better search results UI - filter CSS - description - share buttons
This commit is contained in:
IdleEndeavor
parent
23c0762cc3
commit
7191aef357
122
css/index.css
122
css/index.css
@ -6,6 +6,7 @@ html, body {
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
background-color: #121212;
|
background-color: #121212;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
font-family: Roboto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maindiv {
|
.maindiv {
|
||||||
@ -24,6 +25,14 @@ html, body {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.maindiv p {
|
||||||
|
font-size: 1em;
|
||||||
|
color: white;
|
||||||
|
text-align: center;
|
||||||
|
margin: auto;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 600px) {
|
@media (max-width: 600px) {
|
||||||
.maindiv {
|
.maindiv {
|
||||||
margin: auto;
|
margin: auto;
|
||||||
@ -225,7 +234,7 @@ html, body {
|
|||||||
color: white !important;
|
color: white !important;
|
||||||
border-color: #F63F4D !important;
|
border-color: #F63F4D !important;
|
||||||
border-radius: 10px !important;
|
border-radius: 10px !important;
|
||||||
padding: 5px !important;
|
padding: 10px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.gssb_a:hover {
|
.gssb_a:hover {
|
||||||
@ -233,6 +242,43 @@ html, body {
|
|||||||
color: white !important;
|
color: white !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.gsc-tabHeader {
|
||||||
|
border: 3px dotted #F63F4D !important;
|
||||||
|
border-bottom: none !important;
|
||||||
|
color: white !important;
|
||||||
|
background-color: #121212 !important;
|
||||||
|
font-size: 1.2em !important;
|
||||||
|
font-weight: bold !important;
|
||||||
|
line-height: 25px !important;
|
||||||
|
min-width: 54px !important;
|
||||||
|
padding: 0 5px !important;
|
||||||
|
text-align: center !important;
|
||||||
|
margin: 0 5px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gsc-tabsArea {
|
||||||
|
border-bottom: 5px solid #F63F4D !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gsc-tabhActive {
|
||||||
|
background-color: #F63F4D !important;
|
||||||
|
border: 5px solid #F63F4D !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gsc-control-cse .gsc-table-result {
|
||||||
|
font-family: roboto !important;
|
||||||
|
background: white !important;
|
||||||
|
border-radius: 5px !important;
|
||||||
|
margin: auto !important;
|
||||||
|
padding: 0 5px !important;
|
||||||
|
width: fit-content !important;
|
||||||
|
float: left !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gs-webResult div.gs-visibleUrl {
|
||||||
|
color: lightgreen !important;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 600px) {
|
@media (max-width: 600px) {
|
||||||
.gsc-results .gsc-cursor-box .gsc-cursor-page {
|
.gsc-results .gsc-cursor-box .gsc-cursor-page {
|
||||||
border-color: #F63F4D !important;
|
border-color: #F63F4D !important;
|
||||||
@ -272,6 +318,7 @@ html, body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/*Slideout Sidebar*/
|
/*Slideout Sidebar*/
|
||||||
|
|
||||||
.toggle {
|
.toggle {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
font-size: 2em;
|
font-size: 2em;
|
||||||
@ -477,3 +524,76 @@ html, body {
|
|||||||
opacity: 1;
|
opacity: 1;
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Share Buttons */
|
||||||
|
|
||||||
|
.share {
|
||||||
|
display: flex;
|
||||||
|
text-align: center;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.share-button {
|
||||||
|
display: flex;
|
||||||
|
text-align: center;
|
||||||
|
width: 180px;
|
||||||
|
height: 50px;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.share-button a {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 20px;
|
||||||
|
color: #F63F4D;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Preloader */
|
||||||
|
|
||||||
|
.preloader_bg{
|
||||||
|
position: fixed;
|
||||||
|
z-index: 999999;
|
||||||
|
background: #121212;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.preloader{
|
||||||
|
border: 0 soild transparent;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
position: absolute;
|
||||||
|
top: calc(50vh - 75px);
|
||||||
|
left: calc(50vw - 75px);
|
||||||
|
}
|
||||||
|
.preloader:before, .preloader:after{
|
||||||
|
content: '';
|
||||||
|
border: 1em solid #F63F4D;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: inherit;
|
||||||
|
height: inherit;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
animation: loader 2s linear infinite;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
.preloader:before{
|
||||||
|
animation-delay: .5s;
|
||||||
|
}
|
||||||
|
@keyframes loader{
|
||||||
|
0%{
|
||||||
|
transform: scale(0);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
50%{
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100%{
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
31
index.html
31
index.html
@ -31,6 +31,19 @@
|
|||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
<!-- Preloader -->
|
||||||
|
|
||||||
|
<div class="preloader_bg">
|
||||||
|
<div class="preloader"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||||
|
<script>
|
||||||
|
setTimeout(function(){
|
||||||
|
$('.preloader_bg').fadeToggle();
|
||||||
|
}, 1500);
|
||||||
|
</script>
|
||||||
|
|
||||||
<!-- Slideout Menu -->
|
<!-- Slideout Menu -->
|
||||||
|
|
||||||
<input type="checkbox" id="slide" name="" value=""/>
|
<input type="checkbox" id="slide" name="" value=""/>
|
||||||
@ -97,7 +110,21 @@
|
|||||||
|
|
||||||
<gcse:search class="searchbox"></gcse:search>
|
<gcse:search class="searchbox"></gcse:search>
|
||||||
|
|
||||||
<div class="addthis_inline_share_toolbox"></div>
|
<p>Rave Game Search helps you find the best Completely Free and Safe Download Links to your favourite Video Games.<br>Happy Gaming!<br>If you like our service; kindly share it with your friends to help keep this project afloat.</p>
|
||||||
|
|
||||||
|
<div class="share">
|
||||||
|
|
||||||
|
<div class="share-button">
|
||||||
|
|
||||||
|
<a href="https://twitter.com/intent/tweet?source=http%3A%2F%2Fravebooksearch.com&text=Rave%20Book%20Download%20Link%20Search%20Engine:%20http%3A%2F%2Fravebooksearch.com" target="_blank" title="Tweet" class="fab fa-twitter"></a>
|
||||||
|
<a href="mailto:?subject=Rave%20Book%20Download%20Link%20Search%20Engine&body=Find%20free%20and%20safe%20download%20links%20to%20all%20your%20favourite%20books:%20http%3A%2F%2Fravebooksearch.com" target="_blank" title="Send email"><i class="fas fa-envelope"></i></a>
|
||||||
|
<a href="http://www.reddit.com/submit?url=http%3A%2F%2Fravebooksearch.com&title=Rave%20Book%20Download%20Link%20Search%20Engine" target="_blank" title="Submit to Reddit"><i class="fab fa-reddit"></i></a>
|
||||||
|
<a href="http://www.tumblr.com/share?v=3&u=http%3A%2F%2Fravebooksearch.com"e=Rave%20Book%20Download%20Link%20Search%20Engine&s=" target="_blank" title="Post to Tumblr"><i class="fab fa-tumblr"></i></a>
|
||||||
|
<a href="http://pinterest.com/pin/create/button/?url=http%3A%2F%2Fravebooksearch.com&media=https://ravebooksearch.com/img/ravesearch-homepage-pic.png&description=Find%20free%20and%20safe%20download%20links%20to%20all%20your%20favourite%20books" target="_blank" title="Pin it" class="fab fa-pinterest"></a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
<div align="center">
|
<div align="center">
|
||||||
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-9911043505807551"
|
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-9911043505807551"
|
||||||
@ -134,8 +161,6 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script type="text/javascript" src="https://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-61767ed319f04f59"></script>
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
Loading…
x
Reference in New Issue
Block a user