diff --git a/_includes/footer.html b/_includes/footer.html index 0688030..9bde835 100644 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -1,3 +1,9 @@ diff --git a/_includes/navigation.html b/_includes/navigation.html index 44e0bc1..81f03d5 100644 --- a/_includes/navigation.html +++ b/_includes/navigation.html @@ -1,75 +1,47 @@ - - - - - - - - - - - - - +
  • + Speaker Pay +
  • +
  • Tech Women Keynoting +
  • +
  • Tech Girls Speaking +
  • +
  • Resources for Speakers
  • + + +
    +

    Advocacy

    + +
    + diff --git a/_includes/sidenavigation.html b/_includes/sidenavigation.html new file mode 100644 index 0000000..99efb21 --- /dev/null +++ b/_includes/sidenavigation.html @@ -0,0 +1,15 @@ + + diff --git a/_layouts/default.html b/_layouts/default.html index 4ed19be..3472752 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -4,11 +4,12 @@ - - + + + - + - {% include twitter-feed.html %} - - - + +
    +
    +
    +

    + {{ page.title }} +

    + + {{ content }} +
    + + -
    -
    - + + + {% include footer.html %} + + + diff --git a/code-of-conduct.md b/code-of-conduct.md index dd41770..53e24a7 100644 --- a/code-of-conduct.md +++ b/code-of-conduct.md @@ -7,7 +7,7 @@ All attendees, speakers, sponsors and volunteers at CallbackWomen events are req ## Need Help? -Contact the event organizer who is identified on the event’s meetup page and introduced at the outset of the event. Written reports can be made anonymously at [https://callbackwomen.wufoo.com/forms/code-of-conduct-report/](https://callbackwomen.wufoo.com/forms/code-of-conduct-report/) +Contact the event organizer who is identified on the event’s meetup page and introduced at the outset of the event. Written reports can be made anonymously at [our Conduct Report Form](https://callbackwomen.wufoo.com/forms/code-of-conduct-report/) ## The Quick Version @@ -27,6 +27,6 @@ Sponsors are also subject to the anti-harassment policy. In particular, sponsors If a participant engages in harassing behavior, the organizers may take any action they deem appropriate, including warning the offender or expulsion from the event with no refund. -If you are being harassed, notice that someone else is being harassed, or have any other concerns, please contact a member of event staff immediately. Event staff can be identified as they'll be wearing staff name badges. Written reports can be made anonymously at [https://callbackwomen.wufoo.com/forms/code-of-conduct-report/](https://callbackwomen.wufoo.com/forms/code-of-conduct-report/) +If you are being harassed, notice that someone else is being harassed, or have any other concerns, please contact a member of event staff immediately. Event staff can be identified as they'll be wearing staff name badges. Written reports can be made anonymously at [our Conduct Report Form](https://callbackwomen.wufoo.com/forms/code-of-conduct-report/). Event staff will be happy to help participants contact venue security or local law enforcement, or otherwise assist those experiencing harassment to feel safe for the duration of the event. We value your attendance. \ No newline at end of file diff --git a/donate.md b/donate.md index 9a87c23..8d1342f 100644 --- a/donate.md +++ b/donate.md @@ -3,7 +3,7 @@ title: "Donate" layout: default --- -Since 2013, CallbackWomen has been making [substantial impacts](testimonials.htm). Those results are entirely from volunteer labor: several thousand hours spent on doing research, creating [resources](http://storify.com/cczona), advocating, [interviewing](), holding [trainings](trainings.html), promoting speakers, and publizing conferences. +Since 2013, CallbackWomen has been making [substantial impacts](testimonials.html). Those results are entirely from volunteer labor: several thousand hours spent on doing research, creating [resources](http://storify.com/cczona), advocating, [interviewing](), holding [trainings](trainings.html), promoting speakers, and publizing conferences. Individuals, conferences, and companies benefit financially. Please give back. Your donation is affirmation that you value the work and results. Your donation helps make it sustainable to accomplish more. diff --git a/images/bg/blur-women-shorter.jpg b/images/bg/blur-women-shorter.jpg new file mode 100644 index 0000000..0c96915 Binary files /dev/null and b/images/bg/blur-women-shorter.jpg differ diff --git a/images/bg/blur-women.jpg b/images/bg/blur-women.jpg new file mode 100644 index 0000000..154cd0a Binary files /dev/null and b/images/bg/blur-women.jpg differ diff --git a/images/bg/women.jpg b/images/bg/women.jpg new file mode 100644 index 0000000..db1b4f6 Binary files /dev/null and b/images/bg/women.jpg differ diff --git a/images/callbackwomen-logo-tp.png b/images/callbackwomen-logo-tp.png new file mode 100644 index 0000000..686f9be Binary files /dev/null and b/images/callbackwomen-logo-tp.png differ diff --git a/images/callbackwomen-logo-white.png b/images/callbackwomen-logo-white.png new file mode 100644 index 0000000..6cb5392 Binary files /dev/null and b/images/callbackwomen-logo-white.png differ diff --git a/index.md b/index.md index bba1253..fc8987b 100644 --- a/index.md +++ b/index.md @@ -4,7 +4,7 @@ layout: default --- -## Mission +## Our Mission The mission of [CallbackWomen](http://twitter.com/callbackwomen) is to radically expand gender diversity at the podium of professional programmers' conferences. It's about [**all** genders underrepresented in tech](#underrepresented), including non-binary, gender nonconforming, trans women, trans men, cis women, and more. @@ -14,7 +14,7 @@ CallbackWomen **remakes norms**. Since 2013, CallbackWomen's work of advocacy, e ## What We Do -CallbackWomen focus is on serving organizers and speakers. The testimonials page shares individual stories of its impact, from the perspectives of [a long-time conference organizer](personal-stories.html) and [speakers](personal-stories.html#speakers). +CallbackWomen focus is on serving organizers and speakers. The testimonials page shares individual stories of its impact, from the perspectives of [a long-time conference organizer](testimonials.html#jan-lehnardt-organizer) and [speakers](testimonials.html). ### Organizers @@ -24,7 +24,7 @@ CallbackWomen focus is on serving organizers and speakers. The testimonials page * Advocating for innovative ways to increase diversity among attendees * Pushing back on assumptions about gender, experience, and qualifications * Amplifing their fellow conference organizers' diversity and diversity commitments, models, and successes -* Educating them about the [Code of Conduct Pledge](http://twitter.com/cocpledge)(#cocpledge)[https://twitter.com/search?q=cocpledge] impact on sponsorship, ticket sales, volunteerism, and speaker participation +* Educating them about the [Code of Conduct Pledge](http://twitter.com/cocpledge) [(#cocpledge)](https://twitter.com/search?q=cocpledge) impact on sponsorship, ticket sales, volunteerism, and speaker participation * Supporting them in adopting codes of conduct (CoCs), and showing conference organizers handling CoC enforcement well * Normalizing expectations of gender diversity at the podium * Exposing them to highly qualified speakers who are women, as well as (*upon individuals' permission*) genderqueer & gender non-conforming @@ -50,7 +50,7 @@ CallbackWomen is about every person whose gender is underrepresented in tech. `W Being non-consensually positioned in a context called `*Women` implictly misgenders a gender non-binary person or a trans man. CallbackWomen enthusiastically promotes the work of speakers who are gender non-binary and speakers who are trans men, *if the speaker has given personal consent to*. -[^1]: More info: http://itspronouncedmetrosexual.com/2013/01/a-comprehensive-list-of-lgbtq-term-definitions/ +[^1]: More info on [It's pronounced metrosexual](http://itspronouncedmetrosexual.com/2013/01/a-comprehensive-list-of-lgbtq-term-definitions/) diff --git a/javascript/main.js b/javascript/main.js new file mode 100644 index 0000000..e653288 --- /dev/null +++ b/javascript/main.js @@ -0,0 +1,11 @@ +/* Set the width of the side navigation to 250px and the left margin of the page content to 250px and add a black background color to body */ +function openNav() { + document.getElementById("sidenav").style.width = "250px"; + document.getElementById("main").style.marginLeft = "250px"; +} + +/* Set the width of the side navigation to 0 and the left margin of the page content to 0, and the background color of body to white */ +function closeNav() { + document.getElementById("sidenav").style.width = "0"; + document.getElementById("main").style.marginLeft = "0"; +} \ No newline at end of file diff --git a/javascripts/main.js b/javascripts/main.js deleted file mode 100644 index d8135d3..0000000 --- a/javascripts/main.js +++ /dev/null @@ -1 +0,0 @@ -console.log('This would be the main JS file.'); diff --git a/resources-for-speakers.md b/resources-for-speakers.md index 13c1773..114814c 100644 --- a/resources-for-speakers.md +++ b/resources-for-speakers.md @@ -3,7 +3,7 @@ title: "Resources for Speakers" layout: default --- -It's hard to find opportunities to speak at programming conferences. For people who are underrepresented in the programming field, it's especially daunting. CallbackWomen digs up the opportunities. We also try to get other crucial information for you, such as travel funding and code of conduct policy. More than 90 CFPs open up every month for 1,300 professional programmers' conferences. Follow @CallbackWomen on Twitter to discover opportunities and resources +It's hard to find opportunities to speak at programming conferences. For people who are underrepresented in the programming field, it's especially daunting. CallbackWomen digs up the opportunities. We also try to get other crucial information for you, such as travel funding and code of conduct policy. More than 90 CFPs open up every month for 1,300 professional programmers' conferences. Follow @CallbackWomen on Twitter to discover opportunities and resources. --- @@ -11,35 +11,28 @@ It's hard to find opportunities to speak at programming conferences. For people ### Why Attend -Peers. Do you crave having more? Feel isolated from others who do what you do? Conferences connect people. You carry that sense of connectedness back home with you. - -Sense of connection to something bigger. Pride in being part of that community. - -i18n. Random chats w/devs from elsewhere -> unexpected insights re internationalization probs - -have/hear different discussions than the same predictable stuff at the office. ++ **Peers**. Do you crave having more? Feel isolated from others who do what you do? Conferences connect people. You carry that sense of connectedness back home with you. ++ **Sense of connection to something bigger**. Pride in being part of that community. ++ **Random chats w/devs from elsewhere**. That leads to unexpected insights regarding internationalization problems. ++ **Have/hear different discussions** than the same predictable stuff at the office. ### Why Speak -"I would really love to discuss that w/you more…" Surprising opportunities come out of those. - -ppl who you admire introduce self to you, recognize you as peer, become fan of your work too! (including “well-known” ppl you thought would never talk to you!) - -challenge. Nudge self to learn, then share, something new b/c you've proposed to talk abt it. +"I would really love to discuss that w/you more..." Surprising opportunities come out of those discussions. -thought leadership. Speaking abt a topic can earn rep as someone whose thoughts on it matter. +People who you admire introduce themselves to you, recognize you as their peer, and become fans of your work too! (Including “well-known” people you thought would never talk to you!) -i18n. Random chats w/devs from elsewhere -> unexpected insights re internationalization probs +Challenge. Nudge self to learn, then share, something new because you've proposed to talk about it. -facilitates introverts. Speakers get introduced to amazing ppl. Insight-filled conversations! +Thought leadership. Speaking abt a topic can earn rep as someone whose thoughts on it matter. -conversation. Opportunity to have interesting conversations that you can't have anywhere else +Facilitates introverts. Speakers get introduced to amazing people. Insight-filled conversations! -network. Speakers get to expand network organically, and across range of locations & topics. +Conversation. Opportunity to have interesting conversations that you can't have anywhere else -network. Speakers get to expand network organically, and across range of locations & topics. +Network. Speakers get to expand network organically, and across range of locations & topics. -Free ticket. +Get a free ticket to the conference! --- diff --git a/stylesheets/callbackwomen.css b/stylesheets/callbackwomen.css index 98ef568..e6e9f35 100644 --- a/stylesheets/callbackwomen.css +++ b/stylesheets/callbackwomen.css @@ -3,18 +3,65 @@ body font-size: .95em; } -.inner -{ - width: 75%; +.inner { + width: 90%; + max-width: 1200px; } -#branding -{ +#branding { text-align: center; - border: 1px solid grey; - background-color: white; - margin: 2em 0 2em 0; - padding: 2.5em; + margin: 0 0 1.5em 0; + position: relative; + padding: 0; + background-color: #62A0D6; +} +#branding a { + display: block; position: relative; +} +#branding .logo-menu { + /*position: absolute; top:0; left:0; right: 0;*/ + background:rgba(255,255,255,0.2); + color:#fff; +} +#branding .logo-menu a#logo { + display: inline-block; + padding: 5px 0; +} +#branding .logo-menu img { + margin:0 auto; + max-width: 400px; + height: auto; + width: inherit; +} + +#branding .logo-menu #opennav { + padding: 10px 16px; + display: inline-block; + font-size: 18px; + position: absolute; + vertical-align: top; + top:13%; + left:0; +} +#branding .quote { + font-weight:bold; + margin: 0 auto; + padding:3em 0; + left:0; + right: 0; +} +#branding .quote h1 { + font-size: 4rem; + font-family: 'Poppins', Century Gothic, sans-serif; + color:#fff; +} +#donate { + text-align: center; + margin: 0 auto; +} +#donate h3 { + color:#000; + margin-bottom: 0.5em; } #page-primary-content @@ -57,7 +104,7 @@ body width: 30% !important; padding-top: 1em; padding-right: 1em; - padding-top: 3.75em; + padding-top: 1em; padding-left: 1em; } @@ -77,28 +124,58 @@ nav font-size: 100%; } -#nav table -{ - border-collapse: collapse; +/* The side navigation menu */ +.sidebarnav { + height: 100%; /* 100% Full-height */ + width: 0; /* 0 width - change this with JavaScript */ + position: fixed; /* Stay in place */ + z-index: 1; /* Stay on top */ + top: 0; + left: 0; + background-color: #0C0C0C; /* Black*/ + overflow-x: hidden; /* Disable horizontal scroll */ + padding-top: 60px; /* Place content 60px from the top */ + transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */ } - -#nav table, #nav tr, #nav td -{ - border: none; +.sidebarnav h3 {color: #CE374E; padding: 8px 8px 8px 28px;} +/* The navigation menu links */ +.sidebarnav a { + padding: 8px 8px 8px 28px; + text-decoration: none; + font-size: 16px; + color: #fff; + display: block; + transition: 0.3s } -#nav ul -{ - font-size: 90%; +.sidebarnav li {list-style: none; margin: 0; padding: 0;} + +/* When you mouse over the navigation links, change their color */ +.sidebarnav a:hover, .offcanvas a:focus{ + background-color: #4D7EA8; + color:#fff; } -#nav td -{ - width: 50%; - text-align: left; - vertical-align: top; +/* Position and style the close button (top right corner) */ +.sidebarnav .closebtn { + position: absolute; + top: 0; + right: 25px; + font-size: 36px; + margin-left: 50px; + color: #fff; + padding: 0; + margin: 0; } +.sidebarnav .closebtn:hover {background: transparent;} + +.sidebarnav #navdonate { + background:#CE374E; + text-transform: uppercase;} +.sidebarnav #navdonate a { + color: #fff; +} #nav ol, #nav p { @@ -110,6 +187,7 @@ nav { list-style: none; padding-left: 0; + margin: 0; } .footnotes @@ -130,7 +208,7 @@ nav h2, h3, h4, h5, h6 { - margin-bottom: 0; + margin-bottom: 0.4em; } /*superscripts*/ @@ -162,4 +240,55 @@ sub { /* Move the subscripted text down, but only half as far down as the superscript moved up */ bottom: -0.25em; +} + + +/* #Media Queries +================================================== */ + +/* Smaller than standard 960 (devices and browsers) */ +@media only screen and (max-width: 959px) { + #branding .logo-menu #opennav {top: 0; font-size: 18px;} + #branding .quote h1 {font-size: 3.5rem;} + #branding .logo-menu img {max-width: 280px;} +} + +/* All Mobile Sizes (devices and browser) */ +@media only screen and (max-width: 767px) { + #branding .logo-menu #opennav {top: 0; font-size: 16px;} + #branding .logo-menu img {max-width: 400px;} + #page-primary-content {width: 100%; float: none;} + #sidebar {width: 100% !important; float: none;} + #sidebar #twitter-feed {text-align: center;} + #branding .quote { + background-color: #62A0D6; + margin: 0; + bottom: 0; + top: auto; + padding: 16px 10px; + } + #branding .quote h1 { + color: #fff; + text-shadow: none; + font-size: 2.5rem; + } +} + +/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ +@media only screen and (min-width: 480px) and (max-width: 767px) {} + +/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ +@media only screen and (max-width: 479px) { + #branding .logo-menu img {max-width: 200px;} + #branding .logo-menu {float:right; padding: 6px;} + #branding .quote {padding:10px;} + #branding .quote h1 { + font-size: 1.7rem; + } +} + +/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */ +@media screen and (max-height: 450px) { + .sidenav {padding-top: 15px;} + .sidenav a {font-size: 18px;} } \ No newline at end of file diff --git a/stylesheets/stylesheet.css b/stylesheets/stylesheet.css index 5567ef0..0ced5b4 100644 --- a/stylesheets/stylesheet.css +++ b/stylesheets/stylesheet.css @@ -23,6 +23,7 @@ time, mark, audio, video { vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ +body {width: 100%;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; @@ -46,31 +47,27 @@ table { border-spacing: 0; } -/* LAYOUT STYLES */ +img {max-width: 100%; height: auto;} +/************************************ +*** LAYOUT STYLES *** +*************************************/ body { - font-size: 1em; + font-size: 1rem; line-height: 1.5; - background: #e7e7e7 url(../images/body-bg.png) 0 0 repeat; - font-family: 'Helvetica Neue', Helvetica, Arial, serif; - text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); - color: #6d6d6d; + background: #fff; + font-family: 'Poppins', Century Gothic, sans-serif; + color: #000; } +h1, h2, h3, h4, h5 {font-family: 'Libre Baskerville', serif;} a { - color: #d5000d; + color: #CE374E; } a:hover { - color: #c5000c; -} - -header { - padding-top: 35px; - padding-bottom: 25px; + color: #8B2635; } header h1 { - font-family: 'Chivo', 'Helvetica Neue', Helvetica, Arial, serif; font-weight: 900; - letter-spacing: -1px; font-size: 48px; color: #303030; line-height: 1.2; @@ -85,10 +82,15 @@ header h2 { } #container { - background: transparent url(../images/highlight-bg.jpg) 50% 0 no-repeat; min-height: 595px; } +.wrapper { + max-width: 1200px; + margin: 0 auto; + position: relative; +} + .inner { width: 620px; margin: 0 auto; @@ -152,6 +154,23 @@ a.button span { height: 23px; } +button.donate { + background-color: #4357AD; + color: #fff; + border:none; + -moz-border-radius: 4px; + -webkit-border-radius: 4px; + border-radius: 12px; + transition: background-color 0.3s ease, border 0.3s ease; + font-size: 1.5rem; + padding: 8px 20px; + text-transform: uppercase; +} +button.donate:hover { + background-color: #8B2635; + border:none; +} + #download-zip span { background: transparent url(../images/zip-icon.png) 12px 50% no-repeat; } @@ -252,7 +271,7 @@ h2 { } h3 { - color: #d5000d; + color: #8B2635; font-size: 18px; font-weight: bold; margin-bottom: 8px; @@ -276,7 +295,8 @@ h6 { p { font-weight: 300; - margin-bottom: 20px; + margin-bottom: 1em; + font-size: 1.1rem; } a { @@ -295,8 +315,12 @@ blockquote { } ul li { - list-style: disc inside; - padding-left: 20px; + list-style: disc; + margin-left: 40px; + font-weight: 300; + font-size: 1.1rem; + line-height: 1.5em; + padding-bottom: 2px; } ol li { @@ -309,21 +333,34 @@ dl dt { } footer { - background: transparent url('../images/hr.png') 0 0 no-repeat; + background:#828489; margin-top: 40px; padding-top: 20px; padding-bottom: 30px; font-size: 13px; - color: #aaa; + color: #fff; + text-align: center; } - +footer p {line-height: 1.4em;} +footer p a {color: #62A0D6; background:none; padding: 0;} footer a { - color: #666; + font-weight: bold; color:#fff; background-color: #62A0D6; padding:4px; display: inline-block; } footer a:hover { - color: #444; + background-color: #4D7EA8; color: #fff; } - +footer #navdonate a { + background-color: #CE374E; +} +footer #navdonate a:hover { + background-color: #F7425D; +} +footer ul {list-style: none; margin: 0 auto;} +footer li { + display: inline-block; padding:0 4px; + margin: 0 0 10px 0; +} +footer li a {padding:6px 12px;} /* MISC */ .clearfix:after { clear: both; @@ -337,11 +374,29 @@ footer a:hover { * html .clearfix {height: 1%;} .clearfix {display: block;} +/* custom */ + +.flex-row { + display: flex; /* or inline-flex */ + flex-direction: row; + flex-wrap:wrap; + justify-content:space-between; + align-items: flex-start; +} + +.flex-row .col { + margin: 0 auto; + align-self: flex-start; +} + + /* #Media Queries ================================================== */ /* Smaller than standard 960 (devices and browsers) */ -@media only screen and (max-width: 959px) {} +@media only screen and (max-width: 959px) { + +} /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 959px) {} @@ -358,10 +413,12 @@ footer a:hover { #download-zip, #download-tar-gz { display: none; } - .inner { - width: 94%; - margin: 0 auto; - } + + .flex-row .col {width: 48%; margin: 0 auto; text-align: center;} +} + +@media only screen and (max-width: 600px) { + .flex-row .col {width: 100%;} } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @@ -372,12 +429,4 @@ footer a:hover { -/* custom */ - -nav .columns { -column-count:2; --moz-column-count:2; --webkit-column-count: 2; -column-width: 100px; -} diff --git a/test.md b/test.md deleted file mode 100644 index 7a0258f..0000000 --- a/test.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: "Test" -layout: default ---- - - -
    - -
    \ No newline at end of file diff --git a/trainings.md b/trainings.md index 745286f..3e4743c 100644 --- a/trainings.md +++ b/trainings.md @@ -32,7 +32,7 @@ It's a delight afterward to here from women announcing that they put in their fi #### Be a Workshop Sponsor! -Expanding the workshop makes it possible to give attendees more individualized coaching on conference targeting and writing abstracts. These are crucial takeaways. **To sponsor a CallbackWomen workshop, ping via [Twitter](https://twitter.com/callbackwomen) or [email](callbackwomen@gmail.com).** +Expanding the workshop makes it possible to give attendees more individualized coaching on conference targeting and writing abstracts. These are crucial takeaways. **To sponsor a CallbackWomen workshop, ping via [Twitter](https://twitter.com/callbackwomen) or [email](mailto:callbackwomen@gmail.com).** ## Meetups @@ -41,7 +41,7 @@ Expanding the workshop makes it possible to give attendees more individualized c An adaptation of the workshop's part 1, given instead as a standalone talk/Q&A. -* [Girl Develop It](www.meetup.com/Girl-Develop-It-Chicago-IL/events/184039012/) Chicago +* [Girl Develop It](http://www.meetup.com/Girl-Develop-It-Chicago-IL/events/184039012/) Chicago * [RailsGirls](http://www.meetup.com/Enspiral-Dev-Academy-Meetup/events/223571001/) Wellington * [PyLadies](http://www.meetup.com/PyLadies-ATX/events/225068177/) Austin