Nikita Karamov
parent
630db8d4b2
commit
a22563ce6d
|
|
@ -0,0 +1,19 @@
|
|||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
end_of_line = lf
|
||||
indent_style = tab
|
||||
insert_final_newline = true
|
||||
max_line_length = 80
|
||||
trim_trailing_whitespace = true
|
||||
|
||||
[*.md]
|
||||
indent_size = 2
|
||||
indent_style = space
|
||||
max_line_length = off
|
||||
trim_trailing_whitespace = false
|
||||
|
||||
[*.yml]
|
||||
indent_size = 2
|
||||
indent_style = space
|
||||
32
gulpfile.js
32
gulpfile.js
|
|
@ -7,34 +7,34 @@ const terser = require('gulp-terser');
|
|||
sass.compiler = require('sass');
|
||||
|
||||
function html() {
|
||||
return gulp.src('./src/index.pug')
|
||||
.pipe(pug())
|
||||
.pipe(gulp.dest('./dist/'));
|
||||
return gulp.src('./src/index.pug')
|
||||
.pipe(pug())
|
||||
.pipe(gulp.dest('./dist/'));
|
||||
}
|
||||
|
||||
function css() {
|
||||
return gulp.src('./src/style/*.scss')
|
||||
.pipe(sass().on('error', sass.logError))
|
||||
.pipe(postcss([require('autoprefixer'), require('cssnano')]))
|
||||
.pipe(gulp.dest('./dist/'));
|
||||
return gulp.src('./src/style/*.scss')
|
||||
.pipe(sass().on('error', sass.logError))
|
||||
.pipe(postcss([require('autoprefixer'), require('cssnano')]))
|
||||
.pipe(gulp.dest('./dist/'));
|
||||
}
|
||||
|
||||
function js() {
|
||||
return gulp.src('./src/script/index.js')
|
||||
.pipe(terser({ ecma: 5 }))
|
||||
.pipe(gulp.dest('./dist/'));
|
||||
return gulp.src('./src/script/index.js')
|
||||
.pipe(terser({ ecma: 5 }))
|
||||
.pipe(gulp.dest('./dist/'));
|
||||
}
|
||||
|
||||
function static() {
|
||||
return gulp.src('./src/static/**/*')
|
||||
.pipe(gulp.dest('./dist/'));
|
||||
return gulp.src('./src/static/**/*')
|
||||
.pipe(gulp.dest('./dist/'));
|
||||
}
|
||||
|
||||
exports.default = gulp.parallel(html, css, js, static);
|
||||
|
||||
exports.watch = () => {
|
||||
gulp.watch('./src/index.pug', html);
|
||||
gulp.watch('./src/style/*.scss', css);
|
||||
gulp.watch('./src/script/index.js', js);
|
||||
gulp.watch('./src/static/*', static);
|
||||
gulp.watch('./src/index.pug', html);
|
||||
gulp.watch('./src/style/*.scss', css);
|
||||
gulp.watch('./src/script/index.js', js);
|
||||
gulp.watch('./src/static/*', static);
|
||||
}
|
||||
|
|
|
|||
52
package.json
52
package.json
|
|
@ -1,28 +1,28 @@
|
|||
{
|
||||
"name": "toot",
|
||||
"version": "0.0.0",
|
||||
"main": "src/index.pug",
|
||||
"repository": "git@github.com:NickKaramoff/toot.git",
|
||||
"author": "Nikita Karamov <nick@karamoff.dev>",
|
||||
"license": "MIT",
|
||||
"private": "true",
|
||||
"scripts": {
|
||||
"build": "gulp",
|
||||
"dev": "gulp watch"
|
||||
},
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^9.8.6",
|
||||
"browserslist": "^4.14.4",
|
||||
"cross-env": "^7.0.2",
|
||||
"cssnano": "^4.1.10",
|
||||
"gulp": "^4.0.2",
|
||||
"gulp-postcss": "^8.0.0",
|
||||
"gulp-pug": "^4.0.1",
|
||||
"gulp-sass": "^4.1.0",
|
||||
"gulp-terser": "^1.4.0",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"postcss": "^7.0.34",
|
||||
"pug": "^3.0.0",
|
||||
"sass": "^1.26.11"
|
||||
}
|
||||
"name": "toot",
|
||||
"version": "0.0.0",
|
||||
"main": "src/index.pug",
|
||||
"repository": "git@github.com:NickKaramoff/toot.git",
|
||||
"author": "Nikita Karamov <nick@karamoff.dev>",
|
||||
"license": "MIT",
|
||||
"private": "true",
|
||||
"scripts": {
|
||||
"build": "gulp",
|
||||
"dev": "gulp watch"
|
||||
},
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^9.8.6",
|
||||
"browserslist": "^4.14.4",
|
||||
"cross-env": "^7.0.2",
|
||||
"cssnano": "^4.1.10",
|
||||
"gulp": "^4.0.2",
|
||||
"gulp-postcss": "^8.0.0",
|
||||
"gulp-pug": "^4.0.1",
|
||||
"gulp-sass": "^4.1.0",
|
||||
"gulp-terser": "^1.4.0",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"postcss": "^7.0.34",
|
||||
"pug": "^3.0.0",
|
||||
"sass": "^1.26.11"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,47 +1,46 @@
|
|||
<!DOCTYPE html>
|
||||
html(lang="en")
|
||||
head
|
||||
meta(charset="UTF-8")
|
||||
meta(name="viewport", content="width=device-width, initial-scale=1.0")
|
||||
title toot
|
||||
head
|
||||
meta(charset="UTF-8")
|
||||
meta(name="viewport", content="width=device-width, initial-scale=1.0")
|
||||
title toot
|
||||
|
||||
link(rel="stylesheet", href="main.css")
|
||||
link(rel="stylesheet", href="https://fonts.googleapis.com/css2?family=Montserrat:wght@600&family=Roboto:wght@400;500&display=swap")
|
||||
link(rel="stylesheet", href="main.css")
|
||||
link(rel="stylesheet", href="https://fonts.googleapis.com/css2?family=Montserrat:wght@600&family=Roboto:wght@400;500&display=swap")
|
||||
|
||||
link(rel='apple-touch-icon' sizes='180x180' href='./icons/apple-touch-icon.png')
|
||||
link(rel='icon' type='image/png' sizes='32x32' href='./icons/favicon-32x32.png')
|
||||
link(rel='icon' type='image/png' sizes='16x16' href='./icons/favicon-16x16.png')
|
||||
link(rel='manifest' href='./icons/site.webmanifest')
|
||||
link(rel='mask-icon' href='./icons/safari-pinned-tab.svg' color='#3088d4')
|
||||
link(rel='shortcut icon' href='./icons/favicon.ico')
|
||||
meta(name='msapplication-TileColor' content='#1f232b')
|
||||
meta(name='msapplication-config' content='./icons/browserconfig.xml')
|
||||
meta(name='theme-color' content='#1f232b')
|
||||
body
|
||||
header
|
||||
h1 🐘 toot
|
||||
p
|
||||
| Quickly post on any Mastodon instance
|
||||
main
|
||||
form#form
|
||||
section
|
||||
label(for="text") Post text
|
||||
textarea#text(rows=6, name="text", required)
|
||||
section
|
||||
datalist#instances_list
|
||||
label(for="choose_instance") Choose your Mastodon instance
|
||||
input#instance(type="url", name="instance", placeholder="https://", list="instances_list", required)
|
||||
link(rel='apple-touch-icon' sizes='180x180' href='./icons/apple-touch-icon.png')
|
||||
link(rel='icon' type='image/png' sizes='32x32' href='./icons/favicon-32x32.png')
|
||||
link(rel='icon' type='image/png' sizes='16x16' href='./icons/favicon-16x16.png')
|
||||
link(rel='manifest' href='./icons/site.webmanifest')
|
||||
link(rel='mask-icon' href='./icons/safari-pinned-tab.svg' color='#3088d4')
|
||||
link(rel='shortcut icon' href='./icons/favicon.ico')
|
||||
meta(name='msapplication-TileColor' content='#1f232b')
|
||||
meta(name='msapplication-config' content='./icons/browserconfig.xml')
|
||||
meta(name='theme-color' content='#1f232b')
|
||||
body
|
||||
header
|
||||
h1 🐘 toot
|
||||
p Quickly post on any Mastodon instance
|
||||
main
|
||||
form#form
|
||||
section
|
||||
label(for="text") Post text
|
||||
textarea#text(rows=6, name="text", required)
|
||||
section
|
||||
datalist#instances_list
|
||||
label(for="choose_instance") Choose your Mastodon instance
|
||||
input#instance(type="url", name="instance", placeholder="https://", list="instances_list", required)
|
||||
|
||||
section.remember
|
||||
input#remember(type="checkbox", name="remember")
|
||||
label(for="remember") Remember my instance on this device
|
||||
section.remember
|
||||
input#remember(type="checkbox", name="remember")
|
||||
label(for="remember") Remember my instance on this device
|
||||
|
||||
section.submit
|
||||
input(type="submit", value="Toot!")
|
||||
footer
|
||||
section
|
||||
a(href="https://joinmastodon.org/") What is Mastodon?
|
||||
section
|
||||
a(href="https://github.com/NickKaramoff/toot") This project on GitHub
|
||||
section.submit
|
||||
input(type="submit", value="Toot!")
|
||||
footer
|
||||
section
|
||||
a(href="https://joinmastodon.org/") What is Mastodon?
|
||||
section
|
||||
a(href="https://github.com/NickKaramoff/toot") This project on GitHub
|
||||
|
||||
script(src="index.js")
|
||||
script(src="index.js")
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg width="100%" height="100%" viewBox="0 0 36 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
||||
<path d="M34.453,15.573C35.229,18.393 36,22.488 36,27.641C36,28.194 35.553,28.641 35,28.641C34.447,28.641 34,28.194 34,27.641C34,26.141 33.925,24.742 33.807,23.435C33.678,23.82 33.546,24.198 33.387,24.552C32.54,26.909 31.348,29.733 31.348,31.534C31.348,35.098 29.246,35.641 26.653,35.641C24.062,35.641 21.959,35.098 21.959,31.534C21.959,31.317 21.968,31.116 21.972,30.907C21.501,30.93 21.021,30.946 20.524,30.946C19.7,30.946 18.922,30.903 18.165,30.839C18.169,31.071 18.177,31.294 18.177,31.534C18.177,35.098 16.075,35.641 13.482,35.641C10.89,35.641 8.788,35.098 8.788,31.534C8.788,29.202 7.185,24.661 6.795,21.79C6.763,21.626 6.723,21.472 6.695,21.304C5.974,23.916 5.59,28.074 6.44,29.775C7.613,32.12 8.787,32.12 7.613,33.296C6.439,34.467 2.918,33.296 1.745,30.946C0.571,28.6 -1.51,11.183 1.745,6.3C4.091,2.779 14.655,1.605 19.349,5.126C19.362,5.136 19.371,5.147 19.384,5.157C19.76,5.143 20.132,5.126 20.523,5.126C28.724,5.126 33.589,8.273 34.453,15.573ZM6.5,12.641C7.328,12.641 8,13.313 8,14.141C8,14.969 7.328,15.641 6.5,15.641C5.672,15.641 5,14.969 5,14.141C5,13.313 5.672,12.641 6.5,12.641Z" style="fill:rgb(48,136,212);"/>
|
||||
<path d="M34.453,15.573C35.229,18.393 36,22.488 36,27.641C36,28.194 35.553,28.641 35,28.641C34.447,28.641 34,28.194 34,27.641C34,26.141 33.925,24.742 33.807,23.435C33.678,23.82 33.546,24.198 33.387,24.552C32.54,26.909 31.348,29.733 31.348,31.534C31.348,35.098 29.246,35.641 26.653,35.641C24.062,35.641 21.959,35.098 21.959,31.534C21.959,31.317 21.968,31.116 21.972,30.907C21.501,30.93 21.021,30.946 20.524,30.946C19.7,30.946 18.922,30.903 18.165,30.839C18.169,31.071 18.177,31.294 18.177,31.534C18.177,35.098 16.075,35.641 13.482,35.641C10.89,35.641 8.788,35.098 8.788,31.534C8.788,29.202 7.185,24.661 6.795,21.79C6.763,21.626 6.723,21.472 6.695,21.304C5.974,23.916 5.59,28.074 6.44,29.775C7.613,32.12 8.787,32.12 7.613,33.296C6.439,34.467 2.918,33.296 1.745,30.946C0.571,28.6 -1.51,11.183 1.745,6.3C4.091,2.779 14.655,1.605 19.349,5.126C19.362,5.136 19.371,5.147 19.384,5.157C19.76,5.143 20.132,5.126 20.523,5.126C28.724,5.126 33.589,8.273 34.453,15.573ZM6.5,12.641C7.328,12.641 8,13.313 8,14.141C8,14.969 7.328,15.641 6.5,15.641C5.672,15.641 5,14.969 5,14.141C5,13.313 5.672,12.641 6.5,12.641Z" style="fill:rgb(48,136,212);"/>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
|
@ -1,11 +1,11 @@
|
|||
function normalizeUrl(url) {
|
||||
if (url.indexOf("http://") == -1 && url.indexOf("https://") == -1) {
|
||||
url = "https://" + url;
|
||||
}
|
||||
if (url.charAt(url.length - 1) !== '/'){
|
||||
url = url + "/";
|
||||
}
|
||||
return url;
|
||||
if (url.indexOf("http://") == -1 && url.indexOf("https://") == -1) {
|
||||
url = "https://" + url;
|
||||
}
|
||||
if (url.charAt(url.length - 1) !== '/'){
|
||||
url = url + "/";
|
||||
}
|
||||
return url;
|
||||
}
|
||||
|
||||
const instance = document.getElementById('instance');
|
||||
|
|
@ -16,68 +16,68 @@ var prefillInstance = window.localStorage.getItem('mastodon_instance');
|
|||
var paramPairs = window.location.search.substr(1).split('&');
|
||||
var paramPairsLength = paramPairs.length;
|
||||
for (var i = 0; i < paramPairsLength; i++) {
|
||||
var paramPair = paramPairs[i].split('=');
|
||||
if (paramPair[0] === 'text') {
|
||||
document.getElementById('text').value = decodeURIComponent(paramPair[1]);
|
||||
} else if (paramPair[0] === 'instance') {
|
||||
prefillInstance = decodeURIComponent(paramPair[1]);
|
||||
}
|
||||
var paramPair = paramPairs[i].split('=');
|
||||
if (paramPair[0] === 'text') {
|
||||
document.getElementById('text').value = decodeURIComponent(paramPair[1]);
|
||||
} else if (paramPair[0] === 'instance') {
|
||||
prefillInstance = decodeURIComponent(paramPair[1]);
|
||||
}
|
||||
}
|
||||
delete i
|
||||
delete paramPair
|
||||
|
||||
function instances_loading_error() {
|
||||
console.error('Failed to fetch servers list from joinmastodon.');
|
||||
console.error('Failed to fetch servers list from joinmastodon.');
|
||||
}
|
||||
|
||||
function instances_loaded() {
|
||||
if (this.status !== 200) {
|
||||
instances_loading_error();
|
||||
return;
|
||||
}
|
||||
if (this.status !== 200) {
|
||||
instances_loading_error();
|
||||
return;
|
||||
}
|
||||
|
||||
const servers = JSON.parse(this.responseText);
|
||||
const servers = JSON.parse(this.responseText);
|
||||
|
||||
const chosen_instance = instance.value;
|
||||
const domains = servers.map(obj => obj.domain);
|
||||
if (chosen_instance && domains.indexOf(chosen_instance) === -1) {
|
||||
domains.push(chosen_instance);
|
||||
}
|
||||
domains.sort();
|
||||
const chosen_instance = instance.value;
|
||||
const domains = servers.map(obj => obj.domain);
|
||||
if (chosen_instance && domains.indexOf(chosen_instance) === -1) {
|
||||
domains.push(chosen_instance);
|
||||
}
|
||||
domains.sort();
|
||||
|
||||
for (const domain of domains) {
|
||||
const opt = document.createElement('option');
|
||||
opt.value = normalizeUrl(domain);
|
||||
instances_list.appendChild(opt);
|
||||
}
|
||||
for (const domain of domains) {
|
||||
const opt = document.createElement('option');
|
||||
opt.value = normalizeUrl(domain);
|
||||
instances_list.appendChild(opt);
|
||||
}
|
||||
}
|
||||
|
||||
if (prefillInstance != null) {
|
||||
instance.value = normalizeUrl(prefillInstance);
|
||||
instance.value = normalizeUrl(prefillInstance);
|
||||
}
|
||||
|
||||
instance.addEventListener('focus', function (e) {
|
||||
if (instances_list.children.length === 0) {
|
||||
const req = new XMLHttpRequest();
|
||||
req.addEventListener('load', instances_loaded);
|
||||
req.addEventListener('error', instances_loading_error);
|
||||
req.open('GET', 'https://api.joinmastodon.org/servers');
|
||||
req.send();
|
||||
}
|
||||
if (instances_list.children.length === 0) {
|
||||
const req = new XMLHttpRequest();
|
||||
req.addEventListener('load', instances_loaded);
|
||||
req.addEventListener('error', instances_loading_error);
|
||||
req.open('GET', 'https://api.joinmastodon.org/servers');
|
||||
req.send();
|
||||
}
|
||||
})
|
||||
|
||||
document
|
||||
.getElementById('form')
|
||||
.addEventListener('submit', function (e) {
|
||||
e.preventDefault();
|
||||
var text = e.target.elements['text'].value;
|
||||
var instance = normalizeUrl(e.target.elements['instance'].value);
|
||||
var remember = e.target.elements['remember'].checked;
|
||||
e.preventDefault();
|
||||
var text = e.target.elements['text'].value;
|
||||
var instance = normalizeUrl(e.target.elements['instance'].value);
|
||||
var remember = e.target.elements['remember'].checked;
|
||||
|
||||
if (remember) {
|
||||
window.localStorage.setItem('mastodon_instance', instance);
|
||||
}
|
||||
if (remember) {
|
||||
window.localStorage.setItem('mastodon_instance', instance);
|
||||
}
|
||||
|
||||
var shareUrl = instance + "share?text=" + encodeURIComponent(text);
|
||||
window.location.href = shareUrl;
|
||||
var shareUrl = instance + "share?text=" + encodeURIComponent(text);
|
||||
window.location.href = shareUrl;
|
||||
})
|
||||
|
|
|
|||
|
|
@ -2,150 +2,150 @@
|
|||
@import "variables";
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
background-color: $bg;
|
||||
color: $text;
|
||||
font-family: $text-font;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 1;
|
||||
background-color: $bg;
|
||||
color: $text;
|
||||
font-family: $text-font;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 1;
|
||||
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
header {
|
||||
text-align: center;
|
||||
padding-top: 2rem;
|
||||
text-align: center;
|
||||
padding-top: 2rem;
|
||||
|
||||
h1 {
|
||||
color: $title;
|
||||
font-family: $title-font;
|
||||
font-weight: 600;
|
||||
font-size: 26px;
|
||||
line-height: 1.5;
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
h1 {
|
||||
color: $title;
|
||||
font-family: $title-font;
|
||||
font-weight: 600;
|
||||
font-size: 26px;
|
||||
line-height: 1.5;
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 0 26px;
|
||||
}
|
||||
p {
|
||||
margin: 0 0 26px;
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
padding: 0 0.75rem;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
padding: 0 0.75rem;
|
||||
|
||||
form {
|
||||
section {
|
||||
margin-bottom: 1rem;
|
||||
form {
|
||||
section {
|
||||
margin-bottom: 1rem;
|
||||
|
||||
&.remember,
|
||||
&.submit {
|
||||
text-align: center;
|
||||
}
|
||||
&.remember,
|
||||
&.submit {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&.submit {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
&.submit {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
display: inline-block;
|
||||
}
|
||||
label {
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
textarea,
|
||||
input {
|
||||
font-size: 1rem;
|
||||
border-radius: 4px;
|
||||
textarea,
|
||||
input {
|
||||
font-size: 1rem;
|
||||
border-radius: 4px;
|
||||
|
||||
&[type=checkbox] {
|
||||
margin-right: 8px;
|
||||
}
|
||||
&[type=checkbox] {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
&[type=submit] {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
background-color: $button-bg;
|
||||
color: $button-text;
|
||||
font-weight: 500;
|
||||
font-family: inherit;
|
||||
padding: 4px 16px;
|
||||
line-height: 36px;
|
||||
border: 0;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: $button-hover-bg;
|
||||
}
|
||||
}
|
||||
&[type=submit] {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
background-color: $button-bg;
|
||||
color: $button-text;
|
||||
font-weight: 500;
|
||||
font-family: inherit;
|
||||
padding: 4px 16px;
|
||||
line-height: 36px;
|
||||
border: 0;
|
||||
cursor: pointer;
|
||||
|
||||
transition: background-color 300ms ease, border 300ms ease;
|
||||
}
|
||||
&:hover {
|
||||
background-color: $button-hover-bg;
|
||||
}
|
||||
}
|
||||
|
||||
textarea,
|
||||
input[type=url] {
|
||||
color: inherit;
|
||||
width: 100%;
|
||||
outline: 0;
|
||||
font-family: inherit;
|
||||
resize: vertical;
|
||||
background-color: $input-bg;
|
||||
border: 1px solid color.scale($input-bg, $lightness: -25%);
|
||||
padding: 10px;
|
||||
transition: background-color 300ms ease, border 300ms ease;
|
||||
}
|
||||
|
||||
&:focus,
|
||||
&:active {
|
||||
border: 1px solid $button-bg;
|
||||
background-color: color.scale($input-bg, $lightness: +5%);
|
||||
}
|
||||
textarea,
|
||||
input[type=url] {
|
||||
color: inherit;
|
||||
width: 100%;
|
||||
outline: 0;
|
||||
font-family: inherit;
|
||||
resize: vertical;
|
||||
background-color: $input-bg;
|
||||
border: 1px solid color.scale($input-bg, $lightness: -25%);
|
||||
padding: 10px;
|
||||
|
||||
&::placeholder {
|
||||
color: inherit;
|
||||
opacity: 0.3;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:focus,
|
||||
&:active {
|
||||
border: 1px solid $button-bg;
|
||||
background-color: color.scale($input-bg, $lightness: +5%);
|
||||
}
|
||||
|
||||
&::placeholder {
|
||||
color: inherit;
|
||||
opacity: 0.3;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: $footer-bg;
|
||||
padding: 0.5rem 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
background-color: $footer-bg;
|
||||
padding: 0.5rem 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
section {
|
||||
margin: .5rem 1rem;
|
||||
section {
|
||||
margin: .5rem 1rem;
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
a {
|
||||
color: inherit;
|
||||
|
||||
&:hover {
|
||||
color: $title;
|
||||
}
|
||||
&:hover {
|
||||
color: $title;
|
||||
}
|
||||
|
||||
transition: color 300ms ease;
|
||||
}
|
||||
}
|
||||
transition: color 300ms ease;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue