Move CSS to individual files
This commit is contained in:
parent
1bf1b0bbfe
commit
844a5c3ead
109
app/static/css/about.css
Normal file
109
app/static/css/about.css
Normal file
@ -0,0 +1,109 @@
|
||||
/* Import Montserrat font */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap');
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
|
||||
/* Navbar styles */
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #212223;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.5rem;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin-right: 15%;
|
||||
}
|
||||
|
||||
/* Navbar media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
nav a {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right a {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Container styles */
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 1.75rem;
|
||||
text-align: center;
|
||||
width: 600px;
|
||||
}
|
||||
|
||||
/* Continer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.container {
|
||||
font-size: 1.25rem;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.container p {
|
||||
margin: 1rem 0 2rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Footer styles */
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
margin-bottom: 2rem;
|
||||
width: 90vw;
|
||||
}
|
||||
|
||||
/* Footer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
footer {
|
||||
bottom: -2rem;
|
||||
}
|
||||
}
|
186
app/static/css/contact.css
Normal file
186
app/static/css/contact.css
Normal file
@ -0,0 +1,186 @@
|
||||
/* Import Montserrat font */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap');
|
||||
|
||||
* {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
|
||||
/* Navbar styles */
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #212223;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.5rem;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin-right: 15%;
|
||||
}
|
||||
|
||||
/* Navbar media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
nav a {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right a {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Container styles */
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 1.75rem;
|
||||
text-align: center;
|
||||
border: 1px solid #9F9FAA;
|
||||
border-radius: 5px;
|
||||
padding: 2rem;
|
||||
height: 450px;
|
||||
width: 550px;
|
||||
}
|
||||
|
||||
.container h1 {
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
/* Continer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.container {
|
||||
font-size: 1.25rem;
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
.container h1 {
|
||||
margin: 0 0 2rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Form styles */
|
||||
form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
input {
|
||||
margin: 0.75rem 0;
|
||||
padding: 0.5rem 1rem;
|
||||
border: 1px solid #9F9FAA;
|
||||
border-radius: 5px;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.25rem;
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
width: calc(500px + 2rem);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
textarea {
|
||||
margin: 0.75rem 0;
|
||||
padding: 0.5rem 1rem;
|
||||
border: 1px solid #9F9FAA;
|
||||
border-radius: 5px;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.25rem;
|
||||
height: 100px;
|
||||
width: 500px;
|
||||
resize: none;
|
||||
}
|
||||
|
||||
/* Form media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
input {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
width: calc(250px + 2rem);
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Success/Error messages */
|
||||
.success-message {
|
||||
color: #71A172;
|
||||
font-size: 1.25rem;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.error-message {
|
||||
color: #B16161;
|
||||
font-size: 1.25rem;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
|
||||
/* Footer styles */
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
margin-bottom: 2rem;
|
||||
width: 90vw;
|
||||
}
|
||||
|
||||
/* Footer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
footer {
|
||||
bottom: -2rem;
|
||||
}
|
||||
}
|
137
app/static/css/index.css
Normal file
137
app/static/css/index.css
Normal file
@ -0,0 +1,137 @@
|
||||
/* Import Montserrat font */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap');
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
|
||||
/* Navbar styles */
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #212223;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.5rem;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin-right: 15%;
|
||||
}
|
||||
|
||||
/* Navbar media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
nav a {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right a {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Container styles */
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 1.75rem;
|
||||
text-align: center;
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
.container h1 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.container p {
|
||||
margin: 2rem 0 3rem 0;
|
||||
}
|
||||
|
||||
.icons {
|
||||
margin: 0 1rem;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
.icons:hover {
|
||||
cursor: pointer;
|
||||
opacity: 0.6;
|
||||
transition: opacity 0.25s ease-in-out;
|
||||
|
||||
}
|
||||
|
||||
/* Continer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.container {
|
||||
font-size: 1.5rem;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.container p {
|
||||
margin: 1rem 0 2rem 0;
|
||||
}
|
||||
|
||||
.icons {
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Footer styles */
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
margin-bottom: 2rem;
|
||||
width: 90vw;
|
||||
}
|
||||
|
||||
/* Footer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
footer {
|
||||
bottom: -2rem;
|
||||
}
|
||||
}
|
114
app/static/css/pgp.css
Normal file
114
app/static/css/pgp.css
Normal file
@ -0,0 +1,114 @@
|
||||
/* Import Montserrat font */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap');
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
|
||||
/* Navbar styles */
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #212223;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.5rem;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin-right: 15%;
|
||||
}
|
||||
|
||||
/* Navbar media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
nav a {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right a {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Container styles */
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 1.25rem;
|
||||
text-align: center;
|
||||
width: 600px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.container p {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/* Continer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.container {
|
||||
font-size: 1.25rem;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.container p {
|
||||
margin: 1rem 0 2rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Footer styles */
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
margin-bottom: 2rem;
|
||||
width: 90vw;
|
||||
}
|
||||
|
||||
/* Footer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
footer {
|
||||
bottom: -2rem;
|
||||
}
|
||||
}
|
@ -8,6 +8,7 @@
|
||||
<!-- Encourage indexing -->
|
||||
<meta name="robots" content="index, follow">
|
||||
|
||||
<link rel="stylesheet", href="{{ url_for('static', filename='css/about.css') }}">
|
||||
<meta property="og:title" content="About Me | pkrm.dev"/>
|
||||
<meta property="og:url" content="https://pkrm.dev"/>
|
||||
<meta property="og:type" content="website"/>
|
||||
@ -33,116 +34,4 @@
|
||||
|
||||
<footer>PGP Fingerprint: 58B7 6B8B BAB8 794D 21E2 579C 95CD 2E0C 7E32 9F2A</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
/* Import Montserrat font */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap');
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
|
||||
/* Navbar styles */
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #212223;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.5rem;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin-right: 15%;
|
||||
}
|
||||
|
||||
/* Navbar media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
nav a {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right a {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Container styles */
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 1.75rem;
|
||||
text-align: center;
|
||||
width: 600px;
|
||||
}
|
||||
|
||||
/* Continer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.container {
|
||||
font-size: 1.25rem;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.container p {
|
||||
margin: 1rem 0 2rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Footer styles */
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
margin-bottom: 2rem;
|
||||
width: 90vw;
|
||||
}
|
||||
|
||||
/* Footer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
footer {
|
||||
bottom: -2rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</html>
|
@ -9,8 +9,9 @@
|
||||
<meta name="robots" content="index, follow">
|
||||
|
||||
<!-- Add altcha.js file -->
|
||||
<script async defer src="{{ url_for('static', filename='altcha.js') }}" type="module"></script>
|
||||
<script async defer src="{{ url_for('static', filename='js/altcha.js') }}" type="module"></script>
|
||||
|
||||
<link rel="stylesheet", href="{{ url_for('static', filename='css/contact.css') }}">
|
||||
<meta property="og:title" content="Contact | pkrm.dev"/>
|
||||
<meta property="og:url" content="https://pkrm.dev/contact"/>
|
||||
<meta property="og:type" content="website"/>
|
||||
@ -54,199 +55,6 @@
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
/* Import Montserrat font */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap');
|
||||
|
||||
* {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
|
||||
/* Navbar styles */
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #212223;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.5rem;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin-right: 15%;
|
||||
}
|
||||
|
||||
/* Navbar media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
nav a {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right a {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Container styles */
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 1.75rem;
|
||||
text-align: center;
|
||||
border: 1px solid #9F9FAA;
|
||||
border-radius: 5px;
|
||||
padding: 2rem;
|
||||
height: 450px;
|
||||
width: 550px;
|
||||
}
|
||||
|
||||
.container h1 {
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
/* Continer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.container {
|
||||
font-size: 1.25rem;
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
.container h1 {
|
||||
margin: 0 0 2rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Form styles */
|
||||
form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
input {
|
||||
margin: 0.75rem 0;
|
||||
padding: 0.5rem 1rem;
|
||||
border: 1px solid #9F9FAA;
|
||||
border-radius: 5px;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.25rem;
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
width: calc(500px + 2rem);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
textarea {
|
||||
margin: 0.75rem 0;
|
||||
padding: 0.5rem 1rem;
|
||||
border: 1px solid #9F9FAA;
|
||||
border-radius: 5px;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.25rem;
|
||||
height: 100px;
|
||||
width: 500px;
|
||||
resize: none;
|
||||
}
|
||||
|
||||
/* Form media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
input {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
width: calc(250px + 2rem);
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
altcha-widget {
|
||||
visibility: none;
|
||||
}
|
||||
|
||||
/* Success/Error messages */
|
||||
.success-message {
|
||||
color: #71A172;
|
||||
font-size: 1.25rem;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.error-message {
|
||||
color: #B16161;
|
||||
font-size: 1.25rem;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
|
||||
/* Footer styles */
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
margin-bottom: 2rem;
|
||||
width: 90vw;
|
||||
}
|
||||
|
||||
/* Footer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
footer {
|
||||
bottom: -2rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
// Get the form
|
||||
const form = document.querySelector('form');
|
||||
|
@ -8,6 +8,7 @@
|
||||
<!-- Encourage indexing -->
|
||||
<meta name="robots" content="index, follow">
|
||||
|
||||
<link rel="stylesheet", href="{{ url_for('static', filename='css/index.css') }}">
|
||||
<meta property="og:title" content="Home | pkrm.dev"/>
|
||||
<meta property="og:url" content="https://pkrm.dev/"/>
|
||||
<meta property="og:type" content="website"/>
|
||||
@ -39,144 +40,4 @@
|
||||
|
||||
<footer>PGP Fingerprint: 58B7 6B8B BAB8 794D 21E2 579C 95CD 2E0C 7E32 9F2A</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
/* Import Montserrat font */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap');
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
|
||||
/* Navbar styles */
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #212223;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.5rem;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin-right: 15%;
|
||||
}
|
||||
|
||||
/* Navbar media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
nav a {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right a {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Container styles */
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 1.75rem;
|
||||
text-align: center;
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
.container h1 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.container p {
|
||||
margin: 2rem 0 3rem 0;
|
||||
}
|
||||
|
||||
.icons {
|
||||
margin: 0 1rem;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
.icons:hover {
|
||||
cursor: pointer;
|
||||
opacity: 0.6;
|
||||
transition: opacity 0.25s ease-in-out;
|
||||
|
||||
}
|
||||
|
||||
/* Continer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.container {
|
||||
font-size: 1.5rem;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.container p {
|
||||
margin: 1rem 0 2rem 0;
|
||||
}
|
||||
|
||||
.icons {
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Footer styles */
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
margin-bottom: 2rem;
|
||||
width: 90vw;
|
||||
}
|
||||
|
||||
/* Footer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
footer {
|
||||
bottom: -2rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</html>
|
@ -8,6 +8,7 @@
|
||||
<!-- Encourage indexing -->
|
||||
<meta name="robots" content="index, follow">
|
||||
|
||||
<link rel="stylesheet", href="{{ url_for('static', filename='css/pgp.css') }}">
|
||||
<meta property="og:title" content="PGP Key | pkrm.dev"/>
|
||||
<meta property="og:url" content="https://pkrm.dev/pgp"/>
|
||||
<meta property="og:type" content="website"/>
|
||||
@ -53,123 +54,6 @@
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
/* Import Montserrat font */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap');
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
background-color: #242528;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
|
||||
/* Navbar styles */
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #212223;
|
||||
color: #9F9FAA;
|
||||
}
|
||||
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
color: #9F9FAA;
|
||||
font-size: 1.5rem;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
margin-left: 15%;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin-right: 15%;
|
||||
}
|
||||
|
||||
/* Navbar media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
nav a {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.navbar-right a {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Container styles */
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 1.25rem;
|
||||
text-align: center;
|
||||
width: 600px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.container p {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/* Continer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.container {
|
||||
font-size: 1.25rem;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.container p {
|
||||
margin: 1rem 0 2rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Footer styles */
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
margin-bottom: 2rem;
|
||||
width: 90vw;
|
||||
}
|
||||
|
||||
/* Footer media query for mobile */
|
||||
@media only screen and (max-width: 600px) {
|
||||
footer {
|
||||
bottom: -2rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
// Get the h1
|
||||
const h1 = document.querySelector('h1');
|
||||
|
Loading…
x
Reference in New Issue
Block a user