File size: 3,123 Bytes
37d5f61 dc2bf75 37d5f61 c37308e 37d5f61 ed3a35a 8de1ee6 ed3a35a 8de1ee6 ed3a35a 8de1ee6 ed3a35a 8de1ee6 ed3a35a 124754e ed3a35a 124754e 37d5f61 124754e |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 |
CUSTOM_CSS = """
<style>
.stApp {
max-width: 1400px;
margin: 0 auto;
}
.plot-container {
background-color: white;
border-radius: 10px;
padding: 20px;
margin: 10px 0;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
div[data-testid="stHorizontalBlock"] > div[data-testid="column"] {
background-color: #f8f9fa;
padding: 10px;
border-radius: 5px;
margin: 0 5px;
}
.header-container {
display: flex;
flex-direction: column;
align-items: center;
padding: 1rem 0 2rem 0;
width: 100%;
}
.logos-container {
display: flex;
align-items: center;
justify-content: center;
gap: 2rem;
margin-bottom: 1rem;
height: 100px;
}
.logo {
width: 100px;
height: 100px;
object-fit: contain;
display: block;
}
.logo.pocketpal {
width: 80px;
height: 80px;
border-radius: 20px;
}
.header-title {
font-size: 2.5rem;
font-weight: 600;
text-align: center;
color: #1a1a1a;
margin: 0;
padding: 10px 0;
}
.header-subtitle {
font-size: 1.2rem;
text-align: center;
color: #666;
margin: 0;
padding-bottom: 1rem;
max-width: 800px;
}
/* Guide Typography */
div[data-testid="column"]:last-child h3 {
font-size: 1.3rem;
margin: 0.5rem 0;
color: #1a1a1a;
}
div[data-testid="column"]:last-child h4 {
font-size: 1.1rem;
margin: 1rem 0 0.5rem 0;
color: #333;
}
div[data-testid="column"]:last-child ol {
padding-left: 1.2rem;
margin: 0.5rem 0;
}
div[data-testid="column"]:last-child li {
margin: 0.3rem 0;
color: #444;
font-size: 0.9rem;
}
div[data-testid="column"]:last-child p {
font-size: 0.95rem;
color: #666;
margin: 0.5rem 0;
}
/* Show/Dismiss button styling */
div[data-testid="column"]:last-child button {
float: right;
background: transparent;
border: none;
color: #666;
padding: 0.2rem 0.4rem;
font-size: 0.9rem;
line-height: 1;
transition: all 0.2s;
width: 100%;
text-align: center;
margin-top: 0.5rem;
}
div[data-testid="column"]:last-child button:hover {
color: #333;
background-color: #f0f0f0;
border-radius: 4px;
}
/* Store badges styling */
.store-badge {
height: 35px;
transition: transform 0.2s;
display: inline-block;
}
.store-badge:hover {
transform: scale(1.05);
}
/* Demo container */
.demo-container {
background: #f8f9fa;
padding: 10px;
border-radius: 8px;
margin: 15px 0;
text-align: center;
}
.demo-gif {
width: 100%;
max-width: 250px;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
</style>
"""
|