{"id":17312376,"url":"https://github.com/samdutton/video2014","last_synced_at":"2025-03-27T01:15:22.970Z","repository":{"id":15180207,"uuid":"17908075","full_name":"samdutton/video2014","owner":"samdutton","description":null,"archived":false,"fork":false,"pushed_at":"2014-03-19T15:35:52.000Z","size":14116,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-01T06:41:18.838Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/samdutton.png","metadata":{"files":{"readme":"README.html","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-03-19T14:53:13.000Z","updated_at":"2014-07-02T19:39:31.000Z","dependencies_parsed_at":"2022-09-13T21:51:14.744Z","dependency_job_id":null,"html_url":"https://github.com/samdutton/video2014","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/samdutton%2Fvideo2014","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/samdutton%2Fvideo2014/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/samdutton%2Fvideo2014/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/samdutton%2Fvideo2014/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/samdutton","download_url":"https://codeload.github.com/samdutton/video2014/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245761302,"owners_count":20667895,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-15T12:43:20.626Z","updated_at":"2025-03-27T01:15:22.944Z","avatar_url":"https://github.com/samdutton.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cstyle\u003e\n@import \"http://fonts.googleapis.com/css?family=Open Sans:regular,semibold,italic,italicsemibold|Inconsolata\u0026amp;v2\";\nbody {\n  font-family: \"Open Sans\";\n  margin: 6em 2em 2em 2em;\n}\nbody:before {\n  content: '';\n  position: fixed;\n  top: 2%;\n  right: 3%;\n  height: 100px;\n  width: 100px;\n  background: url(http://www.html5rocks.com/static/images/identity/HTML5_Badge_128.png) no-repeat 50% 50%;\n  background-size: contain;\n  z-index: 10;\n  opacity: 0.1;\n}\nh1, h2, h3, h4 {\n  font-weight: 600;\n}\nh1 {\n  position: fixed;\n  background: -webkit-linear-gradient(top, white 65%, rgba(255,255,255,0));\n  background: -moz-linear-gradient(top, white 65%, rgba(255,255,255,0));\n  background: -ms-linear-gradient(top, white 65%, rgba(255,255,255,0));\n  background: -o-linear-gradient(top, white 65%, rgba(255,255,255,0));\n  width: 100%;\n  height: 80px;\n  padding: 10px 10px 10px 1em;\n  left: 0;\n  top: 0;\n  margin: 0;\n}\nh1 img {\n  height: 30px;\n  vertical-align: middle;\n  margin-bottom: 8px;\n}\na { color: navy; }\npre {\n  background: #eee;\n  margin-left: 2em;\n  padding: 5px;\n  border-left: 3px solid #ccc;\n}\n\u003c/style\u003e\n\n\u003ch1\u003e\u003cimg src=\"images/io2012_logo.png\"\u003e HTML5 Slide Template\u003c/h1\u003e\n\n\u003ch2\u003eConfiguring the slides\u003c/h2\u003e\n\u003cp\u003eMuch of the deck is customized by changing the settings in \u003ca href=\"slide_config.js\"\u003e\u003ccode\u003eslide_config.js\u003c/code\u003e\u003c/a\u003e.\nSome of the customizations include the title, Analytics tracking ID, speaker\ninformation (name, social urls, blog), web fonts to load, themes, and other\ngeneral behavior.\u003c/p\u003e\n\u003ch3\u003eCustomizing the \u003ccode\u003e#io12\u003c/code\u003e hash\u003c/h3\u003e\n\u003cp\u003eThe bottom of the slides include \u003ccode\u003e#io12\u003c/code\u003e by default. If you'd like to change\nthis, please update the variable \u003ccode\u003e$social-tags: '#io12';\u003c/code\u003e in\n\u003ca href=\"theme/scss/default.scss\"\u003e\u003ccode\u003e/theme/scss/default.scss\u003c/code\u003e\u003c/a\u003e.\u003c/p\u003e\n\u003cp\u003eSee the next section on \"Editing CSS\" before you go editing things.\u003c/p\u003e\n\u003ch2\u003eEditing CSS\u003c/h2\u003e\n\u003cp\u003e\u003ca href=\"http://compass-style.org/install/\"\u003eCompass\u003c/a\u003e is a CSS preprocessor used to compile\nSCSS/SASS into CSS. We chose SCSS for the new slide deck for maintainability,\neasier browser compatibility, and because...it's the future!\u003c/p\u003e\n\u003cp\u003eThat said, if not comfortable working with SCSS or don't want to learn something\nnew, not a problem. The generated .css files can already be found in\n(see \u003ca href=\"theme/css\"\u003e\u003ccode\u003e/theme/css\u003c/code\u003e\u003c/a\u003e). You can just edit those and bypass SCSS altogether.\nHowever, our recommendation is to use Compass. It's super easy to install and use.\u003c/p\u003e\n\u003ch3\u003eInstalling Compass and making changes\u003c/h3\u003e\n\u003cp\u003eFirst, install compass:\u003c/p\u003e\n\u003cpre\u003e\u003ccode\u003esudo gem update --system\nsudo gem install compass\n\u003c/code\u003e\u003c/pre\u003e\n\u003cp\u003eNext, you'll want to watch for changes to the exiting .scss files in \u003ca href=\"theme/scss\"\u003e\u003ccode\u003e/theme/scss\u003c/code\u003e\u003c/a\u003e\nand any new one you add:\u003c/p\u003e\n\u003cpre\u003e\u003ccode\u003e$ cd io-2012-slides\n$ compass watch\n\u003c/code\u003e\u003c/pre\u003e\n\u003cp\u003eThis command automatically recompiles the .scss file when you make a change.\nIts corresponding .css file is output to \u003ca href=\"theme/css\"\u003e\u003ccode\u003e/theme/css\u003c/code\u003e\u003c/a\u003e. Slick.\u003c/p\u003e\n\u003cp\u003eBy default, \u003ca href=\"config.rb\"\u003e\u003ccode\u003econfig.rb\u003c/code\u003e\u003c/a\u003e in the main project folder outputs minified\n.css. It's a best practice after all! However, if you want unminified files,\nrun watch with the style output flag:\u003c/p\u003e\n\u003cpre\u003e\u003ccode\u003ecompass watch -s expanded\n\u003c/code\u003e\u003c/pre\u003e\n\u003cp\u003e\u003cem\u003eNote:\u003c/em\u003e You should not need to edit \u003ca href=\"theme/scss/_base.scss\"\u003e\u003ccode\u003e_base.scss\u003c/code\u003e\u003c/a\u003e.\u003c/p\u003e\n\u003ch2\u003eRunning the slides\u003c/h2\u003e\n\u003cp\u003eThe slides can be run locally from \u003ccode\u003efile://\u003c/code\u003e making development easy :)\u003c/p\u003e\n\u003ch3\u003eRunning from a web server\u003c/h3\u003e\n\u003cp\u003eIf at some point you should need a web server, use \u003ca href=\"serve.sh\"\u003e\u003ccode\u003eserve.sh\u003c/code\u003e\u003c/a\u003e. It will\nlaunch a simple one and point your default browser to \u003ca href=\"http://localhost:8000/template.html\"\u003e\u003ccode\u003ehttp://localhost:8000/template.html\u003c/code\u003e\u003c/a\u003e:\u003c/p\u003e\n\u003cpre\u003e\u003ccode\u003e$ cd io-2012-slides\n$ ./serve.sh\n\u003c/code\u003e\u003c/pre\u003e\n\u003cp\u003eYou can also specify a custom port:\u003c/p\u003e\n\u003cpre\u003e\u003ccode\u003e$ ./serve.sh 8080\n\u003c/code\u003e\u003c/pre\u003e\n\u003ch3\u003ePresenter mode\u003c/h3\u003e\n\u003cp\u003eThe slides contain a presenter mode feature (beta) to view + control the slides\nfrom a popup window.\u003c/p\u003e\n\u003cp\u003eTo enable presenter mode, add \u003ccode\u003epresentme=true\u003c/code\u003e to the URL: \u003ca href=\"http://localhost:8000/template.html?presentme=true\"\u003ehttp://localhost:8000/template.html?presentme=true\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003eTo disable presenter mode, hit \u003ca href=\"http://localhost:8000/template.html?presentme=false\"\u003ehttp://localhost:8000/template.html?presentme=false\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003ePresenter mode is sticky, so refreshing the page will persist your settings.\u003c/p\u003e\n\u003chr /\u003e\n\u003cp\u003eThat's all she wrote!\u003c/p\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsamdutton%2Fvideo2014","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsamdutton%2Fvideo2014","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsamdutton%2Fvideo2014/lists"}