| /**************************\ | |
| Basic Modal Styles | |
| \**************************/ | |
| .modal { | |
| font-family: -apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif; | |
| } | |
| .modal__overlay { | |
| position: fixed; |
I like (love ?) Keynote because it
If I could remove that last argument, I would, but the fact is that, as a consultant, the final document is almost always expected to be a powerpoint document. Don't ask me why, it is just so. I am fighting against it but I did not win the battle so far ...
An experiment using webfonts in combination with CSS 3D transform tools.
A Pen by James Bosworth on CodePen.
| <!doctype html> | |
| <meta charset="utf-8"> | |
| <title>Example</title> | |
| <style> | |
| div { | |
| width: 100px; | |
| height: 100px; | |
| background: black; | |
| animation-duration: .5s; |
| /* | |
| https://www.smashingmagazine.com/2016/07/improving-user-flow-through-page-transitions/ | |
| You can copy paste this code in your console on smashingmagazine.com | |
| in order to have cross-fade transition when change page. | |
| */ | |
| var cache = {}; | |
| function loadPage(url) { | |
| if (cache[url]) { |
| //hide system fields based on ticket forms(change subdomain and form id) | |
| if (window.location.href == "https://yoursubdomain.zendesk.com/hc/en-us/requests/new?ticket_form_id=11111") { | |
| $('.request_subject').hide(); | |
| $('.request_description').hide(); | |
| $('.form-field label:contains("Attachments")').hide(); | |
| $('#upload-dropzone').hide(); | |
| } |
| // Show #element1 by default | |
| // Show #element1 & #element2 by a unique url string | |
| // -- | |
| // ! #element2 is hiding by default with a class of `.hide` | |
| // -- | |
| // if the url string is `?sample=one` | |
| // show `#element1` widget and hide the `#peakday` widget | |
| if (location.search == "?sample=one") { | |
| $('#element1').show(); |
| <script type="text/javascript" src="http://pubnub.github.io/eon/lib/eon-map.js"></script> | |
| <link type="text/css" rel="stylesheet" href="http://pubnub.github.io/eon/lib/eon.css" /> | |
| <div id='map'></div> | |
| <script type="text/javascript"> | |
| eon.map({ | |
| id: 'map', | |
| mb_token: 'mapbox api token', | |
| mb_id: 'mapbox map id', | |
| subscribe_key: 'subscribe_key_here', | |
| channel: 'my map channel' |
| /** | |
| * Retrieves all the rows in the active spreadsheet that contain data and logs the | |
| * values for each row. | |
| * For more information on using the Spreadsheet API, see | |
| * https://developers.google.com/apps-script/service_spreadsheet | |
| */ | |
| function readRows() { | |
| var sheet = SpreadsheetApp.getActiveSheet(); | |
| var rows = sheet.getDataRange(); | |
| var numRows = rows.getNumRows(); |
