This project is intended to be use as a browser source in OBS.
- Create a browser source using the following URL:
https://njallam.github.io/stream-pomodoro/- To customise the focus and break time lengths use the following URL instead:
https://njallam.github.io/stream-pomodoro/?pomodoro=45&shortBreak=10&longBreak=15(replacing45,10and15with minute values as desired.)
- To customise the focus and break time lengths use the following URL instead:
- To interact with the timer, right click the source in OBS and click "Interact".
- You can use Custom CSS to customise the look of the timer. See below for examples.
body {
background-color: rgba(0, 0, 0, 0);
font-family: 'Comic Sans MS';
}Set the value of font-family (in this case Comic Sans MS) to the exact name of any font installed on your computer.
body {
background-color: rgba(0, 0, 0, 0);
color: black;
}
#progress-value {
background-color: black
}Use the above CSS to change the default white text colour to black. You can also replace black above with another CSS colour keyword. The first instance is for the text colour, the second is for the progress bar.
To additionally have a custom font, simply copy the font-family line from Custom Font below the color line above.
body {
background-color: rgba(0, 0, 0, 0);
color: black;
font-family: 'Comic Sans MS';
}
#progress-value {
background-color: black
}