Skip to content

Instantly share code, notes, and snippets.

@LiorB-D
Created June 21, 2022 10:39
Show Gist options
  • Save LiorB-D/38e5f0d86952a0f5459ccb28c15061c5 to your computer and use it in GitHub Desktop.
Save LiorB-D/38e5f0d86952a0f5459ccb28c15061c5 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<style>
.box-container {
display: flex;
flex-wrap: wrap;
}
.box {
height: 200px;
/* min-width: 200px; */
background: greenyellow;
border-radius: 8px;
flex: 0 0 202px;
margin: 8px;
display: flex;
justify-content: center;
align-items: center;
font-size: 32px;
}
snippyly-comment-tool .add-comment-btn img {
width: 1.5rem;
height: 1.5rem;
}
</style>
</head>
<body>
<snippyly-cursor></snippyly-cursor>
<snippyly-comments></snippyly-comments>
<snippyly-comments-sidebar></snippyly-comments-sidebar>
<snippyly-comment-tool>
<div class="add-comment-btn">
<img
src="https://cdn-icons-png.flaticon.com/512/727/727570.png"
alt="Add comment"
/>
</div>
</snippyly-comment-tool>
<div>
<div>
<snippyly-presence></snippyly-presence>
</div>
<div>
<div id="userDetailsContainer">
<span id="userDetails"></span>
<button class="custom-btn" onclick="signOut()">Sign Out</button>
</div>
<div id="loginContainer">
<span>Sign In With:</span>
<button onclick='signIn("1")'>James Smith</button>
<button onclick='signIn("2")'>Maria Garcia</button>
<button onclick='signIn("3")'>Sarah Wilson</button>
</div>
</div>
</div>
<div class="box-container" id="boxContainer1">
<div class="box" id="box1"><span>1</span></div>
<div class="box" id="box2"><span>2</span></div>
<div class="box" id="box3"><span>3</span></div>
<div class="box" id="box4"><span>4</span></div>
<div class="box" id="box5"><span>5</span></div>
</div>
<script
type="module"
src="https://cdn.jsdelivr.net/npm/@snippyly/sdk@1.0.36/snippyly.js"
onload="loadSnippyly()"
></script>
<script type="text/javascript" src="./script.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment