Reimar/whatsapp-send
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Extract stylesheet

Browse Source
This commit is contained in:
Reimar 2025-03-15 15:13:05 +01:00
parent 6b5443ee19
commit 9c73659cea
Signed by: Reimar
GPG Key ID: 93549FA07F0AE268
2 changed files with 96 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

97
index.html
View File

@ -6,6 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="theme-color" content="#3C503A" /> <meta name="theme-color" content="#3C503A" />
<link rel="manifest" href="webmanifest.json" /> <link rel="manifest" href="webmanifest.json" />
<link rel="stylesheet" href="style.css" />
<script> <script>
function getLink() { function getLink() {
var phone = document.getElementById("phone").value.replace(/\D/g, ""); var phone = document.getElementById("phone").value.replace(/\D/g, "");
@ -34,102 +35,6 @@
alert("Couldn't copy link to clipboard"); alert("Couldn't copy link to clipboard");
} }
</script> </script>
<style>
body {
background-color: #EFE9DD;
text-align: center;
font-family: sans-serif;
}
* {
-webkit-tap-highlight-color: transparent;
}
h1 {
margin-bottom: 0;
opacity: 0.7;
}
p {
opacity: 0.5;
font-size: 0.85rem;
max-width: 400px;
margin: 1rem auto;
}
summary {
opacity: 0.5;
font-size: 0.85rem;
margin: 0.5rem auto;
cursor: pointer;
user-select: none;
}
summary:focus {
outline: none;
opacity: 0.7;
}
#desc {
margin-top: 2rem;
font-size: 0.75rem;
}
.icon {
width: 1.25rem;
height: 1.25rem;
position: relative;
top: 0.25rem;
}
input, textarea {
padding: 0.5rem 1rem;
border-radius: 4px;
border: 1px solid rgba(0, 0, 0, 0.5);
transition: all 150ms;
font-size: 1rem;
}
textarea {
resize: vertical;
font-family: sans-serif;
font-size: 0.75rem;
width: 100%;
max-width: 400px;
box-sizing: border-box;
}
input:focus, textarea:focus {
outline: none;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
}
/* Used for copying to clipboard */
#copy-input {
opacity: 0;
pointer-events: none;
}
button {
background-color: inherit;
border: none;
margin: 0.25rem 0;
opacity: 0.5;
cursor: pointer;
transition: all 150ms;
}
button:hover, button:focus {
opacity: 1;
outline: none;
}
#send {
background-color: #1DAA61;
color: white;
border: none;
padding: 0.5rem 2rem;
margin-top: 1rem;
border-radius: 4px;
opacity: 1;
}
#send:active {
background-color: #18864D;
}
#send:focus {
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
}
</style>
</head> </head>
<body> <body>
<h1>Start a new WhatsApp chat</h1> <h1>Start a new WhatsApp chat</h1>

95
style.css Normal file
View File

@ -0,0 +1,95 @@
body {
background-color: #EFE9DD;
text-align: center;
font-family: sans-serif;
}
* {
-webkit-tap-highlight-color: transparent;
}
h1 {
margin-bottom: 0;
opacity: 0.7;
}
p {
opacity: 0.5;
font-size: 0.85rem;
max-width: 400px;
margin: 1rem auto;
}
summary {
opacity: 0.5;
font-size: 0.85rem;
margin: 0.5rem auto;
cursor: pointer;
user-select: none;
}
summary:focus {
outline: none;
opacity: 0.7;
}
#desc {
margin-top: 2rem;
font-size: 0.75rem;
}
.icon {
width: 1.25rem;
height: 1.25rem;
position: relative;
top: 0.25rem;
}
input, textarea {
padding: 0.5rem 1rem;
border-radius: 4px;
border: 1px solid rgba(0, 0, 0, 0.5);
transition: all 150ms;
font-size: 1rem;
}
textarea {
resize: vertical;
font-family: sans-serif;
font-size: 0.75rem;
width: 100%;
max-width: 400px;
box-sizing: border-box;
}
input:focus, textarea:focus {
outline: none;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
}
/* Used for copying to clipboard */
#copy-input {
opacity: 0;
pointer-events: none;
}
button {
background-color: inherit;
border: none;
margin: 0.25rem 0;
opacity: 0.5;
cursor: pointer;
transition: all 150ms;
}
button:hover, button:focus {
opacity: 1;
outline: none;
}
#send {
background-color: #1DAA61;
color: white;
border: none;
padding: 0.5rem 2rem;
margin-top: 1rem;
border-radius: 4px;
opacity: 1;
}
#send:active {
background-color: #18864D;
}
#send:focus {
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
}