Google Ads and Mobile Search Box enhancement

This commit is contained in:
shabinder 2021-03-16 18:24:23 +05:30
parent c1e61f28ab
commit b5387d8abd
4 changed files with 33 additions and 14 deletions

View File

@ -31,7 +31,7 @@ private val iconList = functionalComponent<IconListProps>("IconList") { props ->
+ Styles.makeRow
}
for((icon,platformLink) in props.iconsAndPlatforms){
styledA(href = platformLink){
styledA(href = platformLink,target="_blank"){
styledImg {
attrs {
src = icon

View File

@ -47,7 +47,7 @@ private val navBar = functionalComponent<NavBarProps>("NavBar") { props ->
}
}
}
styledA(href = "TODO Website Link") {
styledA(href = "https://shabinder.github.io/SpotiFlyer/",target="_blank") {
css {
display = Display.flex
alignItems = Align.center

View File

@ -10,6 +10,15 @@
<link href="css-circular-prog-bar.css" rel="stylesheet">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=RocknRoll+One&display=swap" rel="stylesheet">
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-PGSYNZHSS7"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-PGSYNZHSS7');
</script>
</head>
<body>
<div style="display: flex;flex-direction: column; height: inherit; color: white;" id="root"></div>

View File

@ -2,16 +2,7 @@
font-family: pristine;
src: url("pristine_script.ttf");
}
@media (max-width: 600px) {
/* CSS HERE ONLY ON PHONE */
.searchBox:hover > .searchInput {
width: 150px;
padding: 0 6px;
}
.info-banners {
flex-direction: column;
}
}
html {
background-image: url("header-dark.jpg");
font-family: Lora,Helvetica Neue,Helvetica,Arial,sans-serif;
@ -102,7 +93,7 @@ body, html {
}
.searchBox:hover > .searchInput {
width: 30vw;
width: 35vw;
padding: 0 6px;
}
@ -144,6 +135,8 @@ body, html {
line-height: 40px;
width: 0px;
}
/*Download All Button*/
#download-all-text {
color: black;
display: none;
@ -295,4 +288,21 @@ input.cmn-toggle-round-flat:checked + label:after {
/* margin-left = border-radius from 'input.cmn-toggle-round-flat + label' */
margin-left: 20px;
background-color: #8ce196;
}
}
@media screen and (max-width: 600px) {
/* CSS HERE ONLY ON PHONE */
.info-banners {
flex-direction: column;
}
.searchInput {
width: 35vw;
padding: 0 6px;
}
.search-icon {
filter: none;
}
.searchButton {
background: white;
color : #2f3640;
}
}