Py.Cafe

import ipywidgets as widgets
import random

# Generate a secret random number
secret = random.randint(1, 10)
guessed_correctly = False

# Create a slider for the user's guess
slider = widgets.IntSlider(
    value=0,
    max=10,
    description='Slide to Your Guess:',
    continuous_update=False,
    style={'description_width': 'initial'},
)

# Create an HTML widget to display the output text with a Text widget but without a border and bold, not the default gray
output = widgets.HTML(
    value="The secret number is a number between 1 and 10. Drag the slider to guess.",
    placeholder='Output will be displayed here',
    disabled=True,
    layout=widgets.Layout(width='500px', height='100px', border='none', font_weight='bold', color='black')
)

# Define a function to handle the slider value change
def on_value_change(change):
    global guessed_correctly
    if not guessed_correctly:
        if slider.value == secret:
            guessed_correctly = True
            output.value = "<strong>You got it!</strong>"
        else:
            output.value = "<strong>Too small</strong>" if slider.value < secret else "<strong>Too big</strong>"

# Create a VBox to hold the slider and output widgets
ui = widgets.VBox([slider, output])

# Bind the on_value_change function to the slider's value event
slider.observe(on_value_change, names='value')

# Assign the VBox to the page variable
page = ui

# SEE ON PY.CAFE 'https://py.cafe/fomightez/super-basic-number-guessing-game-in-all-ipywigets-plus-MARKDOWN' for fancier text display