mirror of
https://github.com/Shabinder/SpotiFlyer.git
synced 2024-11-22 09:04:32 +01:00
styles and some fixes
This commit is contained in:
parent
31c9a2aa57
commit
cf9ed5e885
@ -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"
|
||||
|
@ -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)
|
||||
|
@ -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
|
||||
}
|
||||
}
|
||||
}
|
@ -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 {
|
||||
|
Loading…
Reference in New Issue
Block a user