Madeorsk/SpotiFlyer
1
0
Fork 0
mirror of https://github.com/Shabinder/SpotiFlyer.git synced 2024-11-22 17:14:32 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Google Ads and Mobile Search Box enhancement

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web-app/src/main/kotlin/home/IconList.kt
View File

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

2
web-app/src/main/kotlin/navbar/NavBar.kt
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 { css {
display = Display.flex display = Display.flex
alignItems = Align.center alignItems = Align.center

9
web-app/src/main/resources/index.html
View File

@ -10,6 +10,15 @@
<link href="css-circular-prog-bar.css" rel="stylesheet"> <link href="css-circular-prog-bar.css" rel="stylesheet">
<link rel="preconnect" href="https://fonts.gstatic.com"> <link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=RocknRoll+One&display=swap" rel="stylesheet"> <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> </head>
<body> <body>
<div style="display: flex;flex-direction: column; height: inherit; color: white;" id="root"></div> <div style="display: flex;flex-direction: column; height: inherit; color: white;" id="root"></div>

32
web-app/src/main/resources/styles.css
View File

@ -2,16 +2,7 @@
font-family: pristine; font-family: pristine;
src: url("pristine_script.ttf"); 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 { html {
background-image: url("header-dark.jpg"); background-image: url("header-dark.jpg");
font-family: Lora,Helvetica Neue,Helvetica,Arial,sans-serif; font-family: Lora,Helvetica Neue,Helvetica,Arial,sans-serif;
@ -102,7 +93,7 @@ body, html {
} }
.searchBox:hover > .searchInput { .searchBox:hover > .searchInput {
width: 30vw; width: 35vw;
padding: 0 6px; padding: 0 6px;
} }
@ -144,6 +135,8 @@ body, html {
line-height: 40px; line-height: 40px;
width: 0px; width: 0px;
} }
/*Download All Button*/
#download-all-text { #download-all-text {
color: black; color: black;
display: none; display: none;
@ -296,3 +289,20 @@ input.cmn-toggle-round-flat:checked + label:after {
margin-left: 20px; margin-left: 20px;
background-color: #8ce196; 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;
}
}