Mercurial > public > dvcs_intro_brownbag
view my_theme/css/screen.css @ 16:048e5aea6d36 tip
Updates for June 2012 presentation.
author | Brian Neal <bgneal@gmail.com> |
---|---|
date | Mon, 25 Jun 2012 19:51:34 -0500 |
parents | 727c48601d66 |
children |
line wrap: on
line source
body { font: 14px "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; background: #778; padding: 0; margin: 0; overflow: hidden; } div.presentation { position: absolute; width: 100%; display: table-cell; vertical-align: middle; height: 100%; background: inherit; } div.presentation > h1 { display: none; } div.slides, body.expose div.slides.nocontext { width: 100%; height: 100%; left: 0; top: 0; position: absolute; display: block; } div.slides.nocontext { width: 900px; margin: 0 auto; overflow: hidden; position: relative; left: auto; top: auto; } div.slide { display: inline; position: absolute; overflow: hidden; width: 900px; height: 700px; margin-top: -350px; margin-left: -400px; left: 50%; top: 50%; background: -webkit-gradient(linear, left bottom, left top, from(#bbd), to(#fff)); background-color: #eee; background: -moz-linear-gradient(bottom, #bbd, #fff); -webkit-transition: margin 0.25s ease-in-out; -moz-transition: margin 0.25s ease-in-out; -o-transition: margin 0.25s ease-in-out; border-top-left-radius: 20px; -moz-border-radius-topleft: 20px; -webkit-border-top-left-radius: 20px; border-top-right-radius: 20px; -moz-border-radius-topright: 20px; -webkit-border-top-right-radius: 20px; border-bottom-right-radius: 20px; -moz-border-radius-bottomright: 20px; -webkit-border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; -moz-border-radius-bottomleft: 20px; -webkit-border-bottom-left-radius: 20px; } /* Expose */ body.expose div.slides { float: left; position: relative; overflow: auto; margin-bottom: 10px; } body.expose div.slide { display: block; float: left; position: relative; left: auto !important; top: auto !important; margin: 10px !important; -webkit-transition: none; -moz-transition: none; -o-transition: none; -moz-transform: scale(.33, .33); -moz-transform-origin: 0 0; -webkit-transform: scale(.33, .33); -webkit-transform-origin: 0 0; -o-transform: scale(.33, .33); -o-transform-origin: 0 0; -webkit-transition: none; -moz-transition: none; -o-transition: none; cursor: pointer; } body.expose div.slide:hover { background: -webkit-gradient(linear, left bottom, left top, from(#bdd), to(#fff)); background-color: #eee; background: -moz-linear-gradient(bottom, #bdd, #fff); } body.expose .slide-wrapper { float: left; position: relative; margin: .5%; width: 300px; height: 233px; } body.expose .slide footer { } body.expose .slide .inner { } body.expose .slide.far-past, body.expose .slide.past, body.expose .slide.future, body.expose .slide.far-future { margin-left: 0; } body.expose .slide.current { background: -webkit-gradient(linear, left bottom, left top, from(#ddb), to(#fff)); background-color: #eee; background: -moz-linear-gradient(bottom, #ddb, #fff); border: 16px solid #fff; -moz-transform: scale(.315, .315); -moz-transform-origin: 0 0; -webkit-transform: scale(.315, .315); -webkit-transform-origin: 0 0; -o-transform: scale(.315, .315); -o-transform-origin: 0 0; } /* Presenter Mode */ body.presenter_view div.slide { display: inline; position: absolute; overflow: hidden; -moz-transform: scale(.5, .5); -moz-transform-origin: 0 0; -webkit-transform: scale(.5, .5); -webkit-transform-origin: 0 0; -o-transform: scale(.5, .5); -o-transform-origin: 0 0; margin-top: -300px; } body.presenter_view .slide.far-past { display: block; margin-left: -1500px; } body.presenter_view .slide.past { display: block; margin-left: -975px; } body.presenter_view .slide.current { display: block; margin-left: -475px; border: 8px solid maroon; z-index: 2; } body.presenter_view .slide.future { display: block; margin-left: 25px; z-index: 1; } body.presenter_view .slide.far-future { display: block; margin-left: 525px; } body.presenter_view div#current_presenter_notes { visibility: visible; display: block; position: absolute; overflow: auto; vertical-align: middle; left: 50%; top: 50%; margin-left: -475px; margin-top: 100px; z-index: 2; width: 950px; border-style: solid; height: 30%; background-color: silver; } body.presenter_view div#current_presenter_notes section { font-family: "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; color: black; text-shadow: rgba(0, 0, 0, 0.2) 0 2px 5px; display: block; overflow: visible; position: relative; background-color: #fffeff; height: 120px; margin-right: 30px; margin-top: 60px; margin-left: 30px; padding-right: 10px; padding-left: 10px; padding-top: 10px; } body.presenter_view div#current_presenter_notes section p { margin: 0; } body.presenter_view div#current_presenter_notes h1 { font-size: 50%; display: block; } div#current_presenter_notes { display: none; } div.slide div.presenter_notes, div.slides div.presenter_notes { display: none; } /* Slide styles */ div.slide p { font-size: 20px; } .slide.far-past { display: block; margin-left: -2400px; } .slide.past { display: block; margin-left: -1400px; } .slide.current { display: block; margin-left: -450px; } .slide.future { display: block; margin-left: 500px; } .slide.far-future { display: block; margin-left: 1500px; } body.three-d div.slides { -webkit-transform: translateX(50px) scale(0.8) rotateY(10deg); -moz-transform: translateX(50px) scale(0.8) rotateY(10deg); -o-transform: translateX(50px) scale(0.8) rotateY(10deg); } /* Content */ header:not(:only-child) { font-family: "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; font-weight: normal; font-size: 50px; letter-spacing: -.05em; color: black; text-shadow: rgba(0, 0, 0, 0.2) 0 2px 5px; position: absolute; left: 30px; top: 25px; margin: 0; padding: 0; } header h1, header h2, header h3, header h4, header h5, header h6 { display: inline; font-size: 100%; font-weight: normal; padding: 0; margin: 0; } header h2:first-child { margin-top: 0; } section, .slide header:only-child h1 { font-family: "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; color: #3f3f3f; text-shadow: rgba(0, 0, 0, 0.2) 0 2px 5px; margin-left: 30px; margin-right: 30px; margin-top: 100px; display: block; overflow: hidden; } img { display: block; margin: auto; } section img.align-center { display: block; margin-left: auto; margin-right: auto; } section img.align-right { display: block; margin-left: auto; margin-right: 0; } section img.align-left { display: block; margin-right: auto; margin-left: 0; } a { color: inherit; display: inline-block; text-decoration: none; line-height: 110%; border-bottom: 2px solid #3f3f3f; } pre { font-size: 16px; font-family: Monaco, Courier, monospace; } li { padding: 10px 0; font-size: 20px; } .slide header:only-child h1 { line-height: 180%; text-align: center; display: table-cell; vertical-align: middle; height: 700px; width: 900px; font-size: 50px; margin-top:100px; margin-bottom:100px; } .sidebar { clear: both; background: -webkit-gradient(linear, top right, bottom right, from(#dde), to(#fff)); -webkit-transition: margin 0.25s ease-in-out; background-color: #eee; background: -moz-linear-gradient(right, #dde, #fff); border-right: 5px solid #ccd; z-index: 9999999; height: 100%; overflow: hidden; top: 0; position: absolute; display: block; margin: 0; margin-left: -400px; padding: 10px 16px; overflow: auto; -webkit-transition: margin 0.2s ease-in-out; -moz-transition: margin 0.2s ease-in-out; -o-transition: margin 0.2s ease-in-out; } .sidebar h2 { text-shadow: rgba(0, 0, 0, 0.2) 0 2px 5px; margin: 0 0 16px; padding: 0; } .sidebar table { width: 100%; margin: 0; padding: 0; border-collapse: collapse; } .sidebar table caption { display: none; } .sidebar tr { margin: 2px 0; border-bottom: 1px solid #ccc; } .sidebar th { text-align: left; font-weight: normal; max-width: 300px; overflow: hidden; } .sidebar tr.sub th { text-indent: 20px; } .sidebar td { text-align: right; min-width: 20px; } .sidebar a { display: block; text-decoration: none; border-bottom: none; padding: 4px 0; } .sidebar tr.active { background: #ff0; } aside { display: none; } aside.source { position: absolute; bottom: 6px; left: 10px; text-indent: 10px; } aside.page_number { position: absolute; bottom: 6px; right: 10px; text-indent: 10px; } .notes { display: none; padding: 10px; background: #ccc; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; } div.slide p.notes { font-size: 90%; } /* Pygments default theme */ .hll { background-color: #ffffcc } .c { color: #408080; font-style: italic } /* Comment */ .err { border: 1px solid #FF0000 } /* Error */ .k { color: #008000; font-weight: bold } /* Keyword */ .o { color: #666666 } /* Operator */ .cm { color: #408080; font-style: italic } /* Comment.Multiline */ .cp { color: #BC7A00 } /* Comment.Preproc */ .c1 { color: #408080; font-style: italic } /* Comment.Single */ .cs { color: #408080; font-style: italic } /* Comment.Special */ .gd { color: #A00000 } /* Generic.Deleted */ .ge { font-style: italic } /* Generic.Emph */ .gr { color: #FF0000 } /* Generic.Error */ .gh { color: #000080; font-weight: bold } /* Generic.Heading */ .gi { color: #00A000 } /* Generic.Inserted */ .go { color: #808080 } /* Generic.Output */ .gp { color: #000080; font-weight: bold } /* Generic.Prompt */ .gs { font-weight: bold } /* Generic.Strong */ .gu { color: #800080; font-weight: bold } /* Generic.Subheading */ .gt { color: #0040D0 } /* Generic.Traceback */ .kc { color: #008000; font-weight: bold } /* Keyword.Constant */ .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */ .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */ .kp { color: #008000 } /* Keyword.Pseudo */ .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */ .kt { color: #B00040 } /* Keyword.Type */ .m { color: #666666 } /* Literal.Number */ .s { color: #BA2121 } /* Literal.String */ .na { color: #7D9029 } /* Name.Attribute */ .nb { color: #008000 } /* Name.Builtin */ .nc { color: #0000FF; font-weight: bold } /* Name.Class */ .no { color: #880000 } /* Name.Constant */ .nd { color: #AA22FF } /* Name.Decorator */ .ni { color: #999999; font-weight: bold } /* Name.Entity */ .ne { color: #D2413A; font-weight: bold } /* Name.Exception */ .nf { color: #0000FF } /* Name.Function */ .nl { color: #A0A000 } /* Name.Label */ .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */ .nt { color: #008000; font-weight: bold } /* Name.Tag */ .nv { color: #19177C } /* Name.Variable */ .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */ .w { color: #bbbbbb } /* Text.Whitespace */ .mf { color: #666666 } /* Literal.Number.Float */ .mh { color: #666666 } /* Literal.Number.Hex */ .mi { color: #666666 } /* Literal.Number.Integer */ .mo { color: #666666 } /* Literal.Number.Oct */ .sb { color: #BA2121 } /* Literal.String.Backtick */ .sc { color: #BA2121 } /* Literal.String.Char */ .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */ .s2 { color: #BA2121 } /* Literal.String.Double */ .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */ .sh { color: #BA2121 } /* Literal.String.Heredoc */ .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */ .sx { color: #008000 } /* Literal.String.Other */ .sr { color: #BB6688 } /* Literal.String.Regex */ .s1 { color: #BA2121 } /* Literal.String.Single */ .ss { color: #19177C } /* Literal.String.Symbol */ .bp { color: #008000 } /* Name.Builtin.Pseudo */ .vc { color: #19177C } /* Name.Variable.Class */ .vg { color: #19177C } /* Name.Variable.Global */ .vi { color: #19177C } /* Name.Variable.Instance */ .il { color: #666666 } /* Literal.Number.Integer.Long */ #blank { position: absolute; top: 0; left: 0; background-color: black; width: 100%; height: 100%; z-index: 64; display: none; }