pstream is dead; long live pstream taciturnaxolotl.github.io/pstream-ng/
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

Fixed the big casting btn

authored by

Chris and committed by
GitHub
f0736c60 47653c29

+95 -52
+95 -52
src/assets/css/index.css
··· 1 - @import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap'); 1 + @import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap"); 2 2 @tailwind base; 3 3 @tailwind components; 4 4 @tailwind utilities; ··· 33 33 user-select: none; 34 34 } 35 35 36 - html[data-no-scroll], html[data-no-scroll] body { 36 + html[data-no-scroll], 37 + html[data-no-scroll] body { 37 38 overflow: hidden; 38 39 } 39 40 ··· 93 94 --slider-progress-background: #8652bb; 94 95 } 95 96 96 - input[type=range].styled-slider { 97 + input[type="range"].styled-slider { 97 98 height: var(--slider-height); 98 99 -webkit-appearance: none; 99 100 appearance: none; 100 101 border-radius: var(--slider-border-radius); 101 - background: #1C161B; 102 + background: #1c161b; 102 103 } 103 104 104 105 /*progress support*/ 105 - input[type=range].styled-slider.slider-progress { 106 + input[type="range"].styled-slider.slider-progress { 106 107 --range: calc(var(--max) - var(--min)); 107 108 --ratio: calc((var(--value) - var(--min)) / var(--range)); 108 109 --sx: calc(0.5 * 1rem + var(--ratio) * (100% - 1rem)); 109 110 } 110 111 111 112 /*webkit*/ 112 - input[type=range].styled-slider::-webkit-slider-thumb { 113 + input[type="range"].styled-slider::-webkit-slider-thumb { 113 114 -webkit-appearance: none; 114 115 width: 1rem; 115 116 height: 1rem; 116 117 border-radius: var(--slider-border-radius); 117 - background: #FFFFFF; 118 + background: #ffffff; 118 119 border: none; 119 120 box-shadow: 0 0 2px #000000; 120 121 margin-top: calc(0.25em * 0.5 - 1rem * 0.5); 121 122 } 122 123 123 - input[type=range].styled-slider::-webkit-slider-runnable-track { 124 + input[type="range"].styled-slider::-webkit-slider-runnable-track { 124 125 height: var(--slider-height); 125 126 border: none; 126 127 box-shadow: none; 127 128 border-radius: var(--slider-border-radius); 128 129 } 129 130 130 - input[type=range].styled-slider::-webkit-slider-thumb:hover { 131 - background: #DCDCDC; 131 + input[type="range"].styled-slider::-webkit-slider-thumb:hover { 132 + background: #dcdcdc; 132 133 } 133 134 134 - input[type=range].styled-slider.slider-progress::-webkit-slider-runnable-track { 135 - background: linear-gradient(var(--slider-progress-background), var(--slider-progress-background)) 0/var(--sx) 100% no-repeat, #1C161B; 135 + input[type="range"].styled-slider.slider-progress::-webkit-slider-runnable-track { 136 + background: 137 + linear-gradient( 138 + var(--slider-progress-background), 139 + var(--slider-progress-background) 140 + ) 141 + 0 / var(--sx) 100% no-repeat, 142 + #1c161b; 136 143 } 137 144 138 145 /*mozilla*/ 139 - input[type=range].styled-slider::-moz-range-thumb { 146 + input[type="range"].styled-slider::-moz-range-thumb { 140 147 width: 1rem; 141 148 height: 1rem; 142 149 border-radius: var(--slider-border-radius); 143 - background: #FFFFFF; 150 + background: #ffffff; 144 151 border: none; 145 152 box-shadow: 0 0 2px #000000; 146 153 } 147 154 148 - input[type=range].styled-slider::-moz-range-track { 155 + input[type="range"].styled-slider::-moz-range-track { 149 156 height: var(--slider-height); 150 157 border: none; 151 158 border-radius: var(--slider-border-radius); 152 - background: #1C161B; 159 + background: #1c161b; 153 160 box-shadow: none; 154 161 } 155 162 156 - input[type=range].styled-slider::-moz-range-thumb:hover { 157 - background: #DCDCDC; 163 + input[type="range"].styled-slider::-moz-range-thumb:hover { 164 + background: #dcdcdc; 158 165 } 159 166 160 - input[type=range].styled-slider.slider-progress::-moz-range-track { 161 - background: linear-gradient(var(--slider-progress-background), var(--slider-progress-background)) 0/var(--sx) 100% no-repeat, #1C161B; 167 + input[type="range"].styled-slider.slider-progress::-moz-range-track { 168 + background: 169 + linear-gradient( 170 + var(--slider-progress-background), 171 + var(--slider-progress-background) 172 + ) 173 + 0 / var(--sx) 100% no-repeat, 174 + #1c161b; 162 175 } 163 176 164 177 /*ms*/ 165 - input[type=range].styled-slider::-ms-fill-upper { 178 + input[type="range"].styled-slider::-ms-fill-upper { 166 179 background: transparent; 167 180 border-color: transparent; 168 181 } 169 182 170 - input[type=range].styled-slider::-ms-fill-lower { 183 + input[type="range"].styled-slider::-ms-fill-lower { 171 184 background: transparent; 172 185 border-color: transparent; 173 186 } 174 187 175 - input[type=range].styled-slider::-ms-thumb { 188 + input[type="range"].styled-slider::-ms-thumb { 176 189 width: 1rem; 177 190 height: 1rem; 178 191 border-radius: var(--slider-border-radius); 179 - background: #FFFFFF; 192 + background: #ffffff; 180 193 border: none; 181 194 box-shadow: 0 0 2px #000000; 182 195 margin-top: 0; 183 196 box-sizing: border-box; 184 197 } 185 198 186 - input[type=range].styled-slider::-ms-track { 199 + input[type="range"].styled-slider::-ms-track { 187 200 height: var(--slider-height); 188 201 border-radius: var(--slider-border-radius); 189 - background: #1C161B; 202 + background: #1c161b; 190 203 border: none; 191 204 box-shadow: none; 192 205 box-sizing: border-box; 193 206 } 194 207 195 - input[type=range].styled-slider::-ms-thumb:hover { 196 - background: #DCDCDC; 208 + input[type="range"].styled-slider::-ms-thumb:hover { 209 + background: #dcdcdc; 197 210 } 198 211 199 - input[type=range].styled-slider.slider-progress::-ms-fill-lower { 212 + input[type="range"].styled-slider.slider-progress::-ms-fill-lower { 200 213 height: var(--slider-height); 201 214 border-radius: var(--slider-border-radius) 0 0 5px; 202 215 margin: -undefined 0 -undefined -undefined; ··· 226 239 } 227 240 228 241 .tabbable:focus-visible { 229 - outline: 2px solid theme('colors.themePreview.primary'); 230 - box-shadow: 0 0 10px theme('colors.themePreview.secondary'); 242 + outline: 2px solid theme("colors.themePreview.primary"); 243 + box-shadow: 0 0 10px theme("colors.themePreview.secondary"); 231 244 } 232 245 233 246 [dir="rtl"] .transform { 234 247 /* Invert horizontal X offset on transform (Tailwind RTL plugin does the rest) */ 235 - transform: translate(calc(var(--tw-translate-x) * -1), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important; 248 + transform: translate(calc(var(--tw-translate-x) * -1), var(--tw-translate-y)) 249 + rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) 250 + scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important; 236 251 } 237 252 [dir="ltr"] .transform { 238 253 /* default - otherwise it overwrites*/ 239 - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important; 254 + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) 255 + rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) 256 + scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important; 240 257 } 241 258 242 259 @keyframes jiggle { 243 - 0%, 100% { 260 + 0%, 261 + 100% { 244 262 transform: rotate(-1deg); 245 263 } 246 264 50% { ··· 256 274 position: relative; 257 275 mask-image: linear-gradient( 258 276 to right, 259 - rgba(0, 0, 0, 0), /* Left edge */ 260 - rgba(0, 0, 0, 1) 80px, /* visible after 80px */ 261 - rgba(0, 0, 0, 1) calc(100% - 80px), /* invisible 80px from right */ 262 - rgba(0, 0, 0, 0) 100% /* Right edge */ 277 + rgba(0, 0, 0, 0), 278 + /* Left edge */ rgba(0, 0, 0, 1) 80px, 279 + /* visible after 80px */ rgba(0, 0, 0, 1) calc(100% - 80px), 280 + /* invisible 80px from right */ rgba(0, 0, 0, 0) 100% /* Right edge */ 263 281 ); 264 282 -webkit-mask-image: linear-gradient( 265 283 to right, ··· 274 292 @media (max-width: 768px) { 275 293 .carousel-container { 276 294 mask-image: linear-gradient( 277 - to right, 278 - rgba(0, 0, 0, 0), /* Left edge */ 279 - rgba(0, 0, 0, 1) 20px, /* visible after 80px */ 280 - rgba(0, 0, 0, 1) calc(100% - 20px), /* invisible 80px from right */ 281 - rgba(0, 0, 0, 0) 100% /* Right edge */ 282 - ); 283 - -webkit-mask-image: linear-gradient( 284 - to right, 285 - rgba(0, 0, 0, 0), 286 - rgba(0, 0, 0, 1) 20px, 287 - rgba(0, 0, 0, 1) calc(100% - 20px), 288 - rgba(0, 0, 0, 0) 100% 289 - ); 295 + to right, 296 + rgba(0, 0, 0, 0), 297 + /* Left edge */ rgba(0, 0, 0, 1) 20px, 298 + /* visible after 80px */ rgba(0, 0, 0, 1) calc(100% - 20px), 299 + /* invisible 80px from right */ rgba(0, 0, 0, 0) 100% /* Right edge */ 300 + ); 301 + -webkit-mask-image: linear-gradient( 302 + to right, 303 + rgba(0, 0, 0, 0), 304 + rgba(0, 0, 0, 1) 20px, 305 + rgba(0, 0, 0, 1) calc(100% - 20px), 306 + rgba(0, 0, 0, 0) 100% 307 + ); 290 308 } 291 309 } 292 310 ··· 350 368 } 351 369 } 352 370 353 - 354 371 .bookmark-button { 355 372 opacity: 0; 356 373 transition: opacity 0.3s; ··· 365 382 opacity: 0; 366 383 } 367 384 } 385 + 386 + .cast-button-container { 387 + position: relative; 388 + width: 40px; 389 + height: 40px; 390 + display: flex; 391 + align-items: center; 392 + justify-content: center; 393 + flex-shrink: 0; 394 + } 395 + 396 + .cast-button-container google-cast-launcher { 397 + width: 24px !important; 398 + height: 24px !important; 399 + min-width: 24px !important; 400 + min-height: 24px !important; 401 + display: block; 402 + } 403 + 404 + .google-cast-button.hidden { 405 + display: none; 406 + } 407 + 408 + .google-cast-button:not(.casting) google-cast-launcher { 409 + @apply brightness-[500]; 410 + }