# The MIT License (MIT) | |||||
Copyright © 2016-2021 Michael Teeuw | |||||
Permission is hereby granted, free of charge, to any person | |||||
obtaining a copy of this software and associated documentation | |||||
files (the “Software”), to deal in the Software without | |||||
restriction, including without limitation the rights to use, | |||||
copy, modify, merge, publish, distribute, sublicense, and/or sell | |||||
copies of the Software, and to permit persons to whom the | |||||
Software is furnished to do so, subject to the following | |||||
conditions: | |||||
The above copyright notice and this permission notice shall be | |||||
included in all copies or substantial portions of the Software. | |||||
**The software is provided “as is”, without warranty of any kind, express or implied, including but not limited to the warranties of merchantability, fitness for a particular purpose and noninfringement. In no event shall the authors or copyright holders be liable for any claim, damages or other liability, whether in an action of contract, tort or otherwise, arising from, out of or in connection with the software or the use or other dealings in the software.** |
![MagicMirror²: The open source modular smart mirror platform. ](.github/header.png) | |||||
<p style="text-align: center"> | |||||
<a href="https://david-dm.org/MichMich/MagicMirror"><img src="https://david-dm.org/MichMich/MagicMirror.svg" alt="Dependency Status"></a> | |||||
<a href="https://david-dm.org/MichMich/MagicMirror?type=dev"><img src="https://david-dm.org/MichMich/MagicMirror/dev-status.svg" alt="devDependency Status"></a> | |||||
<a href="https://bestpractices.coreinfrastructure.org/projects/347"><img src="https://bestpractices.coreinfrastructure.org/projects/347/badge" alt="CLI Best Practices"></a> | |||||
<a href="https://codecov.io/gh/MichMich/MagicMirror"><img src="https://codecov.io/gh/MichMich/MagicMirror/branch/master/graph/badge.svg?token=LEG1KitZR6" alt="CodeCov Status"/></a> | |||||
<a href="https://choosealicense.com/licenses/mit"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="License"></a> | |||||
<a href="https://github.com/MichMich/MagicMirror/actions?query=workflow%3A%22Automated+Tests%22"><img src="https://github.com/MichMich/MagicMirror/workflows/Automated%20Tests/badge.svg" alt="Tests"></a> | |||||
</p> | |||||
**MagicMirror²** is an open source modular smart mirror platform. With a growing list of installable modules, the **MagicMirror²** allows you to convert your hallway or bathroom mirror into your personal assistant. **MagicMirror²** is built by the creator of [the original MagicMirror](https://michaelteeuw.nl/tagged/magicmirror) with the incredible help of a [growing community of contributors](https://github.com/MichMich/MagicMirror/graphs/contributors). | |||||
MagicMirror² focuses on a modular plugin system and uses [Electron](https://www.electronjs.org/) as an application wrapper. So no more web server or browser installs necessary! | |||||
## Documentation | |||||
For the full documentation including **[installation instructions](https://docs.magicmirror.builders/getting-started/installation.html)**, please visit our dedicated documentation website: [https://docs.magicmirror.builders](https://docs.magicmirror.builders). | |||||
## Links | |||||
- Website: [https://magicmirror.builders](https://magicmirror.builders) | |||||
- Documentation: [https://docs.magicmirror.builders](https://docs.magicmirror.builders) | |||||
- Forum: [https://forum.magicmirror.builders](https://forum.magicmirror.builders) | |||||
- Technical discussions: https://forum.magicmirror.builders/category/11/core-system | |||||
- Discord: [https://discord.gg/J5BAtvx](https://discord.gg/J5BAtvx) | |||||
- Blog: [https://michaelteeuw.nl/tagged/magicmirror](https://michaelteeuw.nl/tagged/magicmirror) | |||||
- Donations: [https://magicmirror.builders/#donate](https://magicmirror.builders/#donate) | |||||
## Contributing Guidelines | |||||
Contributions of all kinds are welcome, not only in the form of code but also with regards to | |||||
- bug reports | |||||
- documentation | |||||
- translations | |||||
For the full contribution guidelines, check out: [https://docs.magicmirror.builders/getting-started/contributing.html](https://docs.magicmirror.builders/getting-started/contributing.html) | |||||
## Enjoying MagicMirror? Consider a donation! | |||||
MagicMirror² is opensource and free. That doesn't mean we don't need any money. | |||||
Please consider a donation to help us cover the ongoing costs like webservers and email services. | |||||
If we receive enough donations we might even be able to free up some working hours and spend some extra time improving the MagicMirror² core. | |||||
To donate, please follow [this](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=G5D8E9MR5DTD2&source=url) link. | |||||
<p style="text-align: center"> | |||||
<a href="https://forum.magicmirror.builders/topic/728/magicmirror-is-voted-number-1-in-the-magpi-top-50"><img src="https://magicmirror.builders/img/magpi-best-watermark-custom.png" width="150" alt="MagPi Top 50"></a> | |||||
</p> |
Version: 1.0 | |||||
-added weather-module |
"use strict"; | |||||
// Use separate scope to prevent global scope pollution | |||||
(function () { | |||||
const config = {}; | |||||
/** | |||||
* Helper function to get server address/hostname from either the commandline or env | |||||
*/ | |||||
function getServerAddress() { | |||||
/** | |||||
* Get command line parameters | |||||
* Assumes that a cmdline parameter is defined with `--key [value]` | |||||
* | |||||
* @param {string} key key to look for at the command line | |||||
* @param {string} defaultValue value if no key is given at the command line | |||||
* @returns {string} the value of the parameter | |||||
*/ | |||||
function getCommandLineParameter(key, defaultValue = undefined) { | |||||
const index = process.argv.indexOf(`--${key}`); | |||||
const value = index > -1 ? process.argv[index + 1] : undefined; | |||||
return value !== undefined ? String(value) : defaultValue; | |||||
} | |||||
// Prefer command line arguments over environment variables | |||||
["address", "port"].forEach((key) => { | |||||
config[key] = getCommandLineParameter(key, process.env[key.toUpperCase()]); | |||||
}); | |||||
// determine if "--use-tls"-flag was provided | |||||
config["tls"] = process.argv.indexOf("--use-tls") > 0; | |||||
} | |||||
/** | |||||
* Gets the config from the specified server url | |||||
* | |||||
* @param {string} url location where the server is running. | |||||
* @returns {Promise} the config | |||||
*/ | |||||
function getServerConfig(url) { | |||||
// Return new pending promise | |||||
return new Promise((resolve, reject) => { | |||||
// Select http or https module, depending on requested url | |||||
const lib = url.startsWith("https") ? require("https") : require("http"); | |||||
const request = lib.get(url, (response) => { | |||||
let configData = ""; | |||||
// Gather incoming data | |||||
response.on("data", function (chunk) { | |||||
configData += chunk; | |||||
}); | |||||
// Resolve promise at the end of the HTTP/HTTPS stream | |||||
response.on("end", function () { | |||||
resolve(JSON.parse(configData)); | |||||
}); | |||||
}); | |||||
request.on("error", function (error) { | |||||
reject(new Error(`Unable to read config from server (${url} (${error.message}`)); | |||||
}); | |||||
}); | |||||
} | |||||
/** | |||||
* Print a message to the console in case of errors | |||||
* | |||||
* @param {string} message error message to print | |||||
* @param {number} code error code for the exit call | |||||
*/ | |||||
function fail(message, code = 1) { | |||||
if (message !== undefined && typeof message === "string") { | |||||
console.log(message); | |||||
} else { | |||||
console.log("Usage: 'node clientonly --address 192.168.1.10 --port 8080 [--use-tls]'"); | |||||
} | |||||
process.exit(code); | |||||
} | |||||
getServerAddress(); | |||||
(config.address && config.port) || fail(); | |||||
const prefix = config.tls ? "https://" : "http://"; | |||||
// Only start the client if a non-local server was provided | |||||
if (["localhost", "127.0.0.1", "::1", "::ffff:127.0.0.1", undefined].indexOf(config.address) === -1) { | |||||
getServerConfig(`${prefix}${config.address}:${config.port}/config/`) | |||||
.then(function (configReturn) { | |||||
// Pass along the server config via an environment variable | |||||
const env = Object.create(process.env); | |||||
const options = { env: env }; | |||||
configReturn.address = config.address; | |||||
configReturn.port = config.port; | |||||
configReturn.tls = config.tls; | |||||
env.config = JSON.stringify(configReturn); | |||||
// Spawn electron application | |||||
const electron = require("electron"); | |||||
const child = require("child_process").spawn(electron, ["js/electron.js"], options); | |||||
// Pipe all child process output to current stdout | |||||
child.stdout.on("data", function (buf) { | |||||
process.stdout.write(`Client: ${buf}`); | |||||
}); | |||||
// Pipe all child process errors to current stderr | |||||
child.stderr.on("data", function (buf) { | |||||
process.stderr.write(`Client: ${buf}`); | |||||
}); | |||||
child.on("error", function (err) { | |||||
process.stdout.write(`Client: ${err}`); | |||||
}); | |||||
child.on("close", (code) => { | |||||
if (code !== 0) { | |||||
console.log(`There something wrong. The clientonly is not running code ${code}`); | |||||
} | |||||
}); | |||||
}) | |||||
.catch(function (reason) { | |||||
fail(`Unable to connect to server: (${reason})`); | |||||
}); | |||||
} else { | |||||
fail(); | |||||
} | |||||
})(); |
/* Magic Mirror Config Sample | |||||
* | |||||
* By Michael Teeuw https://michaelteeuw.nl | |||||
* MIT Licensed. | |||||
* | |||||
* For more information on how you can configure this file | |||||
* see https://docs.magicmirror.builders/getting-started/configuration.html#general | |||||
* and https://docs.magicmirror.builders/modules/configuration.html | |||||
*/ | |||||
let config = { | |||||
electronOptions: { | |||||
webPreferences: { | |||||
webviewTag: true, | |||||
}, | |||||
}, | |||||
address: "localhost", // Address to listen on, can be: | |||||
// - "localhost", "127.0.0.1", "::1" to listen on loopback interface | |||||
// - another specific IPv4/6 to listen on a specific interface | |||||
// - "0.0.0.0", "::" to listen on any interface | |||||
// Default, when address config is left out or empty, is "localhost" | |||||
port: 8080, | |||||
basePath: "/", // The URL path where MagicMirror is hosted. If you are using a Reverse proxy | |||||
// you must set the sub path here. basePath must end with a / | |||||
ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"], // Set [] to allow all IP addresses | |||||
// or add a specific IPv4 of 192.168.1.5 : | |||||
// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.1.5"], | |||||
// or IPv4 range of 192.168.3.0 --> 192.168.3.15 use CIDR format : | |||||
// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.3.0/28"], | |||||
useHttps: false, // Support HTTPS or not, default "false" will use HTTP | |||||
httpsPrivateKey: "", // HTTPS private key path, only require when useHttps is true | |||||
httpsCertificate: "", // HTTPS Certificate path, only require when useHttps is true | |||||
language: "de", | |||||
locale: "de-DE", | |||||
logLevel: ["INFO", "LOG", "WARN", "ERROR"], // Add "DEBUG" for even more logging | |||||
timeFormat: 24, | |||||
units: "metric", | |||||
// serverOnly: true/false/"local" , | |||||
// local for armv6l processors, default | |||||
// starts serveronly and then starts chrome browser | |||||
// false, default for all NON-armv6l devices | |||||
// true, force serveronly mode, because you want to.. no UI on this device | |||||
modules: [ | |||||
{ | |||||
module: "alert", | |||||
}, | |||||
{ | |||||
module: 'MMM-DynamicWeather', | |||||
position: 'fullscreen_above', | |||||
config: { // See https://github.com/scottcl88/MMM-DynamicWeather for more information. | |||||
api_key: "b5c1eee1956050dbcf9c922625c8c182", | |||||
locationID: "2861650", | |||||
effectDuration: 30000, | |||||
effectDelay: 60000 | |||||
} | |||||
}, | |||||
{ | |||||
module: 'MMM-flick-gestures' | |||||
}, | |||||
{ | |||||
module: 'MMM-pages', | |||||
config: { | |||||
modules: | |||||
[["newsfeed", "MMM-EasyPix", "MMM-WebView"], | |||||
["MMM-COVID19-AMPEL",]], | |||||
fixed: ["MMM-connection-status", "clock", "MMM-page-indicator", "MMM-DynamicWeather","MMM-PublicTransportHafas", "weather"], | |||||
rotationTime: 15000, | |||||
} | |||||
}, | |||||
{ | |||||
module: 'MMM-page-indicator', | |||||
position: 'bottom_bar', | |||||
config: { | |||||
pages: 2, | |||||
} | |||||
}, | |||||
{ | |||||
module: "clock", | |||||
position: "top_left" | |||||
}, | |||||
{ | |||||
module: "weather", | |||||
position: "top_right", | |||||
header: "Wetter: ", | |||||
config: { | |||||
weatherProvider: "openweathermap", | |||||
type: "forecast", | |||||
tableClass: "medium", | |||||
location: "Nürnberg", | |||||
locationID: "2861650", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city | |||||
apiKey: "b5c1eee1956050dbcf9c922625c8c182" | |||||
} | |||||
}, | |||||
{ | |||||
module: "MMM-PublicTransportHafas", | |||||
position: "bottom_right", | |||||
config: { | |||||
// Departures options | |||||
stationID: "8004442", // Replace with your stationID! | |||||
stationName: "Verbindung Dürrenhof -> Hauptbahnhof", // Replace with your station name! | |||||
direction: "8000284", // Show only departures heading to this station. (A station ID.) | |||||
excludedTransportationTypes: ["bus", "subway", "national"], // Which transportation types should not be shown on the mirror? (comma-separated list of types) possible values: "tram", "bus", "suburban", "subway", "regional" and "national" | |||||
ignoredLines: [], // Which lines should be ignored? (comma-separated list of line names) | |||||
timeToStation: 0, // How long do you need to walk to the next Station? | |||||
// Look and Feel | |||||
displayLastUpdate: true, // Display the last time of module update. | |||||
maxUnreachableDepartures: 0, // How many unreachable departures should be shown? | |||||
maxReachableDepartures: 7, // How many reachable departures should be shown? | |||||
showColoredLineSymbols: true, // Want colored line symbols? | |||||
customLineStyles: "", // Prefix for the name of the custom css file. ex: Leipzig-lines.css (case sensitive) | |||||
showOnlyLineNumbers: false, // Display only the line number instead of the complete name, i. e. "11" instead of "STR 11" | |||||
showTableHeadersAsSymbols: true, // Table Headers as symbols or text? | |||||
useColorForRealtimeInfo: true, // Want colored real time information (timeToStation, early)? | |||||
updatesEvery: 180 //Sekunden Biatch | |||||
} | |||||
}, | |||||
{ | |||||
module: "MMM-EasyPix", | |||||
position: "middle_center", | |||||
config: { | |||||
picName: "th-qrCode.png", // Enter the picture file name. | |||||
maxWidth: "8%", // Size picture precisely. Retains aspect ratio. | |||||
//sounds: ["1.mp3", "me2.mp3"], // mp3 sound file names in quotes seperated by commas for Hello-Lucy | |||||
//updateInterval: 30 * 60 * 1000, // updates display | |||||
//animationSpeed: 3000, | |||||
} | |||||
}, | |||||
//{ | |||||
//module: 'MMM-Canteen', | |||||
//position: 'top_center', | |||||
//config: { | |||||
//canteenName: 'Mensateria Ohm Nürnberg', | |||||
//updateInterval: 600000, | |||||
//canteen: 268, | |||||
//status: "students", | |||||
//truncate: 100, | |||||
//switchTime: "16:00" | |||||
//} | |||||
//}, | |||||
{ | |||||
module: "newsfeed", | |||||
position: "bottom_center", | |||||
config: { | |||||
feeds: [ | |||||
{ | |||||
title: "Teschnische Hochschule Nürnberg", | |||||
url: "https://www.th-nuernberg.de/news-archiv/rss.xml" | |||||
} | |||||
], | |||||
showDescription: true, | |||||
showSourceTitle: true, | |||||
showPublishDate: true, | |||||
broadcastNewsFeeds: true, | |||||
broadcastNewsUpdates: true, | |||||
updateInterval: 20000 | |||||
} | |||||
}, | |||||
{ | |||||
module: 'MMM-COVID19-AMPEL', | |||||
position: 'bottom_center', | |||||
config: { | |||||
header: 'COVID-19 Inzidenzwert', // Header Title of Display on MagicMirror | |||||
cityID: ["284", "282"], // City ID from https://npgeo-corona-npgeo-de.hub.arcgis.com/datasets/917fc37a709542548cc3be077a786c17_0/data | |||||
infoRowClass: "medium", // small, medium | |||||
showUpdateDateInHeader: true, //Show update date in header | |||||
showUpdateDateInRow: false, //Show update date in each row | |||||
showStatusLightLeft: true, //Show left status light | |||||
showStatusLightRight: true, // Show right status light | |||||
showTitle: true, //Show Title row with headlines if you want to display more than one information | |||||
showSKLK: false, //Show the Region information if the Pace displayed is the city or regional area (Stadt or Land) | |||||
showCases: true, //Show amount of active cases in city | |||||
showCasesPerPeople: false, //Show Percentage of active cases per inhabitant | |||||
showDeathRatePerPeople: true, //show death rate in % of infected people | |||||
show7DayIncidence: true, // Show 7 day incidence value for your location | |||||
landModeOnly: false, // Shows Bundesland instead of City in Bundesland (Thos who want to display only the Bundesland) | |||||
showVaccinations: false, //Shows the total quota of fist shots people got in the whole country in header | |||||
numberOfDigits: 2, //Round the Percentage and incidence value to number of digits | |||||
updateInterval: 3600000, // update interval in milliseconds // 1 Hour - Values are only refreshed every 24 H on Server | |||||
fadeSpeed: 4000, | |||||
} | |||||
}, | |||||
{ | |||||
module: 'MMM-WebView', | |||||
position: 'bottom_left', | |||||
config: { | |||||
url: 'file:///home/pi/Desktop/Git/smartMirror/speiseplan-skript/speiseplan.html', | |||||
width: '20rem', | |||||
height: '25rem', | |||||
autoRefresh: true, | |||||
autoRefreshInterval: 1800000 | |||||
}, | |||||
}, | |||||
] | |||||
}; | |||||
/*************** DO NOT EDIT THE LINE BELOW ***************/ | |||||
if (typeof module !== "undefined") {module.exports = config;} |
/* Magic Mirror Config Sample | |||||
* | |||||
* By Michael Teeuw https://michaelteeuw.nl | |||||
* MIT Licensed. | |||||
* | |||||
* For more information on how you can configure this file | |||||
* see https://docs.magicmirror.builders/getting-started/configuration.html#general | |||||
* and https://docs.magicmirror.builders/modules/configuration.html | |||||
*/ | |||||
let config = { | |||||
address: "localhost", // Address to listen on, can be: | |||||
// - "localhost", "127.0.0.1", "::1" to listen on loopback interface | |||||
// - another specific IPv4/6 to listen on a specific interface | |||||
// - "0.0.0.0", "::" to listen on any interface | |||||
// Default, when address config is left out or empty, is "localhost" | |||||
port: 8080, | |||||
basePath: "/", // The URL path where MagicMirror is hosted. If you are using a Reverse proxy | |||||
// you must set the sub path here. basePath must end with a / | |||||
ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"], // Set [] to allow all IP addresses | |||||
// or add a specific IPv4 of 192.168.1.5 : | |||||
// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.1.5"], | |||||
// or IPv4 range of 192.168.3.0 --> 192.168.3.15 use CIDR format : | |||||
// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.3.0/28"], | |||||
useHttps: false, // Support HTTPS or not, default "false" will use HTTP | |||||
httpsPrivateKey: "", // HTTPS private key path, only require when useHttps is true | |||||
httpsCertificate: "", // HTTPS Certificate path, only require when useHttps is true | |||||
language: "en", | |||||
locale: "en-US", | |||||
logLevel: ["INFO", "LOG", "WARN", "ERROR"], // Add "DEBUG" for even more logging | |||||
timeFormat: 24, | |||||
units: "metric", | |||||
// serverOnly: true/false/"local" , | |||||
// local for armv6l processors, default | |||||
// starts serveronly and then starts chrome browser | |||||
// false, default for all NON-armv6l devices | |||||
// true, force serveronly mode, because you want to.. no UI on this device | |||||
modules: [ | |||||
{ | |||||
module: "alert", | |||||
}, | |||||
{ | |||||
module: "updatenotification", | |||||
position: "top_bar" | |||||
}, | |||||
{ | |||||
module: "clock", | |||||
position: "top_left" | |||||
}, | |||||
{ | |||||
module: "calendar", | |||||
header: "US Holidays", | |||||
position: "top_left", | |||||
config: { | |||||
calendars: [ | |||||
{ | |||||
symbol: "calendar-check", | |||||
url: "webcal://www.calendarlabs.com/ical-calendar/ics/76/US_Holidays.ics" | |||||
} | |||||
] | |||||
} | |||||
}, | |||||
{ | |||||
module: "compliments", | |||||
position: "lower_third" | |||||
}, | |||||
{ | |||||
module: "weather", | |||||
position: "top_right", | |||||
config: { | |||||
weatherProvider: "openweathermap", | |||||
type: "current", | |||||
location: "New York", | |||||
locationID: "5128581", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city | |||||
apiKey: "YOUR_OPENWEATHER_API_KEY" | |||||
} | |||||
}, | |||||
{ | |||||
module: "weather", | |||||
position: "top_right", | |||||
header: "Weather Forecast", | |||||
config: { | |||||
weatherProvider: "openweathermap", | |||||
type: "forecast", | |||||
location: "New York", | |||||
locationID: "5128581", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city | |||||
apiKey: "YOUR_OPENWEATHER_API_KEY" | |||||
} | |||||
}, | |||||
{ | |||||
module: "newsfeed", | |||||
position: "bottom_bar", | |||||
config: { | |||||
feeds: [ | |||||
{ | |||||
title: "New York Times", | |||||
url: "https://rss.nytimes.com/services/xml/rss/nyt/HomePage.xml" | |||||
} | |||||
], | |||||
showSourceTitle: true, | |||||
showPublishDate: true, | |||||
broadcastNewsFeeds: true, | |||||
broadcastNewsUpdates: true | |||||
} | |||||
}, | |||||
] | |||||
}; | |||||
/*************** DO NOT EDIT THE LINE BELOW ***************/ | |||||
if (typeof module !== "undefined") {module.exports = config;} |
/* Magic Mirror Custom CSS Sample | |||||
* | |||||
* Change color and fonts here. | |||||
* | |||||
* Beware that properties cannot be unitless, so for example write '--gap-body: 0px;' instead of just '--gap-body: 0;' | |||||
* | |||||
* MIT Licensed. | |||||
*/ | |||||
/* Uncomment and adjust accordingly if you want to import another font from the google-fonts-api: */ | |||||
/* @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;700&display=swap'); */ | |||||
:root { | |||||
--color-text: #999; | |||||
--color-text-dimmed: #666; | |||||
--color-text-bright: #fff; | |||||
--color-background: black; | |||||
--font-primary: "Roboto Condensed"; | |||||
--font-secondary: "Roboto"; | |||||
--font-size: 20px; | |||||
--font-size-small: 0.75rem; | |||||
--gap-body-top: 60px; | |||||
--gap-body-right: 60px; | |||||
--gap-body-bottom: 60px; | |||||
--gap-body-left: 60px; | |||||
--gap-modules: 30px; | |||||
} |
:root { | |||||
--color-text: #999; | |||||
--color-text-dimmed: #666; | |||||
--color-text-bright: #fff; | |||||
--color-background: #000; | |||||
--font-primary: "Roboto Condensed"; | |||||
--font-secondary: "Roboto"; | |||||
--font-size: 20px; | |||||
--font-size-small: 0.75rem; | |||||
--gap-body-top: 60px; | |||||
--gap-body-right: 60px; | |||||
--gap-body-bottom: 60px; | |||||
--gap-body-left: 60px; | |||||
--gap-modules: 30px; | |||||
} | |||||
html { | |||||
cursor: none; | |||||
overflow: hidden; | |||||
background: var(--color-background); | |||||
user-select: none; | |||||
font-size: var(--font-size); | |||||
} | |||||
::-webkit-scrollbar { | |||||
display: none; | |||||
} | |||||
body { | |||||
margin: var(--gap-body-top) var(--gap-body-right) var(--gap-body-bottom) var(--gap-body-left); | |||||
position: absolute; | |||||
height: calc(100% - var(--gap-body-top) - var(--gap-body-bottom)); | |||||
width: calc(100% - var(--gap-body-right) - var(--gap-body-left)); | |||||
background: var(--color-background); | |||||
color: var(--color-text); | |||||
font-family: var(--font-primary), sans-serif; | |||||
font-weight: 400; | |||||
line-height: 1.5; | |||||
-webkit-font-smoothing: antialiased; | |||||
} | |||||
/** | |||||
* Default styles. | |||||
*/ | |||||
.dimmed { | |||||
color: var(--color-text-dimmed); | |||||
} | |||||
.normal { | |||||
color: var(--color-text); | |||||
} | |||||
.bright { | |||||
color: var(--color-text-bright); | |||||
} | |||||
.xsmall { | |||||
font-size: var(--font-size-small); | |||||
line-height: 1.275; | |||||
} | |||||
.small { | |||||
font-size: 1rem; | |||||
line-height: 1.25; | |||||
} | |||||
.medium { | |||||
font-size: 1.5rem; | |||||
line-height: 1.225; | |||||
} | |||||
.large { | |||||
font-size: 3.25rem; | |||||
line-height: 1; | |||||
} | |||||
.xlarge { | |||||
font-size: 3.75rem; | |||||
line-height: 1; | |||||
letter-spacing: -3px; | |||||
} | |||||
.thin { | |||||
font-family: var(--font-secondary), sans-serif; | |||||
font-weight: 100; | |||||
} | |||||
.light { | |||||
font-family: var(--font-primary), sans-serif; | |||||
font-weight: 300; | |||||
} | |||||
.regular { | |||||
font-family: var(--font-primary), sans-serif; | |||||
font-weight: 400; | |||||
} | |||||
.bold { | |||||
font-family: var(--font-primary), sans-serif; | |||||
font-weight: 700; | |||||
} | |||||
.align-right { | |||||
text-align: right; | |||||
} | |||||
.align-left { | |||||
text-align: left; | |||||
} | |||||
header { | |||||
text-transform: uppercase; | |||||
font-size: var(--font-size-small); | |||||
font-family: var(--font-primary), Arial, Helvetica, sans-serif; | |||||
font-weight: 400; | |||||
border-bottom: 1px solid var(--color-text-dimmed); | |||||
line-height: 15px; | |||||
padding-bottom: 5px; | |||||
margin-bottom: 10px; | |||||
color: var(--color-text); | |||||
} | |||||
sup { | |||||
font-size: 50%; | |||||
line-height: 50%; | |||||
} | |||||
/** | |||||
* Module styles. | |||||
*/ | |||||
.module { | |||||
margin-bottom: var(--gap-modules); | |||||
} | |||||
.region.bottom .module { | |||||
margin-top: var(--gap-modules); | |||||
margin-bottom: 0; | |||||
} | |||||
.no-wrap { | |||||
white-space: nowrap; | |||||
overflow: hidden; | |||||
text-overflow: ellipsis; | |||||
} | |||||
.pre-line { | |||||
white-space: pre-line; | |||||
} | |||||
/** | |||||
* Region Definitions. | |||||
*/ | |||||
.region { | |||||
position: absolute; | |||||
} | |||||
.region.fullscreen { | |||||
position: absolute; | |||||
top: calc(-1 * var(--gap-body-top)); | |||||
left: calc(-1 * var(--gap-body-left)); | |||||
right: calc(-1 * var(--gap-body-right)); | |||||
bottom: calc(-1 * var(--gap-body-bottom)); | |||||
pointer-events: none; | |||||
} | |||||
.region.fullscreen * { | |||||
pointer-events: auto; | |||||
} | |||||
.region.right { | |||||
right: 0; | |||||
text-align: right; | |||||
} | |||||
.region.top { | |||||
top: 0; | |||||
} | |||||
.region.top.center, | |||||
.region.bottom.center { | |||||
left: 50%; | |||||
transform: translateX(-50%); | |||||
} | |||||
.region.top.right, | |||||
.region.top.left, | |||||
.region.top.center { | |||||
top: 100%; | |||||
} | |||||
.region.bottom { | |||||
bottom: 0; | |||||
} | |||||
.region.bottom.right, | |||||
.region.bottom.center, | |||||
.region.bottom.left { | |||||
bottom: 100%; | |||||
} | |||||
.region.bar { | |||||
width: 100%; | |||||
text-align: center; | |||||
} | |||||
.region.third, | |||||
.region.middle.center { | |||||
width: 100%; | |||||
text-align: center; | |||||
transform: translateY(-50%); | |||||
} | |||||
.region.upper.third { | |||||
top: 33%; | |||||
} | |||||
.region.middle.center { | |||||
top: 50%; | |||||
} | |||||
.region.lower.third { | |||||
top: 66%; | |||||
} | |||||
.region.left { | |||||
text-align: left; | |||||
} | |||||
.region table { | |||||
width: 100%; | |||||
border-spacing: 0; | |||||
border-collapse: separate; | |||||
} |
Apache License | |||||
Version 2.0, January 2004 | |||||
http://www.apache.org/licenses/ | |||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION | |||||
1. Definitions. | |||||
"License" shall mean the terms and conditions for use, reproduction, | |||||
and distribution as defined by Sections 1 through 9 of this document. | |||||
"Licensor" shall mean the copyright owner or entity authorized by | |||||
the copyright owner that is granting the License. | |||||
"Legal Entity" shall mean the union of the acting entity and all | |||||
other entities that control, are controlled by, or are under common | |||||
control with that entity. For the purposes of this definition, | |||||
"control" means (i) the power, direct or indirect, to cause the | |||||
direction or management of such entity, whether by contract or | |||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the | |||||
outstanding shares, or (iii) beneficial ownership of such entity. | |||||
"You" (or "Your") shall mean an individual or Legal Entity | |||||
exercising permissions granted by this License. | |||||
"Source" form shall mean the preferred form for making modifications, | |||||
including but not limited to software source code, documentation | |||||
source, and configuration files. | |||||
"Object" form shall mean any form resulting from mechanical | |||||
transformation or translation of a Source form, including but | |||||
not limited to compiled object code, generated documentation, | |||||
and conversions to other media types. | |||||
"Work" shall mean the work of authorship, whether in Source or | |||||
Object form, made available under the License, as indicated by a | |||||
copyright notice that is included in or attached to the work | |||||
(an example is provided in the Appendix below). | |||||
"Derivative Works" shall mean any work, whether in Source or Object | |||||
form, that is based on (or derived from) the Work and for which the | |||||
editorial revisions, annotations, elaborations, or other modifications | |||||
represent, as a whole, an original work of authorship. For the purposes | |||||
of this License, Derivative Works shall not include works that remain | |||||
separable from, or merely link (or bind by name) to the interfaces of, | |||||
the Work and Derivative Works thereof. | |||||
"Contribution" shall mean any work of authorship, including | |||||
the original version of the Work and any modifications or additions | |||||
to that Work or Derivative Works thereof, that is intentionally | |||||
submitted to Licensor for inclusion in the Work by the copyright owner | |||||
or by an individual or Legal Entity authorized to submit on behalf of | |||||
the copyright owner. For the purposes of this definition, "submitted" | |||||
means any form of electronic, verbal, or written communication sent | |||||
to the Licensor or its representatives, including but not limited to | |||||
communication on electronic mailing lists, source code control systems, | |||||
and issue tracking systems that are managed by, or on behalf of, the | |||||
Licensor for the purpose of discussing and improving the Work, but | |||||
excluding communication that is conspicuously marked or otherwise | |||||
designated in writing by the copyright owner as "Not a Contribution." | |||||
"Contributor" shall mean Licensor and any individual or Legal Entity | |||||
on behalf of whom a Contribution has been received by Licensor and | |||||
subsequently incorporated within the Work. | |||||
2. Grant of Copyright License. Subject to the terms and conditions of | |||||
this License, each Contributor hereby grants to You a perpetual, | |||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable | |||||
copyright license to reproduce, prepare Derivative Works of, | |||||
publicly display, publicly perform, sublicense, and distribute the | |||||
Work and such Derivative Works in Source or Object form. | |||||
3. Grant of Patent License. Subject to the terms and conditions of | |||||
this License, each Contributor hereby grants to You a perpetual, | |||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable | |||||
(except as stated in this section) patent license to make, have made, | |||||
use, offer to sell, sell, import, and otherwise transfer the Work, | |||||
where such license applies only to those patent claims licensable | |||||
by such Contributor that are necessarily infringed by their | |||||
Contribution(s) alone or by combination of their Contribution(s) | |||||
with the Work to which such Contribution(s) was submitted. If You | |||||
institute patent litigation against any entity (including a | |||||
cross-claim or counterclaim in a lawsuit) alleging that the Work | |||||
or a Contribution incorporated within the Work constitutes direct | |||||
or contributory patent infringement, then any patent licenses | |||||
granted to You under this License for that Work shall terminate | |||||
as of the date such litigation is filed. | |||||
4. Redistribution. You may reproduce and distribute copies of the | |||||
Work or Derivative Works thereof in any medium, with or without | |||||
modifications, and in Source or Object form, provided that You | |||||
meet the following conditions: | |||||
(a) You must give any other recipients of the Work or | |||||
Derivative Works a copy of this License; and | |||||
(b) You must cause any modified files to carry prominent notices | |||||
stating that You changed the files; and | |||||
(c) You must retain, in the Source form of any Derivative Works | |||||
that You distribute, all copyright, patent, trademark, and | |||||
attribution notices from the Source form of the Work, | |||||
excluding those notices that do not pertain to any part of | |||||
the Derivative Works; and | |||||
(d) If the Work includes a "NOTICE" text file as part of its | |||||
distribution, then any Derivative Works that You distribute must | |||||
include a readable copy of the attribution notices contained | |||||
within such NOTICE file, excluding those notices that do not | |||||
pertain to any part of the Derivative Works, in at least one | |||||
of the following places: within a NOTICE text file distributed | |||||
as part of the Derivative Works; within the Source form or | |||||
documentation, if provided along with the Derivative Works; or, | |||||
within a display generated by the Derivative Works, if and | |||||
wherever such third-party notices normally appear. The contents | |||||
of the NOTICE file are for informational purposes only and | |||||
do not modify the License. You may add Your own attribution | |||||
notices within Derivative Works that You distribute, alongside | |||||
or as an addendum to the NOTICE text from the Work, provided | |||||
that such additional attribution notices cannot be construed | |||||
as modifying the License. | |||||
You may add Your own copyright statement to Your modifications and | |||||
may provide additional or different license terms and conditions | |||||
for use, reproduction, or distribution of Your modifications, or | |||||
for any such Derivative Works as a whole, provided Your use, | |||||
reproduction, and distribution of the Work otherwise complies with | |||||
the conditions stated in this License. | |||||
5. Submission of Contributions. Unless You explicitly state otherwise, | |||||
any Contribution intentionally submitted for inclusion in the Work | |||||
by You to the Licensor shall be under the terms and conditions of | |||||
this License, without any additional terms or conditions. | |||||
Notwithstanding the above, nothing herein shall supersede or modify | |||||
the terms of any separate license agreement you may have executed | |||||
with Licensor regarding such Contributions. | |||||
6. Trademarks. This License does not grant permission to use the trade | |||||
names, trademarks, service marks, or product names of the Licensor, | |||||
except as required for reasonable and customary use in describing the | |||||
origin of the Work and reproducing the content of the NOTICE file. | |||||
7. Disclaimer of Warranty. Unless required by applicable law or | |||||
agreed to in writing, Licensor provides the Work (and each | |||||
Contributor provides its Contributions) on an "AS IS" BASIS, | |||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or | |||||
implied, including, without limitation, any warranties or conditions | |||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A | |||||
PARTICULAR PURPOSE. You are solely responsible for determining the | |||||
appropriateness of using or redistributing the Work and assume any | |||||
risks associated with Your exercise of permissions under this License. | |||||
8. Limitation of Liability. In no event and under no legal theory, | |||||
whether in tort (including negligence), contract, or otherwise, | |||||
unless required by applicable law (such as deliberate and grossly | |||||
negligent acts) or agreed to in writing, shall any Contributor be | |||||
liable to You for damages, including any direct, indirect, special, | |||||
incidental, or consequential damages of any character arising as a | |||||
result of this License or out of the use or inability to use the | |||||
Work (including but not limited to damages for loss of goodwill, | |||||
work stoppage, computer failure or malfunction, or any and all | |||||
other commercial damages or losses), even if such Contributor | |||||
has been advised of the possibility of such damages. | |||||
9. Accepting Warranty or Additional Liability. While redistributing | |||||
the Work or Derivative Works thereof, You may choose to offer, | |||||
and charge a fee for, acceptance of support, warranty, indemnity, | |||||
or other liability obligations and/or rights consistent with this | |||||
License. However, in accepting such obligations, You may act only | |||||
on Your own behalf and on Your sole responsibility, not on behalf | |||||
of any other Contributor, and only if You agree to indemnify, | |||||
defend, and hold each Contributor harmless for any liability | |||||
incurred by, or claims asserted against, such Contributor by reason | |||||
of your accepting any such warranty or additional liability. | |||||
END OF TERMS AND CONDITIONS | |||||
APPENDIX: How to apply the Apache License to your work. | |||||
To apply the Apache License to your work, attach the following | |||||
boilerplate notice, with the fields enclosed by brackets "[]" | |||||
replaced with your own identifying information. (Don't include | |||||
the brackets!) The text should be enclosed in the appropriate | |||||
comment syntax for the file format. We also recommend that a | |||||
file or class name and description of purpose be included on the | |||||
same "printed page" as the copyright notice for easier | |||||
identification within third-party archives. | |||||
Copyright 2013 Christian Hoffmeister | |||||
Licensed under the Apache License, Version 2.0 (the "License"); | |||||
you may not use this file except in compliance with the License. | |||||
You may obtain a copy of the License at | |||||
http://www.apache.org/licenses/LICENSE-2.0 | |||||
Unless required by applicable law or agreed to in writing, software | |||||
distributed under the License is distributed on an "AS IS" BASIS, | |||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | |||||
See the License for the specific language governing permissions and | |||||
limitations under the License. |
# Roboto fontface | |||||
A simple package providing the [Roboto](http://www.google.com/fonts/specimen/Roboto) fontface. The font was created by [Christian Robertson](https://plus.google.com/110879635926653430880/about). | |||||
## Installing | |||||
Assuming you have [NodeJS](http://nodejs.org/), [NPM](https://www.npmjs.com/) and [Bower](http://bower.io/) installed globally just open up a terminal, navigate to your projects root directory and then execute | |||||
``` | |||||
# install via NPM | |||||
$ npm install roboto-fontface --save | |||||
# install via Bower | |||||
$ bower install roboto-fontface --save | |||||
``` | |||||
## Usage | |||||
There're several files in the `css/` subdirectory. Import them in your project | |||||
to have access to "Roboto" font face: | |||||
* `css/roboto/roboto-fontface.css` - whole font family compiled to CSS | |||||
* `css/roboto/sass/roboto-fontface.scss` - whole font family in SCSS | |||||
* `css/roboto/less/roboto-fontface.less` - whole font family in LESS | |||||
* `css/roboto-condensed/roboto-condensed-fontface.css` - whole font family compiled to CSS | |||||
* `css/roboto-condensed/sass/roboto-condensed-fontface.scss` - whole font family in SCSS | |||||
* `css/roboto-condensed/less/roboto-condensed-fontface.less` - whole font family in LESS | |||||
* `css/roboto-slab/roboto-slab-fontface.css` - whole font family compiled to CSS | |||||
* `css/roboto-slab/sass/roboto-slab-fontface.scss` - whole font family in SCSS | |||||
* `css/roboto-slab/less/roboto-slab-fontface.less` - whole font family in LESS | |||||
Importing whole family may be unnecessary and lead to huge build, so if you are | |||||
using SCSS or LESS, you can import only individual weights by importing for example: | |||||
* `css/roboto/sass/roboto-fontface-black.scss` | |||||
* `css/roboto/sass/roboto-fontface-black-italic.scss` | |||||
## Hinting | |||||
Some of the included font files have [hinting](http://en.wikipedia.org/wiki/Font_hinting). | |||||
| Files | Hinting | | |||||
|----------|---------| | |||||
| `.woff` | yes | | |||||
| `.woff2` | ? | |
{ | |||||
"name": "roboto-fontface", | |||||
"description": "A simple package providing the Roboto fontface.", | |||||
"version": "0.9.0", | |||||
"main": [ | |||||
"./css/roboto/roboto-fontface.css" | |||||
], | |||||
"ignore": [ | |||||
"**/.*", | |||||
"node_modules", | |||||
"bower_components", | |||||
"test", | |||||
"tests" | |||||
] | |||||
} |
@roboto-font-path: '../../../fonts'; | |||||
.roboto-font(@folder, @variant, @type, @weight, @style) { | |||||
@font-full-path: '@{roboto-font-path}/@{folder}/@{variant}'; | |||||
@font-face { | |||||
font-family: '@{variant}'; | |||||
src: url('@{font-full-path}-@{type}.woff2') format('woff2'), | |||||
url('@{font-full-path}-@{type}.woff') format('woff'); | |||||
font-weight: @weight; | |||||
font-style: @style; | |||||
} | |||||
@font-face { | |||||
font-family: '@{variant}-@{type}'; | |||||
src: url('@{font-full-path}-@{type}.woff2') format('woff2'), | |||||
url('@{font-full-path}-@{type}.woff') format('woff'); | |||||
} | |||||
} |
$roboto-font-path: '../../../fonts' !default; | |||||
@mixin roboto-font($folder, $variant, $type, $weight, $style) { | |||||
$font-full-path: '#{$roboto-font-path}/#{$folder}/#{$variant}'; | |||||
@font-face { | |||||
font-family: '#{$variant}'; | |||||
src: url('#{$font-full-path}-#{$type}.woff2') format('woff2'), | |||||
url('#{$font-full-path}-#{$type}.woff') format('woff'); | |||||
font-weight: $weight; | |||||
font-style: $style; | |||||
} | |||||
@font-face { | |||||
font-family: '#{$variant}-#{$type}'; | |||||
src: url('#{$font-full-path}-#{$type}.woff2') format('woff2'), | |||||
url('#{$font-full-path}-#{$type}.woff') format('woff'); | |||||
} | |||||
} |
@import "../../mixins"; | |||||
.roboto-font('roboto-condensed', 'Roboto-Condensed', 'BoldItalic', 700, italic); |
@import "../../mixins"; | |||||
.roboto-font('roboto-condensed', 'Roboto-Condensed', 'Bold', 700, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto-condensed', 'Roboto-Condensed', 'LightItalic', 300, italic); |
@import "../../mixins"; | |||||
.roboto-font('roboto-condensed', 'Roboto-Condensed', 'Light', 300, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto-condensed', 'Roboto-Condensed', 'RegularItalic', 400, italic); |
@import "../../mixins"; | |||||
.roboto-font('roboto-condensed', 'Roboto-Condensed', 'Regular', 400, normal); |
@import "roboto-condensed-fontface-regular"; | |||||
@import "roboto-condensed-fontface-regular-italic"; | |||||
@import "roboto-condensed-fontface-light"; | |||||
@import "roboto-condensed-fontface-light-italic"; | |||||
@import "roboto-condensed-fontface-bold"; | |||||
@import "roboto-condensed-fontface-bold-italic"; |
@font-face { | |||||
font-family: "Roboto-Condensed"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-Regular.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-Regular.woff") format("woff"); | |||||
font-weight: 400; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed-Regular"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-Regular.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-Regular.woff") format("woff"); | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-RegularItalic.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-RegularItalic.woff") format("woff"); | |||||
font-weight: 400; | |||||
font-style: italic; | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed-RegularItalic"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-RegularItalic.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-RegularItalic.woff") format("woff"); | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-Light.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-Light.woff") format("woff"); | |||||
font-weight: 300; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed-Light"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-Light.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-Light.woff") format("woff"); | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-LightItalic.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-LightItalic.woff") format("woff"); | |||||
font-weight: 300; | |||||
font-style: italic; | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed-LightItalic"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-LightItalic.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-LightItalic.woff") format("woff"); | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-Bold.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-Bold.woff") format("woff"); | |||||
font-weight: 700; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed-Bold"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-Bold.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-Bold.woff") format("woff"); | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-BoldItalic.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-BoldItalic.woff") format("woff"); | |||||
font-weight: 700; | |||||
font-style: italic; | |||||
} | |||||
@font-face { | |||||
font-family: "Roboto-Condensed-BoldItalic"; | |||||
src: url("../../fonts/roboto-condensed/Roboto-Condensed-BoldItalic.woff2") format("woff2"), url("../../fonts/roboto-condensed/Roboto-Condensed-BoldItalic.woff") format("woff"); | |||||
} |
@import "../../mixins"; | |||||
@include roboto-font('roboto-condensed', 'Roboto-Condensed', 'BoldItalic', 700, italic); |
@import "../../mixins"; | |||||
@include roboto-font('roboto-condensed', 'Roboto-Condensed', 'Bold', 700, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto-condensed', 'Roboto-Condensed', 'LightItalic', 300, italic); |
@import "../../mixins"; | |||||
@include roboto-font('roboto-condensed', 'Roboto-Condensed', 'Light', 300, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto-condensed', 'Roboto-Condensed', 'RegularItalic', 400, italic); |
@import "../../mixins"; | |||||
@include roboto-font('roboto-condensed', 'Roboto-Condensed', 'Regular', 400, normal); |
@import "roboto-condensed-fontface-regular"; | |||||
@import "roboto-condensed-fontface-regular-italic"; | |||||
@import "roboto-condensed-fontface-light"; | |||||
@import "roboto-condensed-fontface-light-italic"; | |||||
@import "roboto-condensed-fontface-bold"; | |||||
@import "roboto-condensed-fontface-bold-italic"; |
@import "../../mixins"; | |||||
.roboto-font('roboto-slab', 'Roboto-Slab', 'Bold', 700, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto-slab', 'Roboto-Slab', 'Light', 300, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto-slab', 'Roboto-Slab', 'Regular', 400, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto-slab', 'Roboto-Slab', 'Thin', 100, normal); |
@import "roboto-slab-fontface-regular"; | |||||
@import "roboto-slab-fontface-light"; | |||||
@import "roboto-slab-fontface-thin"; | |||||
@import "roboto-slab-fontface-bold"; |
@font-face { | |||||
font-family: 'Roboto-Slab'; | |||||
src: url('../../fonts/roboto-slab/Roboto-Slab-Thin.woff2') format('woff2'), url('../../fonts/roboto-slab/Roboto-Slab-Thin.woff') format('woff'); | |||||
font-weight: 100; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Slab-Thin'; | |||||
src: url('../../fonts/roboto-slab/Roboto-Slab-Thin.woff2') format('woff2'), url('../../fonts/roboto-slab/Roboto-Slab-Thin.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Slab'; | |||||
src: url('../../fonts/roboto-slab/Roboto-Slab-Light.woff2') format('woff2'), url('../../fonts/roboto-slab/Roboto-Slab-Light.woff') format('woff'); | |||||
font-weight: 300; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Slab-Light'; | |||||
src: url('../../fonts/roboto-slab/Roboto-Slab-Light.woff2') format('woff2'), url('../../fonts/roboto-slab/Roboto-Slab-Light.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Slab'; | |||||
src: url('../../fonts/roboto-slab/Roboto-Slab-Regular.woff2') format('woff2'), url('../../fonts/roboto-slab/Roboto-Slab-Regular.woff') format('woff'); | |||||
font-weight: 400; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Slab-Regular'; | |||||
src: url('../../fonts/roboto-slab/Roboto-Slab-Regular.woff2') format('woff2'), url('../../fonts/roboto-slab/Roboto-Slab-Regular.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Slab'; | |||||
src: url('../../fonts/roboto-slab/Roboto-Slab-Bold.woff2') format('woff2'), url('../../fonts/roboto-slab/Roboto-Slab-Bold.woff') format('woff'); | |||||
font-weight: 700; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Slab-Bold'; | |||||
src: url('../../fonts/roboto-slab/Roboto-Slab-Bold.woff2') format('woff2'), url('../../fonts/roboto-slab/Roboto-Slab-Bold.woff') format('woff'); | |||||
} |
@import "../../mixins"; | |||||
@include roboto-font('roboto-slab', 'Roboto-Slab', 'Bold', 700, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto-slab', 'Roboto-Slab', 'Light', 300, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto-slab', 'Roboto-Slab', 'Regular', 400, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto-slab', 'Roboto-Slab', 'Thin', 100, normal); |
@import "roboto-slab-fontface-regular"; | |||||
@import "roboto-slab-fontface-light"; | |||||
@import "roboto-slab-fontface-thin"; | |||||
@import "roboto-slab-fontface-bold"; |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'BlackItalic', 900, italic); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'Black', 900, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'BoldItalic', 700, italic); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'Bold', 700, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'LightItalic', 300, italic); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'Light', 300, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'MediumItalic', 500, italic); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'Medium', 500, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'RegularItalic', 400, italic); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'Regular', 400, normal); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'ThinItalic', 100, italic); |
@import "../../mixins"; | |||||
.roboto-font('roboto', 'Roboto', 'Thin', 100, normal); |
@import "roboto-fontface-regular"; | |||||
@import "roboto-fontface-regular-italic"; | |||||
@import "roboto-fontface-light"; | |||||
@import "roboto-fontface-light-italic"; | |||||
@import "roboto-fontface-thin"; | |||||
@import "roboto-fontface-thin-italic"; | |||||
@import "roboto-fontface-medium"; | |||||
@import "roboto-fontface-medium-italic"; | |||||
@import "roboto-fontface-bold"; | |||||
@import "roboto-fontface-bold-italic"; | |||||
@import "roboto-fontface-black"; | |||||
@import "roboto-fontface-black-italic"; |
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-Thin.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Thin.woff') format('woff'); | |||||
font-weight: 100; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Thin'; | |||||
src: url('../../fonts/roboto/Roboto-Thin.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Thin.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-ThinItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-ThinItalic.woff') format('woff'); | |||||
font-weight: 100; | |||||
font-style: italic; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-ThinItalic'; | |||||
src: url('../../fonts/roboto/Roboto-ThinItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-ThinItalic.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-Light.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Light.woff') format('woff'); | |||||
font-weight: 300; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Light'; | |||||
src: url('../../fonts/roboto/Roboto-Light.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Light.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-LightItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-LightItalic.woff') format('woff'); | |||||
font-weight: 300; | |||||
font-style: italic; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-LightItalic'; | |||||
src: url('../../fonts/roboto/Roboto-LightItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-LightItalic.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-Regular.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Regular.woff') format('woff'); | |||||
font-weight: 400; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Regular'; | |||||
src: url('../../fonts/roboto/Roboto-Regular.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Regular.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-RegularItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-RegularItalic.woff') format('woff'); | |||||
font-weight: 400; | |||||
font-style: italic; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-RegularItalic'; | |||||
src: url('../../fonts/roboto/Roboto-RegularItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-RegularItalic.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-Medium.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Medium.woff') format('woff'); | |||||
font-weight: 500; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Medium'; | |||||
src: url('../../fonts/roboto/Roboto-Medium.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Medium.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-MediumItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-MediumItalic.woff') format('woff'); | |||||
font-weight: 500; | |||||
font-style: italic; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-MediumItalic'; | |||||
src: url('../../fonts/roboto/Roboto-MediumItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-MediumItalic.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-Bold.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Bold.woff') format('woff'); | |||||
font-weight: 700; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Bold'; | |||||
src: url('../../fonts/roboto/Roboto-Bold.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Bold.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-BoldItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-BoldItalic.woff') format('woff'); | |||||
font-weight: 700; | |||||
font-style: italic; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-BoldItalic'; | |||||
src: url('../../fonts/roboto/Roboto-BoldItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-BoldItalic.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-Black.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Black.woff') format('woff'); | |||||
font-weight: 900; | |||||
font-style: normal; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-Black'; | |||||
src: url('../../fonts/roboto/Roboto-Black.woff2') format('woff2'), url('../../fonts/roboto/Roboto-Black.woff') format('woff'); | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto'; | |||||
src: url('../../fonts/roboto/Roboto-BlackItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-BlackItalic.woff') format('woff'); | |||||
font-weight: 900; | |||||
font-style: italic; | |||||
} | |||||
@font-face { | |||||
font-family: 'Roboto-BlackItalic'; | |||||
src: url('../../fonts/roboto/Roboto-BlackItalic.woff2') format('woff2'), url('../../fonts/roboto/Roboto-BlackItalic.woff') format('woff'); | |||||
} |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'BlackItalic', 900, italic); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'Black', 900, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'BoldItalic', 700, italic); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'Bold', 700, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'LightItalic', 300, italic); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'Light', 300, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'MediumItalic', 500, italic); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'Medium', 500, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'RegularItalic', 400, italic); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'Regular', 400, normal); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'ThinItalic', 100, italic); |
@import "../../mixins"; | |||||
@include roboto-font('roboto', 'Roboto', 'Thin', 100, normal); |
@import "roboto-fontface-regular"; | |||||
@import "roboto-fontface-regular-italic"; | |||||
@import "roboto-fontface-light"; | |||||
@import "roboto-fontface-light-italic"; | |||||
@import "roboto-fontface-thin"; | |||||
@import "roboto-fontface-thin-italic"; | |||||
@import "roboto-fontface-medium"; | |||||
@import "roboto-fontface-medium-italic"; | |||||
@import "roboto-fontface-bold"; | |||||
@import "roboto-fontface-bold-italic"; | |||||
@import "roboto-fontface-black"; | |||||
@import "roboto-fontface-black-italic"; |