ktyl
/
singularity
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style: finish desktop for intro sequence

This commit is contained in:
Cat Flynn 2024-08-10 14:43:01 +01:00
parent 264ad19cb1
commit ffd3296630
3 changed files with 21 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
index.html
View File

@ -11,10 +11,9 @@
<body>
<div id="start-splash">
<img class="center" src="oct.jpg"></img>
<input class="center" type="text" id="username" placeholder="Choose a username!" onkeyup="usernameInputUpdated(event)"></input>
<!--<ul class="center" id="interest-selection"></ul>-->
<a id="advance-button" class="center" href="#" onclick="advanceSplash()">Choose some interests!</a>
<h1>welcome to the singularity.</h1>
<input class="center" type="text" id="username" placeholder="choose a username." onkeyup="usernameInputUpdated(event)"></input>
<a id="advance-button" class="center" href="#" onclick="advanceSplash()">next.</a>
</div>
<!-- blocks are added by JavaScript so container starts empty -->

15
main.js
View File

@ -55,6 +55,10 @@ const postCountElem = document.getElementById("post-count");
const postTotalElem = document.getElementById("post-total");
const loader = document.getElementById("loader");
// some state
var isWritingPost = false;
var isWritingReply = false;
// define a variable for how many posts we want to increase the page by
const postIncrease = 9;
// and define a value to determine which page we're on
@ -331,9 +335,6 @@ function getWritePostButtonText() {
return `Write something ${getAdjective()} for me!`;
}
var isWritingPost = false;
var isWritingReply = false;
function writePost() {
if (isWritingPost)
return;
@ -452,7 +453,7 @@ function chooseInterest(interest) {
}
const advanceButtonElem = document.getElementById("advance-button");
advanceButtonElem.innerHTML = "Begin!";
advanceButtonElem.innerHTML = "enter.";
advanceButtonElem.style.visibility = "visible";
interestsTextElem.remove();
@ -508,7 +509,11 @@ function populateSplashInterests() {
}
function getInterestsTextValue(numChosenInterests) {
return `Choose some interests! (${numChosenInterests}/${maxInterests})`;
const leftToChoose = maxInterests - numChosenInterests;
if (leftToChoose > 1)
return `choose ${leftToChoose} interests.`;
return "choose 1 interest.";
}
function usernameInputUpdated(event) {

15
styles.css
View File

@ -46,23 +46,23 @@ body {
text-align: center;
}
#start-splash img {
max-width: 40vw;
margin-top: 10vh;
#start-splash h1 {
padding-top: 35vh;
display: flex;
justify-content: center;
}
#start-splash input {
margin: 2em auto;
border: none;
background-color: var(--sky-blue);
color: white;
color: var(--sky-blue);
border-radius: 16px;
font-size: 1.5em;
padding: 4px 8px;
}
#advance-button {
width: 20%;
width: 10%;
margin: 2em auto;
color: white;
background-color: var(--sky-blue);
@ -77,7 +77,8 @@ body {
}
#interest-selection {
width: 80%;
max-width: 400px;
min-width: 40%;
padding: 8px;
display: flex;
flex-wrap: wrap;