Compare commits

..

7 Commits
2.2.1 ... 2.2.6

Author SHA1 Message Date
David Miller
eb9b5d0980 v2.2.6 2022-03-26 22:44:21 +08:00
David Miller
b15b6361df v2.2.5 2022-03-25 21:10:17 +08:00
David Miller
e337c08da0 v2.2.4 2022-03-25 21:06:48 +08:00
David Miller
b6c51fcca0 v2.2.3 2022-03-15 22:33:56 +08:00
David Miller
8469aee00d Merge branch 'main' of https://github.com/CitizenBeta2/HomePage 2022-03-12 08:06:56 +08:00
David Miller
aed0bf7463 v2.2.2 2022-03-12 08:06:52 +08:00
David Miller
d43c7d390d Update CNAME 2022-03-10 21:20:20 +08:00
5 changed files with 8 additions and 299 deletions

2
CNAME
View File

@@ -1 +1 @@
github.www.davidmiller.top github.davidmiller.top

View File

@@ -94,72 +94,4 @@
}, settings.delay); }, settings.delay);
})(); })();
// Signup Form.
(function() {
// Vars.
var $form = document.querySelectorAll('#signup-form')[0],
$submit = document.querySelectorAll('#signup-form input[type="submit"]')[0],
$message;
// Bail if addEventListener isn't supported.
if (!('addEventListener' in $form))
return;
// Message.
$message = document.createElement('span');
$message.classList.add('message');
$form.appendChild($message);
$message._show = function(type, text) {
$message.innerHTML = text;
$message.classList.add(type);
$message.classList.add('visible');
window.setTimeout(function() {
$message._hide();
}, 3000);
};
$message._hide = function() {
$message.classList.remove('visible');
};
// Events.
// Note: If you're *not* using AJAX, get rid of this event listener.
$form.addEventListener('submit', function(event) {
event.stopPropagation();
event.preventDefault();
// Hide message.
$message._hide();
// Disable submit.
$submit.disabled = true;
// Process form.
// Note: Doesn't actually do anything yet (other than report back with a "thank you"),
// but there's enough here to piece together a working AJAX submission call that does.
window.setTimeout(function() {
// Reset form.
$form.reset();
// Enable submit.
$submit.disabled = false;
// Show message.
$message._show('success', 'Thank you!');
//$message._show('failure', 'Something went wrong. Please try again.');
}, 750);
});
})();
})(); })();

View File

@@ -1,221 +0,0 @@
/* Form */
form {
margin: 0 0 _size(element-margin) 0;
.message {
@include icon(false, solid);
@include vendor('transition', (
'opacity #{_duration(transition)} ease-in-out',
'transform #{_duration(transition)} ease-in-out'
));
@include vendor('transform', 'scale(1.05)');
height: _size(element-height);
line-height: _size(element-height);
opacity: 0;
&:before {
margin-right: 0.5em;
}
&.visible {
@include vendor('transform', 'scale(1)');
opacity: 1;
}
&.success {
color: _palette(positive, bg);
&:before {
content: '\f00c';
}
}
&.failure {
color: _palette(negative, bg);
&:before {
content: '\f119';
}
}
}
}
label {
color: _palette(fg-bold);
display: block;
font-size: 0.9em;
font-weight: _font(weight-bold);
margin: 0 0 (_size(element-margin) * 0.5) 0;
}
@include keyframes(focus) {
0% { @include vendor('transform', 'scale(1)'); }
50% { @include vendor('transform', 'scale(1.025)'); }
100% { @include vendor('transform', 'scale(1)'); }
}
input[type="text"],
input[type="password"],
input[type="email"],
select,
textarea {
@include vendor('appearance', 'none');
@include vendor('transform', 'scale(1)');
@include vendor('transition', (
'border-color #{_duration(transition)} ease',
'background-color #{_duration(transition)} ease'
));
background-color: transparent;
border-radius: _size(border-radius);
border: none;
border: solid _size(border-width) _palette(border);
color: inherit;
display: block;
outline: 0;
padding: 0 1em;
text-decoration: none;
width: 100%;
&:invalid {
box-shadow: none;
}
&:focus {
@include vendor('animation', 'focus 0.1s');
background-color: _palette(border-bg);
border-color: _palette(accent, bg);
}
}
select {
background-image: svg-url("<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'><path d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='#{_palette(border)}' /></svg>");
background-size: 1.25rem;
background-repeat: no-repeat;
background-position: calc(100% - 1rem) center;
height: _size(element-height);
padding-right: _size(element-height);
text-overflow: ellipsis;
option {
color: _palette(fg-bold);
background: _palette(bg);
}
&:focus {
&::-ms-value {
background-color: transparent;
}
}
&::-ms-expand {
display: none;
}
}
input[type="text"],
input[type="password"],
input[type="email"],
select {
height: _size(element-height);
}
textarea {
padding: 0.75em 1em;
}
input[type="checkbox"],
input[type="radio"], {
@include vendor('appearance', 'none');
display: block;
float: left;
margin-right: -2em;
opacity: 0;
width: 1em;
z-index: -1;
& + label {
@include icon(false, solid);
color: _palette(fg);
cursor: pointer;
display: inline-block;
font-size: 1em;
font-weight: _font(weight);
padding-left: (_size(element-height) * 0.6) + 0.75em;
padding-right: 0.75em;
position: relative;
&:before {
background: _palette(border-bg);
border-radius: _size(border-radius);
border: solid _size(border-width) _palette(border);
content: '';
display: inline-block;
font-size: 0.8em;
height: (_size(element-height) * 0.6);
left: 0;
line-height: (_size(element-height) * 0.6);
position: absolute;
text-align: center;
top: 0;
width: (_size(element-height) * 0.6);
}
}
&:checked + label {
&:before {
background: _palette(accent, bg);
border-color: _palette(accent, bg);
color: _palette(accent, fg-bold);
content: '\f00c';
}
}
&:focus + label {
&:before {
border-color: _palette(accent, bg);
box-shadow: 0 0 0 _size(border-width) _palette(accent, bg);
}
}
}
input[type="checkbox"] {
& + label {
&:before {
border-radius: _size(border-radius);
}
}
}
input[type="radio"] {
& + label {
&:before {
border-radius: 100%;
}
}
}
::-webkit-input-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}
:-moz-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}
::-moz-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}
:-ms-input-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}
.formerize-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}

View File

@@ -31,11 +31,9 @@
@import 'components/icon'; @import 'components/icon';
@import 'components/list'; @import 'components/list';
@import 'components/icons'; @import 'components/icons';
@import 'components/form';
@import 'components/button'; @import 'components/button';
// Layout. // Layout.
@import 'layout/header'; @import 'layout/header';
@import 'layout/signup-form';
@import 'layout/footer'; @import 'layout/footer';

View File

@@ -2,7 +2,7 @@
<html> <html>
<head> <head>
<title>David Miller's HomePage</title> <title>David Miller's Homepage</title>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="assets/css/main.css" /> <link rel="stylesheet" href="assets/css/main.css" />
@@ -10,9 +10,8 @@
<body class="is-preload"> <body class="is-preload">
<!-- Header --> <!-- Header -->
<header id="header"> <header id="header">
<h1>David Miller's HomePage</h1> <h1>David Miller's Homepage</h1>
<p>A High School Student from Beijing, China<br/> <p>A High School Student from Beijing, China</p>
Click the links below for further exploration</p>
</header> </header>
<!-- Footer --> <!-- Footer -->
@@ -25,12 +24,13 @@
<li><a href="https://img.davidmiller.top/qq.jpg" class="icon brands fa-qq"><span class="label">QQ</span></a></li> <li><a href="https://img.davidmiller.top/qq.jpg" class="icon brands fa-qq"><span class="label">QQ</span></a></li>
<li><a href="https://pki.davidmiller.top" class="icon solid fa-key"><span class="label">PKI</span></a></li> <li><a href="https://pki.davidmiller.top" class="icon solid fa-key"><span class="label">PKI</span></a></li>
<li><a href="https://www.facebook.com/CitizenBeta2" class="icon brands fa-facebook"><span class="label">Facebook</span></a></li> <li><a href="https://www.facebook.com/CitizenBeta2" class="icon brands fa-facebook"><span class="label">Facebook</span></a></li>
<li><a href="https://steam.davidmiller.top" class="icon brands fa-steam"><span class="label">Steam</span></a></li> <li><a href="https://steamcommunity.com/id/CitizenBeta3/" class="icon brands fa-steam"><span class="label">Steam</span></a></li>
</ul> </ul>
<ul class="copyright"> <ul class="copyright">
<li>&copy; David Miller.</li> <li>&copy; David Miller.</li>
<li>Credits: <a href="https://github.com/CitizenBeta2/HomePage">GitHub Repository</a></li> <li><a href="https://status.davidmiller.top/">System Status</a></li>
<li><a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802035614" target="_blank">京公网安备 11010802035614号</a> <a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2021023756号-1</a></li> <li><a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802035614" target="_blank">京公网安备 11010802035614号</a></li>
<li><a href="https://beian.miit.gov.cn/" target="_blank">京ICP备2021023756号-1</a></li>
</ul> </ul>
</footer> </footer>