def get_ticker_carousel(tickers): return dtc.Carousel([ dbc.Card([ dbc.CardBody([ html.H6(ticker['market']['name'], className="card-subtitle"), html.H4(f"{get_base_name(ticker)} / {ticker['target']}", className='card-title'), html.H5(f"Last Price: {ticker['last']: .7f}", className="card-text"), html.P(f"Volume: {round(ticker['volume'], 2)}", className="card-text"), dbc.CardLink('Trade URL', href=ticker['trade_url'], className='fas fa-link'), ], className='card-block text-center'), ], color='secondary', style={ "height": "11rem", "border-radius": "15px" }) for ticker in tickers ], slides_to_scroll=1, swipe_to_slide=True, variable_width=True, center_mode=False, infinite=True, autoplay=True, speed=2000, arrows=False)
def create_carousel(titles, poster_links): carousel = dtc.Carousel([ carousel_card(title, poster_links[i]) for i, title in enumerate(titles) ], slides_to_scroll=1, swipe_to_slide=True, autoplay=False, infinite=True, arrows=True, dots=True, variable_width=True, center_mode=True, responsive=[{ 'breakpoint': 991 }], style={ 'margin-top': '15px', 'margin-bottom': '20px' }) return carousel
def Stacks(): stacks = html.Div([ dtc.Carousel([ html.Div(html.Img(alt=i['name'], src=i['image']), className="item padding16 margin16 radius8 white_bg") for i in stacks_data ], slides_to_scroll=1, swipe_to_slide=True, autoplay=True, speed=2000, variable_width=True, center_mode=True, responsive=[{ 'breakpoint': 991, 'settings': { 'arrows': False } }]) ], className="stacks padding16") return stacks
], className="testeee", id="sidebar", bg_color="blue"), html.Div(id="page_content", style={ "maxWidth": "1400px", 'height': '1000px', "overflowY": "auto" }), html.Div([ dtc.Carousel( content, dots=False, arrows=True, infinite=True, speed=500, slides_to_show=3, slides_to_scroll=1, responsive=responsive, ), dtc.ThemeToggle(bg_color_dark='red', icon_color_dark='blue', bg_color_light='pink', icon_color_light='green', tooltip_text='teeext'), dtc.Card(link='link', image='image', title='title', description='description', badges=['trich', 'dash', 'web-dev'], git='git',
def crear_carousel(product_list): carrusel = dtc.Carousel([ dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#1'), html.P(product_list[0].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#2'), html.P(product_list[1].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#3'), html.P(product_list[2].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#4'), html.P(product_list[3].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#5'), html.P(product_list[4].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#6'), html.P(product_list[5].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#7'), html.P(product_list[6].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#8'), html.P(product_list[7].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#9'), html.P(product_list[8].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), dbc.Container([ dbc.Card([ dbc.CardBody([ html.H6('#10'), html.P(product_list[9].upper(), style={'fontSize': 11}, className="card-title"), ]) ], style={ "size": "8rem", "height": "100px", "width": "200px" }, color='secondary', outline=True) ]), ], slides_to_scroll=1, swipe_to_slide=True, autoplay=True, speed=500, variable_width=False, center_mode=False, responsive=[{ 'breakpoint': 991, 'settings': { 'arrows': True } }]) return carrusel
dtc.Carousel([ html.Img( className="Imagen_slider1", src= "https://static.wixstatic.com/media/e9606e_52e15af7d9b54c4ca1b51a67e4abb8f3~mv2.png" ), html.Img( className="Imagen_slider2", src= "https://static.wixstatic.com/media/e9606e_3057be61ba094ba684ac33e852ff4702~mv2.png" ), html.Img( className="Imagen_slider3", src= "https://static.wixstatic.com/media/e9606e_a01463d424f8451b93e125b093aa2a71~mv2.png" ), html.Img( className="Imagen_slider4", src= "https://static.wixstatic.com/media/e9606e_0c228475e917406f9367b43a79ffdf6d~mv2.png" ), html.Img( className="Imagen_slider5", src= "https://static.wixstatic.com/media/e9606e_7f2dde5a4cc541859bdf5599d4b2562d~mv2.png" ), html.Img( className="Imagen_slider6", src= "https://static.wixstatic.com/media/e9606e_adf6f666ace4425f9aca6cdf6dd0c732~mv2.png" ), ], slides_to_scroll=1, swipe_to_slide=True, autoplay=True, speed=500, variable_width=True, center_mode=True, responsive=[{ 'breakpoint': 991, 'settings': { 'arrows': False } }] ), # AQUI TERMINA EL SLIDER LA CONFIGURACIÓN SE DEJA TAL CUAL
import dash_trich_components as dtc import dash_html_components as html carousel = dtc.Carousel([ html.Div('slide 1'), html.Div('slide 2'), html.Div('slide 3'), html.Div('slide 4'), html.Div('slide 5'), html.Div('slide 6') ], slides_to_scroll=1, swipe_to_slide=True, autoplay=True, speed=2000, variable_width=True, center_mode=True, responsive=[ { 'breakpoint': 991, 'settings': { 'arrows': False } }] )