added avitar upload, created framework for dark and light theme, fixed inconsistent theme display bug
|
@ -23,7 +23,7 @@ const fs = require('fs-extra');
|
|||
const Models = require('../../models');
|
||||
const dateUtils = new DateUtils();
|
||||
const rightsManager = new RightsManager();
|
||||
const uploadPath = "./content/blog-images/" + dateUtils.getDate('year', new Date()) + "/" + dateUtils.getDate('month', new Date());
|
||||
const uploadPath = "./content/user-images/" + dateUtils.getDate('year', new Date()) + "/" + dateUtils.getDate('month', new Date());
|
||||
const Sequelize = require('sequelize');
|
||||
const Op = Sequelize.Op;
|
||||
const _ = require('lodash');
|
||||
|
@ -47,11 +47,11 @@ var storage = multer.diskStorage(
|
|||
var avatar_upload = multer(
|
||||
{
|
||||
storage: storage
|
||||
}).array('avatar');
|
||||
}).array('avatar_upload');
|
||||
var background_upload = multer(
|
||||
{
|
||||
storage: storage
|
||||
}).array('feature_background');
|
||||
}).array('background_upload');
|
||||
//** SYNC POSTS */
|
||||
router.post("/sync", (req, res, next) =>
|
||||
{
|
||||
|
@ -138,11 +138,22 @@ router.post('/add-avatar', function(req, res, next)
|
|||
}
|
||||
else
|
||||
{
|
||||
var postImage = req.files[0].path;
|
||||
var avatar = req.files[0].path;
|
||||
user.update(
|
||||
{
|
||||
avatar: avatar.substr(7, avatar.length)
|
||||
}).then(updated =>
|
||||
{
|
||||
|
||||
req.session.user = updated;
|
||||
}).catch(err =>
|
||||
{
|
||||
console.log("ERR", err);
|
||||
})
|
||||
return res.json(
|
||||
{
|
||||
message: DataEvent.POST_IMAGE_ADDED,
|
||||
url: postImage.substr(7, postImage.length)
|
||||
message: DataEvent.AVATAR_UPLOADED,
|
||||
url: avatar.substr(7, avatar.length)
|
||||
});
|
||||
}
|
||||
});
|
||||
|
|
|
@ -3,7 +3,6 @@ const router = express.Router();
|
|||
const FileHound = require('filehound');
|
||||
const Models = require('../../models');
|
||||
const fs = require("fs-extra");
|
||||
var themes = [];
|
||||
var settings = [];
|
||||
//--------------------------
|
||||
// SETTINGS
|
||||
|
@ -17,49 +16,63 @@ router.get('/', function(req, res)
|
|||
{
|
||||
//console.error(err)
|
||||
})
|
||||
let themes = [];
|
||||
FileHound.create().paths('themes').ext('json').find().then(files =>
|
||||
{
|
||||
themes = [];
|
||||
for (let index = 0; index < files.length; index++)
|
||||
files.forEach(file =>
|
||||
{
|
||||
fs.readJson(files[index]).then(theme =>
|
||||
fs.readJson(file).then(theme =>
|
||||
{
|
||||
(theme.name == settings.theme) ? themes.push(
|
||||
if (theme.name == settings.theme)
|
||||
{
|
||||
theme: theme,
|
||||
current: "true"
|
||||
}): themes.push(
|
||||
themes.push(
|
||||
{
|
||||
theme: theme,
|
||||
current: "true"
|
||||
})
|
||||
}
|
||||
else
|
||||
{
|
||||
theme: theme,
|
||||
current: "false"
|
||||
})
|
||||
themes.push(
|
||||
{
|
||||
theme: theme,
|
||||
current: "false"
|
||||
})
|
||||
}
|
||||
}).catch(err =>
|
||||
{
|
||||
//console.error(err)
|
||||
})
|
||||
});
|
||||
if (req.session.user)
|
||||
{
|
||||
let memberInfo = [];
|
||||
Models.User.findById(req.session.user.id).then((user) =>
|
||||
{
|
||||
memberInfo.push(
|
||||
{
|
||||
handle: user.handle,
|
||||
email: user.email,
|
||||
avi: user.avatar
|
||||
});
|
||||
themes.sort(function(a, b) {
|
||||
var textA = a.theme.name.toUpperCase();
|
||||
var textB = b.theme.name.toUpperCase();
|
||||
return (textA < textB) ? -1 : (textA > textB) ? 1 : 0;
|
||||
});
|
||||
res.render('dash/settings',
|
||||
{
|
||||
title: 'Dashboard | Settings',
|
||||
themes: themes,
|
||||
settings: settings,
|
||||
member: memberInfo[0]
|
||||
});
|
||||
})
|
||||
}
|
||||
else
|
||||
{
|
||||
res.redirect('/@/dashboard');
|
||||
}
|
||||
});
|
||||
if (req.session.user)
|
||||
{
|
||||
let memberInfo = [];
|
||||
memberInfo.push(
|
||||
{
|
||||
handle: req.session.user.handle,
|
||||
email: req.session.user.email,
|
||||
avi: req.session.user.avatar
|
||||
});
|
||||
console.log("THEMES", themes);
|
||||
res.render('dash/settings',
|
||||
{
|
||||
title: 'Dashboard | Settings',
|
||||
themes: themes,
|
||||
settings: settings,
|
||||
member: memberInfo[0]
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
res.redirect('/@/dashboard');
|
||||
}
|
||||
});
|
||||
module.exports = router;
|
|
@ -19,6 +19,7 @@ export const POST_DELETED = 'postImageAdded';
|
|||
export const POSTS_SYNCED = 'postsSynced';
|
||||
export const LOCAL_DB_READY = 'localDBReady';
|
||||
export const SETTINGS_UPDATED = 'settingsUpdated';
|
||||
export const AVATAR_UPLOADED = 'avatarUploaded';
|
||||
class DataEvent
|
||||
{
|
||||
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
"private": true,
|
||||
"description": "The most chill blog framework ever.",
|
||||
"repository": "https://code.playvicio.us/Are0h/Fipamo",
|
||||
"theme": "default",
|
||||
"theme": "default-light",
|
||||
"scripts": {
|
||||
"start": "forever start -r esm init.js",
|
||||
"stop": "forever stop init.js",
|
||||
|
|
|
@ -1 +1,22 @@
|
|||
{"url":"http://fipamo.local","title":"This is Fipamo, bro","description":"The most chill blog framework ever.","theme":"default","private":"false","email":{"smtp":{"domain":"","email":"","password":""},"mailgun":{"domain":"","api-key":""}}}
|
||||
{
|
||||
"url": "http://fipamo.local",
|
||||
"title": "This is Fipamo, bro",
|
||||
"description": "The most chill blog framework ever.",
|
||||
"theme": "default-light",
|
||||
"private": "false",
|
||||
"feautred-url":"",
|
||||
"email":
|
||||
{
|
||||
"smtp":
|
||||
{
|
||||
"domain": "",
|
||||
"email": "",
|
||||
"password": ""
|
||||
},
|
||||
"mailgun":
|
||||
{
|
||||
"domain": "",
|
||||
"api-key": ""
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1897,9 +1897,10 @@ svg.icons {
|
|||
}
|
||||
#settings-index #settings-index-wrapper #member-avatar-drop img {
|
||||
width: 200px;
|
||||
border: 1px solid #f2f1ef;
|
||||
border-radius: 100px;
|
||||
border: 5px solid #f2f1ef;
|
||||
border-radius: 150px;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
#settings-index #settings-index-wrapper #member-avatar-drop input {
|
||||
visibility: hidden;
|
||||
|
@ -1913,7 +1914,7 @@ svg.icons {
|
|||
#settings-index #settings-index-wrapper #member-settings label,
|
||||
#settings-index #settings-index-wrapper #site-settings label,
|
||||
#settings-index #settings-index-wrapper #theme-settings label {
|
||||
font-family: "Apercu-Mono";
|
||||
font-family: 'Apercu-Mono';
|
||||
color: #f2f1ef;
|
||||
}
|
||||
#settings-index #settings-index-wrapper #member-settings input,
|
||||
|
@ -1934,9 +1935,9 @@ svg.icons {
|
|||
margin-top: 10px;
|
||||
padding: 10px;
|
||||
}
|
||||
#settings-index #settings-index-wrapper #theme-settings a {
|
||||
#settings-index #settings-index-wrapper #theme-settings a[data-enabled='false'] {
|
||||
width: 310px;
|
||||
margin-right: 5px;
|
||||
margin: 0 5px 5px 0;
|
||||
height: 25px;
|
||||
padding: 10px;
|
||||
display: inline-block;
|
||||
|
@ -1944,6 +1945,21 @@ svg.icons {
|
|||
color: #b2cce5;
|
||||
border-radius: 3px;
|
||||
}
|
||||
#settings-index #settings-index-wrapper #theme-settings a[data-enabled='true'] {
|
||||
width: 310px;
|
||||
margin: 0 5px 5px 0;
|
||||
height: 25px;
|
||||
padding: 10px;
|
||||
display: inline-block;
|
||||
background: #b2cce5;
|
||||
color: #374857;
|
||||
border-radius: 3px;
|
||||
}
|
||||
#settings-index #settings-index-wrapper #theme-settings a[data-enabled='true'] svg {
|
||||
fill: #374857;
|
||||
display: inline-block;
|
||||
float: right;
|
||||
}
|
||||
/**
|
||||
-------------------------------
|
||||
-- Forms
|
||||
|
@ -1972,7 +1988,7 @@ textarea {
|
|||
button,
|
||||
input[type=submit] {
|
||||
background: #fc6399;
|
||||
color: #f2f1ef;
|
||||
color: #161d23;
|
||||
font: 1em 'Apercu-Mono';
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
|
|
49
themes/dash/assets/js/dash.min.js
vendored
|
@ -197,7 +197,7 @@ exports.default = _default;
|
|||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = exports.SETTINGS_UPDATED = exports.LOCAL_DB_READY = exports.POSTS_SYNCED = exports.POST_DELETED = exports.POST_UPDATED = exports.POST_ADDED = exports.POST_ERROR = exports.FEATURE_IMAGE_ADDED = exports.POST_IMAGE_ADDED = exports.PROJECTS_SORTED = exports.PROJECT_ADDED = exports.PROJECT_UPDATED = exports.ARCHIVES_ENTRY_LOADED = exports.ARCHIVES_PAGE_LOADED = exports.ARCHIVES_JSON_LOADED = exports.HTML_LOADED = exports.SETTINGS_LOADED = exports.IMG_REQUEST_LAME = exports.IMG_REQUEST_GOOD = exports.REQUEST_LAME = exports.REQUEST_GOOD = void 0;
|
||||
exports.default = exports.AVATAR_UPLOADED = exports.SETTINGS_UPDATED = exports.LOCAL_DB_READY = exports.POSTS_SYNCED = exports.POST_DELETED = exports.POST_UPDATED = exports.POST_ADDED = exports.POST_ERROR = exports.FEATURE_IMAGE_ADDED = exports.POST_IMAGE_ADDED = exports.PROJECTS_SORTED = exports.PROJECT_ADDED = exports.PROJECT_UPDATED = exports.ARCHIVES_ENTRY_LOADED = exports.ARCHIVES_PAGE_LOADED = exports.ARCHIVES_JSON_LOADED = exports.HTML_LOADED = exports.SETTINGS_LOADED = exports.IMG_REQUEST_LAME = exports.IMG_REQUEST_GOOD = exports.REQUEST_LAME = exports.REQUEST_GOOD = void 0;
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
|
@ -243,6 +243,8 @@ var LOCAL_DB_READY = 'localDBReady';
|
|||
exports.LOCAL_DB_READY = LOCAL_DB_READY;
|
||||
var SETTINGS_UPDATED = 'settingsUpdated';
|
||||
exports.SETTINGS_UPDATED = SETTINGS_UPDATED;
|
||||
var AVATAR_UPLOADED = 'avatarUploaded';
|
||||
exports.AVATAR_UPLOADED = AVATAR_UPLOADED;
|
||||
|
||||
var DataEvent = function DataEvent() {
|
||||
_classCallCheck(this, DataEvent);
|
||||
|
@ -8388,6 +8390,12 @@ exports.default = void 0;
|
|||
|
||||
var _SettingsActions = _interopRequireDefault(require("../actions/SettingsActions"));
|
||||
|
||||
var _DataUtils = _interopRequireWildcard(require("../../../../../brain/tools/utilities/DataUtils"));
|
||||
|
||||
var DataEvent = _interopRequireWildcard(require("../../../../../brain/tools/events/DataEvent"));
|
||||
|
||||
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
@ -8406,6 +8414,7 @@ function () {
|
|||
_classCallCheck(this, SettingsIndex);
|
||||
|
||||
this.start();
|
||||
this.dataUtils = new _DataUtils.default();
|
||||
} //--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
|
@ -8414,6 +8423,7 @@ function () {
|
|||
_createClass(SettingsIndex, [{
|
||||
key: "start",
|
||||
value: function start() {
|
||||
var self = this;
|
||||
document.getElementById('save-toggle').addEventListener('click', function (f) {
|
||||
return new _SettingsActions.default().save().then(function (response) {
|
||||
console.log(response);
|
||||
|
@ -8421,17 +8431,52 @@ function () {
|
|||
console.log(err);
|
||||
});
|
||||
});
|
||||
document.getElementById('avatar').addEventListener('click', function (e) {
|
||||
document.getElementById('avatar-upload').click();
|
||||
});
|
||||
document.getElementById('avatar-upload').addEventListener('change', function (e) {
|
||||
self.handleImageUpload(e.target.id, e.target.files);
|
||||
}, false);
|
||||
} //--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
|
||||
}, {
|
||||
key: "handleImageUpload",
|
||||
value: function handleImageUpload(type, files) {
|
||||
var url = "";
|
||||
var eventType = "";
|
||||
var self = this;
|
||||
type == "avatar-upload" ? url = "/api/settings/add-avatar" : url = "/api/settings/add-feature-background"; //(type == "featured-image-upload") ? eventType = DataEvent.FEATURE_IMAGE_ADDED: eventType = DataEvent.POST_IMAGE_ADDED
|
||||
|
||||
var imageData = new FormData();
|
||||
|
||||
for (var i = 0; i < files.length; i++) {
|
||||
var file = files[i]; // Check the file type.
|
||||
|
||||
if (!file.type.match('image.*')) {
|
||||
continue;
|
||||
}
|
||||
|
||||
type == "avatar-upload" ? imageData.append('avatar_upload', file, file.name) : imageData.append('background_upload', file, file.name);
|
||||
}
|
||||
|
||||
this.dataUtils.request(url, eventType, _DataUtils.REQUEST_TYPE_POST, _DataUtils.CONTENT_TYPE_FORM, imageData).then(function (response) {
|
||||
var r = JSON.parse(response.request['response']);
|
||||
|
||||
if (r.message == DataEvent.AVATAR_UPLOADED) {
|
||||
document.getElementById('avatar').src = r.url;
|
||||
}
|
||||
}).catch(function (err) {//console.log(err)
|
||||
});
|
||||
}
|
||||
}]);
|
||||
|
||||
return SettingsIndex;
|
||||
}();
|
||||
|
||||
exports.default = SettingsIndex;
|
||||
},{"../actions/SettingsActions":"actions/SettingsActions.js"}],"controllers/DashManager.js":[function(require,module,exports) {
|
||||
},{"../actions/SettingsActions":"actions/SettingsActions.js","../../../../../brain/tools/utilities/DataUtils":"../../../../brain/tools/utilities/DataUtils.js","../../../../../brain/tools/events/DataEvent":"../../../../brain/tools/events/DataEvent.js"}],"controllers/DashManager.js":[function(require,module,exports) {
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
a#menu(href="")
|
||||
svg(viewBox="0 0 20 20" class="icons")
|
||||
use(xlink:href='/dash/assets/images/sprite.svg#entypo-list')
|
||||
label Menu
|
||||
label Navigation
|
||||
#dash-recent
|
||||
#recent-list
|
||||
h3 Recent
|
||||
|
|
|
@ -3,8 +3,8 @@ block main-content
|
|||
#settings-index
|
||||
#settings-index-wrapper
|
||||
#member-avatar-drop
|
||||
img(src=member.avi)
|
||||
input(id="avatar-upload" type="file" name="avatar-image-upload")
|
||||
img#avatar(src=member.avi, for="avatar-upload")
|
||||
input(id="avatar-upload" type="file" name="avatar-upload")
|
||||
#member-settings
|
||||
input(type='text', name='handle' id='settings-handle', placeholder='handle', value=member.handle, autofocus)
|
||||
input(type='text', name='email' id='settings-email', placeholder='email', value=member.email, autofocus)
|
||||
|
@ -24,6 +24,8 @@ block main-content
|
|||
-if(themes[index].current == "true")
|
||||
a.theme-select(href="#" id=themes[index].theme.name, data-enabled="true")
|
||||
= themes[index].theme["display-name"]
|
||||
svg(viewBox="0 0 20 20" class="icons")
|
||||
use(xlink:href='/dash/assets/images/sprite.svg#entypo-check')
|
||||
-else
|
||||
a.theme-select(href="#" id=themes[index].theme.name, data-enabled="false")
|
||||
= themes[index].theme["display-name"]
|
||||
|
|
|
@ -1,4 +1,15 @@
|
|||
import SettingsActions from "../actions/SettingsActions";
|
||||
import DataUtils,
|
||||
{
|
||||
REQUEST_TYPE_GET,
|
||||
REQUEST_TYPE_PUT,
|
||||
REQUEST_TYPE_POST,
|
||||
REQUEST_TYPE_DELETE,
|
||||
CONTENT_TYPE_JSON,
|
||||
CONTENT_TYPE_FORM
|
||||
}
|
||||
from "../../../../../brain/tools/utilities/DataUtils";
|
||||
import * as DataEvent from '../../../../../brain/tools/events/DataEvent';
|
||||
export default class SettingsIndex
|
||||
{
|
||||
//--------------------------
|
||||
|
@ -7,12 +18,14 @@ export default class SettingsIndex
|
|||
constructor()
|
||||
{
|
||||
this.start();
|
||||
this.dataUtils = new DataUtils();
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
//--------------------------
|
||||
start()
|
||||
{
|
||||
let self = this;
|
||||
document.getElementById('save-toggle').addEventListener('click', f => new SettingsActions().save().then(response =>
|
||||
{
|
||||
console.log(response);
|
||||
|
@ -20,8 +33,47 @@ export default class SettingsIndex
|
|||
{
|
||||
console.log(err);
|
||||
}));
|
||||
document.getElementById('avatar').addEventListener('click', e =>
|
||||
{
|
||||
document.getElementById('avatar-upload').click();
|
||||
})
|
||||
document.getElementById('avatar-upload').addEventListener('change', e =>
|
||||
{
|
||||
self.handleImageUpload(e.target.id, e.target.files);
|
||||
}, false);
|
||||
}
|
||||
//--------------------------
|
||||
// event handlers
|
||||
//--------------------------
|
||||
handleImageUpload(type, files)
|
||||
{
|
||||
let url = ""
|
||||
let eventType = "";
|
||||
let self = this;
|
||||
(type == "avatar-upload") ? url = "/api/settings/add-avatar": url = "/api/settings/add-feature-background";
|
||||
//(type == "featured-image-upload") ? eventType = DataEvent.FEATURE_IMAGE_ADDED: eventType = DataEvent.POST_IMAGE_ADDED
|
||||
var imageData = new FormData();
|
||||
for (var i = 0; i < files.length; i++)
|
||||
{
|
||||
var file = files[i];
|
||||
// Check the file type.
|
||||
if (!file.type.match('image.*'))
|
||||
{
|
||||
continue;
|
||||
}
|
||||
(type == "avatar-upload") ? imageData.append('avatar_upload', file, file.name): imageData.append('background_upload', file, file.name);
|
||||
}
|
||||
this.dataUtils.request(url, eventType, REQUEST_TYPE_POST, CONTENT_TYPE_FORM, imageData).then((response) =>
|
||||
{
|
||||
let r = JSON.parse(response.request['response']);
|
||||
if(r.message == DataEvent.AVATAR_UPLOADED)
|
||||
{
|
||||
document.getElementById('avatar').src = r.url;
|
||||
}
|
||||
|
||||
}).catch((err) =>
|
||||
{
|
||||
//console.log(err)
|
||||
})
|
||||
}
|
||||
}
|
|
@ -18,7 +18,7 @@ textarea
|
|||
|
||||
button, input[type=submit]
|
||||
background $highlight
|
||||
color $white
|
||||
color $primary - 60%
|
||||
font 1em 'Apercu-Mono'
|
||||
border-radius 3px
|
||||
position relative
|
||||
|
|
|
@ -2,47 +2,69 @@
|
|||
width 100%
|
||||
max-width 900px
|
||||
margin 0 auto
|
||||
|
||||
#settings-index-wrapper
|
||||
padding 0.75rem
|
||||
button
|
||||
margin-top: 5px;
|
||||
width: 320px
|
||||
height 45px
|
||||
|
||||
button
|
||||
margin-top 5px
|
||||
width 320px
|
||||
height 45px
|
||||
|
||||
#member-avatar-drop
|
||||
img
|
||||
width: 200px
|
||||
border: 1px solid $white
|
||||
border-radius: 100px;
|
||||
width 200px
|
||||
border 5px solid $white
|
||||
border-radius 150px
|
||||
overflow hidden
|
||||
cursor pointer
|
||||
|
||||
input
|
||||
visibility hidden
|
||||
|
||||
#member-settings, #site-settings, #theme-settings
|
||||
label
|
||||
font-family: "Apercu-Mono"
|
||||
color: $white
|
||||
width: 80%
|
||||
margin-bottom: 40px
|
||||
font-family 'Apercu-Mono'
|
||||
color $white
|
||||
|
||||
width 80%
|
||||
margin-bottom 40px
|
||||
|
||||
input
|
||||
width: 44%;
|
||||
margin-right: 5px;
|
||||
width 44%
|
||||
margin-right 5px
|
||||
height 30px
|
||||
padding: 10px
|
||||
padding 10px
|
||||
|
||||
textarea
|
||||
background: $primary - 60%
|
||||
width: 91.5%
|
||||
height 100px;
|
||||
color: $secondary
|
||||
margin-top: 10px
|
||||
padding: 10px;
|
||||
background $primary - 60%
|
||||
width 91.5%
|
||||
height 100px
|
||||
color $secondary
|
||||
margin-top 10px
|
||||
padding 10px
|
||||
|
||||
#theme-settings
|
||||
a
|
||||
width: 310px;
|
||||
margin-right: 5px;
|
||||
height 25px
|
||||
padding: 10px
|
||||
a[data-enabled='false']
|
||||
width 310px
|
||||
margin 0 5px 5px 0
|
||||
height 25px
|
||||
padding 10px
|
||||
display inline-block
|
||||
background $primary - 60%
|
||||
color $secondary
|
||||
border-radius 3px
|
||||
|
||||
a[data-enabled='true']
|
||||
width 310px
|
||||
margin 0 5px 5px 0
|
||||
height 25px
|
||||
padding 10px
|
||||
display inline-block
|
||||
background $secondary
|
||||
color $primary
|
||||
border-radius 3px
|
||||
svg
|
||||
fill $primary
|
||||
display inline-block
|
||||
background: $primary - 60%
|
||||
color $secondary
|
||||
border-radius 3px
|
||||
|
||||
|
||||
float right
|
||||
|
|
Before Width: | Height: | Size: 284 KiB After Width: | Height: | Size: 284 KiB |
Before Width: | Height: | Size: 279 KiB After Width: | Height: | Size: 279 KiB |
Before Width: | Height: | Size: 362 KiB After Width: | Height: | Size: 362 KiB |
Before Width: | Height: | Size: 377 KiB After Width: | Height: | Size: 377 KiB |
Before Width: | Height: | Size: 367 KiB After Width: | Height: | Size: 367 KiB |
Before Width: | Height: | Size: 390 KiB After Width: | Height: | Size: 390 KiB |
Before Width: | Height: | Size: 434 KiB After Width: | Height: | Size: 434 KiB |
Before Width: | Height: | Size: 78 KiB After Width: | Height: | Size: 78 KiB |
Before Width: | Height: | Size: 71 KiB After Width: | Height: | Size: 71 KiB |
Before Width: | Height: | Size: 690 KiB After Width: | Height: | Size: 690 KiB |
Before Width: | Height: | Size: 1.8 MiB After Width: | Height: | Size: 1.8 MiB |
Before Width: | Height: | Size: 342 KiB After Width: | Height: | Size: 342 KiB |
Before Width: | Height: | Size: 202 KiB After Width: | Height: | Size: 202 KiB |
Before Width: | Height: | Size: 58 KiB After Width: | Height: | Size: 58 KiB |