Madeorsk/SpotiFlyer
1
0
Fork 0
mirror of https://github.com/Shabinder/SpotiFlyer.git synced 2024-10-18 12:54:33 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

styles and some fixes

Browse Source
This commit is contained in:
shabinder 2021-03-16 20:39:51 +05:30
parent 31c9a2aa57
commit cf9ed5e885
4 changed files with 26 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
web-app/src/main/kotlin/home/HomeScreen.kt
View File

@ -5,8 +5,10 @@ import com.shabinder.common.main.SpotiFlyerMain
import com.shabinder.common.main.SpotiFlyerMain.State
import com.shabinder.common.models.AllPlatforms
import extras.RenderableComponent
import kotlinx.browser.document
import kotlinx.coroutines.flow.Flow
import kotlinx.css.*
import kotlinx.dom.appendElement
import react.*
import styled.css
import styled.styledDiv
@ -17,6 +19,19 @@ class HomeScreen(
props,
initialState = State()
) {
override fun componentDidMount() {
super.componentDidMount()
val form = document.getElementById("razorpay-form")!!
repeat(form.childNodes.length){
form.childNodes.item(0)?.let { it1 -> form.removeChild(it1) }
form.childNodes.item(it)?.let { it1 -> form.removeChild(it1) }
}
form.appendElement("script"){
this.setAttribute("src","https://checkout.razorpay.com/v1/payment-button.js")
this.setAttribute("async", true.toString())
this.setAttribute("data-payment_button_id", "pl_GnKuuDBdBu0ank")
}
}
override val stateFlow: Flow<SpotiFlyerMain.State> = model.models
@ -56,8 +71,8 @@ class HomeScreen(
private val platformIconList = mapOf(
"spotify.svg" to "https://open.spotify.com/",
"gaana.svg" to "https://www.gaana.com/",
"youtube.svg" to "https://www.youtube.com/",
"youtube_music.svg" to "https://music.youtube.com/"
//"youtube.svg" to "https://www.youtube.com/",
//"youtube_music.svg" to "https://music.youtube.com/"
)
private val badges = mapOf(
"https://img.shields.io/github/v/release/Shabinder/SpotiFlyer?color=7885FF&label=SpotiFlyer&logo=android&style=for-the-badge"

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

@ -25,18 +25,6 @@ fun RBuilder.IconList(handler:IconListProps.() -> Unit): ReactElement {
private val iconList = functionalComponent<IconListProps>("IconList") { props ->
useEffect {
val form = document.getElementById("razorpay-form")!!
repeat(form.childNodes.length){
form.childNodes.item(it)?.let { it1 -> form.removeChild(it1) }
}
form.appendElement("script"){
this.setAttribute("src","https://checkout.razorpay.com/v1/payment-button.js")
this.setAttribute("async", true.toString())
this.setAttribute("data-payment_button_id", "pl_GnKuuDBdBu0ank")
}
}
styledDiv {
css {
margin(18.px)

2
web-app/src/main/kotlin/list/LoadingSpinner.kt
View File

@ -1,5 +1,6 @@
package list
import kotlinx.css.marginRight
import kotlinx.css.px
import kotlinx.css.width
import react.*
@ -24,6 +25,7 @@ private val loadingSpinner = functionalComponent<RProps>("Loading-Spinner") {
css{
classes = mutableListOf("lds-ring")
width = 50.px
marginRight = 8.px
}
}
}

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

@ -28,14 +28,19 @@ body, html {
font-weight: 100;
text-shadow: 0.3px 0.5px #ffffff;
}
.headingTitle{
text-align: center;
margin: 10px;
font-family: 'RocknRoll One', sans-serif;
}
.glow-button:hover {
.glow-button, .PaymentButton {
transition: all .2s ease-in-out;
}
.glow-button:hover, .PaymentButton:hover {
color: rgba(255, 255, 255, 1);
box-shadow: 0 5px 15px rgb(105, 44, 143);
transform: scale(1.1);
}
/*Loading Spinner*/
@ -295,7 +300,7 @@ input.cmn-toggle-round-flat:checked + label:after {
flex-direction: column;
}
.searchInput {
width: 35vw;
width: 60vw;
padding: 0 6px;
}
.search-icon {