Skip to content

Commit

Permalink
Pending changes exported from your codespace
Browse files Browse the repository at this point in the history
  • Loading branch information
@tommylbro
tommylbro committed Oct 1, 2024
1 parent 518c284 commit b521d91
Show file tree
Hide file tree
Showing 538 changed files with 66,195 additions and 40 deletions.
0 Songbook.cs → .gitnore
View file
File renamed without changes.
3 changes: 2 additions & 1 deletion .vscode/settings.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,5 +3,6 @@
"[autolisp]": {
"editor.wordSeparators": "`|;'\",()"
},
"liveServer.settings.port": 5502
"liveServer.settings.port": 5508,
"livePreview.defaultPreviewPath": "/index.html"
}
219 changes: 219 additions & 0 deletions Chatbox.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,219 @@
body {
min-height: 100vh;
line-height: 1.5;
font-family: 'Poppins', sans-serif;
background: linear-gradient(90deg, var(--grey) 31px, transparent 1px) 50%, linear-gradient(180deg, var(--grey) 31px, var(--blue) 1px) 50%;
background-size: 32px 32px
color: var(--dark);
}
/* Set shorter line heights on headings and interactive elements */
h1, h2, h3, h4,
button, input, label {
line-height: 1.1;
}

/* Balance text wrapping on headings */
h1, h2,
h3, h4 {
text-wrap: balance;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
text-decoration-skip-ink: auto;
color: currentColor;
}

/* Make images easier to work with */
img,
picture {
max-width: 100%;
display: block;
}

/* Inherit fonts for inputs and buttons */
input, button,
textarea, select {
font-family: inherit;
font-size: inherit;
}

/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {
min-height: 10em;
}

/* Anything that has been anchored to should have extra scroll margin */
:target {
scroll-margin-block: 5ex;
}

/* GLOBAL STYLES */

/* CHATBOX */
.chatbox-wrapper {
position: fixed;
bottom: 2rem;
right: 2rem;
width: 4rem;
height: 4rem;
}
.chatbox-toggle {
width: 100%;
height: 100%
background: var(--blue);
color: var(--white);
font-size: 2rem;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
cursor: pointer;
transition: .2s;
}
.chatbox-toggle:active {
transform: scale(.9);
}
.chatbox-message-wrapper {
position: absolute;
bottom: calc(100% + 1rem);
right: 0;
width: 420px;
border-radius: 5rem;
overflow: hidden;
box-shadow: .5rem .5rem 2rem rgba(0, 0, 0, .1);
transform: scale(0);
transform-origin: bottom right;
transition: .2s;
}
.chatbox-message-wrapper-show {
transform: scale(1);
}
.chatbox-message-header {
display: flex;
align-items: center;
justify-content: space-between;
background: var(--white)
padding: .75rem 1.5rem;
}
.chatbox-message-profile {
display: flex;
align-items: center;
grid-gap: 5rem;
}
.chatbox-message-image {
width: 3rem;
height: 3rem;
object-fit: cover;
border-radius: 50%;
}
.chatbox-message-name {
font-size: 1.125rem;
font-weight: 600
}
.chatbox-message-status {
font-size: .875rem;
color: var(--grey-d-3);
}
.chatbox-message-dropdown {
position: relative;
}
.chatbox-message-dropdown-toggle {
display: flex;
justify-content: center;
align-items: center;
width: 2.5rem;
height: 2.5rem;
font-size: 1.25rem;
cursor: pointer;
border-radius: 50%;
}
.chatbox-message-dropdown-toggle:hover {
background: var(--grey);
}
.chatbox-message-dropdown-menu {
list-style: none;
margin: 0;
position: absolute;
top: 100%;
right: 0;
background: var(--white);
padding: .5rem 0;
width: 120px;
box-shadow: .25rem .25rem 1.5rem rgba(0, 0, 0, 1);
transform: scale(0);
transform-orgin: top right;
transition: .2s;
}
.chatbox-message-dropdown-menu-show {
transform: scale(1);
}
.chatbox-message-dropdown-menu a {
font-size: .875rem;
font-weight: 500;
color: var(--dark);
text-decoration: none;
padding: .5rem 1rem;
display: black;
}
.chatbox-message-dropdown-menu a:hover {
background: var(--grey);
}
.chatbox-message-content {
background: var(--grey);
padding: 1.5rem;
display: flex;
flex-direction: column;
grid-row-gap: 1rem;
}
.chatbox-message-item {
width: 90%;
padding: 1rem;
}
.chatbox-message-item-sent {
align-self: flex-end;
background: var(--blue);
color: var(--white);
border-radius:.75rem 0 .75rem .75rem;
}
.chatbox-message-item-received {
background: var(--white);
border-radius: 0 .75rem .75rem .75rem;
box-shadow: .25rem .25rem 1.5rem rgba(0, 0, 0, .05));
}
.chatbox-message-item-time {
float: right;
font-size: .75rem;
margin-top: .5rem;
display: inline-block;
}
.chatbox-message-bottom {
background: var(--white);
padding: .75rem 1.5rem;
}
.chatbox-message-form {
display: flex;
align-items: center;
background: var(--grey);
border-radius: .5rem;
padding: .5rem 1.25rem;
}
.chatbox-message-input {
background: transparent;
outline: none;
border: none;
resize: none;
scrollbar-width: none;
}
.chatbox-message-input::-webkit-scrollbar {
display: none;
}
.chatbox-message-submit {
font-size: 1.25rem;
color: var(--blue);
background: transparent;
border: none;
outline: none;
cursor: pointer;
}
/* CHATBOX */
63 changes: 63 additions & 0 deletions Chatbox.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<meta name="viewport"78 content="width=device-width, initial-scale=1">
<link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
<link rel='stylesheet', href="Chatbox.css";>
<title>Chatbox</title>
</head>

<body>
<div class="chatbox-wrapper">
<div class="chatbox-toggle">
<box-icon name='message-rounded'></box-icon>
</div>
<div class="chatbox-message-wrapper">
<div class="chatbox-message-header">
<div class="chatbox-message-profile">
<img src="/14720ace-9547-4e98-bcc8-fd32c586520a2021-10-26_WZ_Shutdown_Socialmedia_TNT_News_Header_895x300.jpg" alt=""class="chatbox-message-image">
<div>
<h4 class="chatbox-message-name">tommylbro</h4>
<p class="chatbox-message-status">online</p>
</div>
</div>
<div class="chatbox-message-dropdown">
<box-icon name='dots-vertical-rounded'></box-icon>
<ul class="chatbox-message-dropdown-menu">
<li>
<a href="#">Search</a>
</li>
<li>
<a href="#">Report</a>
</li>
</ul>
</div>

<div class="chatbox-message-item sent">
<span class="chatbox-message-item-text">
Lorem ipsum, dolor sit amet consectetur adipisicing elit. quod, fugiat?
</span>
<span class="chatbox-message-item-time">08:30</span>
</div>
<div class="chatbox-message-item received">
<span class="chatbox-message-item-text">
Lorem ipsum, dolor sit amet consectetur adipisicing elit. quod, fugiat?
</span>
<span class="chatbox-message-item-time">08:30</span>
</div>
</div>
<div class="chatbox-message-button">
<form action="#" class="chatbox-message-form">
<<textarea rows="1" placeholder="type message..." class="chatbox-message-item-input"></textarea>
<button type="submit" class="chatbox-message-submit"<box-icon name='send'></box-icon></button>
></button>
</form>
</div>
</div>
</div>

<script src="script.js"></script>
</body>
</html>
13 changes: 13 additions & 0 deletions JasmineThompson.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home</title>
</head>
<body>
<h1>Welcome to the Home Page</h1>
<a href="UkuleleSongbook.html">Go to Page 1</a>
<a href="JasmineThompson.html">Go to Page 2</a>
</body>
</html>
56 changes: 56 additions & 0 deletions Jasmine_Thompson.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
<!DOCTYPE html>

<html>
<head>

<title>You Are My Sunshine</title>
<p>Artist: Jasmine Thompson</p>

</head>

<body>

<li><a href="index.html">Page 1</a></li>

<start_of_verse Verse 1>
A|-----------------------------------2------
E|------------3--------3--------------------
C|---2---2--------2--------2---2--------2--
G|-------------------------------------------

The other night, dear - As I lay sleeping - I dreamed I held you in my arms - When I awoke, dear - I was mistaken - So I hung my head and I cried
</end_of_verse>

<start_of_chorus Chorus 1>
A|-----------------------------------2------
E|------------3--------3--------------------
C|---2---2--------2--------2---2--------2--
G|-------------------------------------------

You are my sunshine - My only sunshine - You make me happy when skies are gray - You'll never know, dear - How much I love you - Please don't take my sunshine away
</end_of_chorus>

<start_of_verse Verse 2>
A|-----------------------------------2-------
E|------------3--------3---------------------
C|---2---2--------2--------2---2---------2--
G|---0---------------------------------------

I'll always love you - And make you happy - And nothing else could come between - But if you leave me - To love another - You'll have shattered all of my dreams
</end_of_verse>

<start_of_chorus Chorus 2>
A|-----------------------------------2-------
E|------------3--------3---------------------
C|---2---2--------2--------2---2---------2--
G|--------------------------------------------

You are my sunshine - My only sunshine - You make me happy when skies are gray - You'll never know, dear - How much I love you - Please don't take my sunshine away
</end_of_chorus>

</body>

</html>
{x_sccrd_g:9;;9§2;1;0;0€2;;2§2;2;2;0€7;;7§0;2;3;2}
{x_sccrd_n:You Are My Sunshine - Jasmine Thompson}
{x_sccrd_zm:183}
Loading

0 comments on commit b521d91

Please sign in to comment.