From f07e3c1af97300102696c41956512d1c7f9a71da Mon Sep 17 00:00:00 2001 From: Ju Negreiros Date: Mon, 21 May 2018 17:46:52 -0300 Subject: [PATCH] Add new styles and remove styles unusable --- codigo-de-conduta.html | 124 +++++++++++++++++------------------ dist/css/style.min.css | 2 +- dist/img/left-arrow.svg | 1 + index.html | 109 +++++++++++++++--------------- js/scripts.js | 37 ----------- scss/_codigo-de-conduta.scss | 65 ++++++++++++++++++ scss/_content.scss | 25 +++++++ scss/_footer.scss | 5 -- scss/_general.scss | 11 +++- scss/_header.scss | 14 +++- scss/_main.scss | 27 +++----- scss/_members.scss | 59 ----------------- scss/style.scss | 4 +- 13 files changed, 234 insertions(+), 249 deletions(-) create mode 100644 dist/img/left-arrow.svg delete mode 100644 js/scripts.js create mode 100644 scss/_codigo-de-conduta.scss create mode 100644 scss/_content.scss delete mode 100644 scss/_footer.scss delete mode 100644 scss/_members.scss diff --git a/codigo-de-conduta.html b/codigo-de-conduta.html index 65b0175..1005cb9 100644 --- a/codigo-de-conduta.html +++ b/codigo-de-conduta.html @@ -1,72 +1,66 @@ - - - SorocabaCSS | Código de Conduta - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - + + + SorocabaCSS | Código de Conduta + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + +
+ + Back button - SorocabaCSS -
-

Código de Conduta

+

Código de Conduta

+

A organização SorocabaCSS preza pelo respeito mútuo, diversidade e bem estar de todos os participantes. Queremos que todos se sintam bem vindos, confortáveis e seguros em todas as edições do meetup, por isso fica estabelecido o seguinte código de conduta:

- -

Não serão tolerados assédio ou intimidação, sob qualquer forma, o assédio inclui comentários ofensivos e piadas referentes à gênero, identidade de gênero e expressão, orientação sexual, cor de pele, etnia, idade, deficiência, aparência física, posição política, religião ou falta dela, ou seja, que ofendam/excluam qualquer indivíduo ou grupo de indivíduos, assim como comentários ou imagens sexuais, intimidação deliberada, bullying, perseguição, fotografias ou gravações que gerem embaraço, contato físico inadequado ou atenção sexual indesejada.

- -

Solicitações para descontinuidade de comportamentos citados acima devem ser cumpridas imediatamente. Os participantes que violarem o código de conduta poderão ser expulsos do meetup e de suas próximas edições.

- -

Caso você sofra assédio ou perceba que alguém está sendo assediado, procure algum membro da equipe da organização imediatamente, denuncie a situação de forma discreta e não tome atitudes por conta própria a fim de mantermos a segurança de todos.

- -

Contamos com sua colaboração para um ambiente seguro e agradável a todas as pessoas presentes.

+

Não serão tolerados assédio ou intimidação, sob qualquer forma, o assédio inclui comentários ofensivos e piadas referentes à gênero, identidade de gênero e expressão, orientação sexual, cor de pele, etnia, idade, deficiência, aparência física, posição política, religião ou falta dela, ou seja, que ofendam/excluam qualquer indivíduo ou grupo de indivíduos, assim como comentários ou imagens sexuais, intimidação deliberada, bullying, perseguição, fotografias ou gravações que gerem embaraço, contato físico inadequado ou atenção sexual indesejada.

+

Solicitações para descontinuidade de comportamentos citados acima devem ser cumpridas imediatamente. Os participantes que violarem o código de conduta poderão ser expulsos do meetup e de suas próximas edições.

+

Caso você sofra assédio ou perceba que alguém está sendo assediado, procure algum membro da equipe da organização imediatamente, denuncie a situação de forma discreta e não tome atitudes por conta própria a fim de mantermos a segurança de todos.

+

Contamos com sua colaboração para um ambiente seguro e agradável a todas as pessoas presentes.

+
+ sorocabacss
-
-

- crafted with ♥ in 48 minutes -

-
- - - + diff --git a/dist/css/style.min.css b/dist/css/style.min.css index 329e399..57a1d37 100644 --- a/dist/css/style.min.css +++ b/dist/css/style.min.css @@ -1 +1 @@ -/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */progress,sub,sup{vertical-align:baseline}button,hr,input{overflow:visible}*,:after,:before,legend{box-sizing:border-box}legend,ul{padding:0}body,h1,h2,p,ul{margin:0}body,header,sub,sup{position:relative}header:after,header:before{position:absolute;left:0;top:0;content:'';width:100%;height:100%}.main a,.members li p{transition-duration:.2s}footer,header{text-align:center}html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{background-color:pink}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.main a,.main p,.members p{font-weight:700}ul{list-style:none}html{font-size:16px;font-family:'Space Mono',monospace}body:after{z-index:2;position:fixed;left:0;top:0;content:'';width:100%;height:5px;background:#f857a6;background:linear-gradient(to left,#f857a6,#ff5858)}.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}header{z-index:1;min-height:100vh;display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;color:#fff;background-image:url(../img/sorocaba.jpg);background-size:cover;background-position:center}header:before{z-index:-1;background:#f857a6;background:linear-gradient(to left,#f857a6,#ff5858);opacity:.5}header:after{z-index:-2;opacity:.8;background:#000}h1{font-family:Montserrat,sans-serif;font-size:2rem;color:#ff6f6f}h1 span{color:#f4cccc}.main a,.main a:visited{color:#fff}.main{margin:auto;max-width:90vw}.main p{margin:1.5rem auto}@media (min-width:768px){h1{font-size:4rem}.main p{font-size:1.1rem}}.main a{letter-spacing:1.5px;display:inline-block;padding:.75rem 1.5rem;font-size:1.2rem;border-radius:20px;background:#ff6f6f;text-decoration:none;transition-property:background,color;transition-timing-function:ease}.main a:hover{background:#ff3c3c}.members h2{letter-spacing:2px}.members ul{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:90vw;max-width:280px;margin:1rem auto;position:relative}.members li{width:40px;height:40px;margin:auto;position:relative}.members li p{opacity:0;pointer-events:none;min-width:280px;z-index:99;position:absolute;font-weight:400;padding:5px;border-radius:5px;background:rgba(0,0,0,.9);border:1px solid #fff;left:50%;transform-origin:bottom left;transform:scale(0) translateY(0) translateX(-50%);transition-property:transform,opacity;transition-timing-function:ease-in-out}.members li:hover p{opacity:1;transform:scale(1) translateY(-40px) translateX(-50%)}.members li a{border-radius:50%;overflow:hidden;display:block;width:100%;height:100%}footer{color:#ff6f6f;padding:2px 0} \ No newline at end of file +/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */progress,sub,sup{vertical-align:baseline}button,hr,input{overflow:visible}*,:after,:before,legend{box-sizing:border-box}legend,ul{padding:0}body,sub,sup{position:relative}body,h1,h2,p,ul{margin:0}header:after,header:before{content:'';height:100%;width:100%}html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}.main a,header a{text-decoration:none}b,strong{font-weight:bolder}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}ul{list-style:none}html{font-size:16px;font-family:'Space Mono',monospace}.codigo-de-conduta .button-sorocabacss,h1{font-family:Montserrat,sans-serif}body:after{z-index:2;position:fixed;left:0;top:0;content:'';width:100%;height:5px;background:#f857a6;background:linear-gradient(to left,#f857a6,#ff5858)}.github-corner{left:0;position:absolute;top:0}.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner .github-corner:hover .octo-arm{animation:none}.github-corner .github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}header{position:relative;z-index:1;min-height:100vh;-ms-flex-flow:column;flex-flow:column;color:#fff;text-align:center;background-image:url(../img/sorocaba.jpg);background-size:cover;background-position:center;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}header:after,header:before{left:0;position:absolute;top:0}header:before{z-index:-1;background:#f857a6;background:linear-gradient(to left,#f857a6,#ff5858);opacity:.5}header:after{z-index:-2;opacity:.8;background:#000}header a{color:#fff;font-size:1.2rem;padding:.5rem .5rem .5rem 1.5rem;text-align:left}h1{font-size:2rem}h1 span{color:#f4cccc}.main a,.main a:visited{color:#fff}.content{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column-reverse;flex-direction:column-reverse;height:100vh;-ms-flex-pack:center;justify-content:center;width:100%}.content .button-codigo-de-conduta{padding-bottom:1rem;text-align:center;width:100%}@media (min-width:768px){h1{font-size:4rem}.content{-ms-flex-direction:column;flex-direction:column}.content .button-codigo-de-conduta{padding-left:1.75rem;padding-top:1.5rem;text-align:left;width:100%}}.main{margin:auto;max-width:90vw}.main a{background:#ff6f6f;border-radius:10px;display:inline-block;font-size:1.2rem;font-weight:700;letter-spacing:1.5px;margin-top:1.5rem;padding:.7rem 1.3rem;transition-duration:.2s;transition-property:background,color;transition-timing-function:ease}.main a:hover{background:#ff3c3c}.codigo-de-conduta h1{margin-top:5rem;text-align:center}@media (min-width:768px){.codigo-de-conduta h1{margin-top:3rem}}.codigo-de-conduta .text{margin:auto;width:85%}.codigo-de-conduta p{font-weight:500;line-height:1.5rem;margin:1.5rem auto;text-align:left}@media (min-width:768px){.codigo-de-conduta .text{width:70%}.codigo-de-conduta p{font-size:1.1rem;text-align:center}}.codigo-de-conduta .button-sorocabacss{color:#ff6f6f;display:block;font-size:2rem;font-weight:700;margin-bottom:2rem;padding-left:0;text-align:center}.codigo-de-conduta .button-sorocabacss span{color:#f4cccc}.codigo-de-conduta .button-back{left:0;margin-top:.5rem;position:absolute;top:0}.codigo-de-conduta .button-back img{height:40px;opacity:.8;width:40px}.codigo-de-conduta .button-back:hover img{opacity:1} \ No newline at end of file diff --git a/dist/img/left-arrow.svg b/dist/img/left-arrow.svg new file mode 100644 index 0000000..617af17 --- /dev/null +++ b/dist/img/left-arrow.svg @@ -0,0 +1 @@ + diff --git a/index.html b/index.html index 7f71792..093575c 100644 --- a/index.html +++ b/index.html @@ -1,64 +1,59 @@ - - - SorocabaCSS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - - código de conduta + + + SorocabaCSS + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + +
+ código de conduta

sorocabacss

participe
-
-
-

- crafted with ♥ in 48 minutes -

-
- - - + +
+ diff --git a/js/scripts.js b/js/scripts.js deleted file mode 100644 index edcac9b..0000000 --- a/js/scripts.js +++ /dev/null @@ -1,37 +0,0 @@ - -var container = document.getElementById("members"); - -console.log(container); - -fetch('https://api.github.com/repos/sorocabacss/sorocabacss.github.io/contributors') - .then(function(response) { - return response.json(); - }).then(function(json) { - json.map(function(user) { - return fetch(user.url).then(function(response) { - return response.json(); - }).then(function(user) { - - var li = document.createElement('li'); - var link = document.createElement('a'); - var image = document.createElement('img'); - var tooltip = document.createElement('p'); - - image.src = user.avatar_url + '&s=40'; - image.alt = user.name; - - tooltip.appendChild(document.createTextNode(user.name)); - - link.target = 'github'; - link.href = user.html_url; - - link.appendChild(image); - li.appendChild(tooltip); - li.appendChild(link); - container.appendChild(li); - }); - }); - - }).catch(function(ex) { - console.log('parsing failed', ex) - }); diff --git a/scss/_codigo-de-conduta.scss b/scss/_codigo-de-conduta.scss new file mode 100644 index 0000000..9c32899 --- /dev/null +++ b/scss/_codigo-de-conduta.scss @@ -0,0 +1,65 @@ +.codigo-de-conduta { + h1 { + margin-top: 5rem; + text-align: center; + + @media (min-width: 768px) { + margin-top: 3rem; + } + } + + .text { + margin: auto; + width: 85%; + + @media (min-width: 768px) { + width: 70%; + } + } + + p { + font-weight: 500; + line-height: 1.5rem; + margin: 1.5rem auto; + text-align: left; + + @media (min-width: 768px) { + font-size: 1.1rem; + text-align: center; + } + } + + .button-sorocabacss { + color: $bittersweet; + display: block; + font-family: 'Montserrat', sans-serif; + font-size: 2rem; + font-weight: bold; + margin-bottom: 2rem; + padding-left: 0; + text-align: center; + + span { + color: $beauty-bush; + } + } + + .button-back { + left: 0; + margin-top: .5rem; + position: absolute; + top: 0; + + img { + height: 40px; + opacity: .8; + width: 40px; + } + + &:hover { + img { + opacity: 1; + } + } + } +} diff --git a/scss/_content.scss b/scss/_content.scss new file mode 100644 index 0000000..25224f1 --- /dev/null +++ b/scss/_content.scss @@ -0,0 +1,25 @@ +.content { + align-items: center; + display: flex; + flex-direction: column-reverse; + height: 100vh; + justify-content: center; + width: 100%; + + @media (min-width: 768px) { + flex-direction: column; + } + + .button-codigo-de-conduta { + padding-bottom: 1rem; + text-align: center; + width: 100%; + + @media(min-width: 768px) { + padding-left: 1.75rem; + padding-top: 1.5rem; + text-align: left; + width: 100%; + } + } +} diff --git a/scss/_footer.scss b/scss/_footer.scss deleted file mode 100644 index ef9471b..0000000 --- a/scss/_footer.scss +++ /dev/null @@ -1,5 +0,0 @@ -footer { - color: $bittersweet; - text-align: center; - padding: 2px 0; -} diff --git a/scss/_general.scss b/scss/_general.scss index e35a6e9..731029d 100644 --- a/scss/_general.scss +++ b/scss/_general.scss @@ -22,9 +22,8 @@ html { } body { - background-color: $pink; position: relative; - + margin: 0; &:after { z-index: 2; position: fixed; @@ -38,4 +37,10 @@ body { } } -.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}} +.github-corner { + left: 0; + position: absolute; + top: 0; + + &:hover .octo-arm {animation: octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}} +} diff --git a/scss/_header.scss b/scss/_header.scss index f252617..b5bec17 100644 --- a/scss/_header.scss +++ b/scss/_header.scss @@ -9,6 +9,10 @@ header { background-image: url('../img/sorocaba.jpg'); background-size: cover; background-position: center; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; &:before { position: absolute; @@ -34,12 +38,20 @@ header { opacity: .8; background: $black; } + + a { + color: $white; + font-size: 1.2rem; + padding: .5rem; + padding-left: 1.5rem; + text-align: left; + text-decoration: none; + } } h1 { font-family: 'Montserrat', sans-serif; font-size: 2rem; - color: $bittersweet; @media (min-width: 768px) { font-size: 4rem; diff --git a/scss/_main.scss b/scss/_main.scss index 375b4e2..f2451ab 100644 --- a/scss/_main.scss +++ b/scss/_main.scss @@ -3,29 +3,18 @@ max-width: 90vw; a { - letter-spacing: 1.5px; - } - - p { - font-weight: bold; - margin: 1.5rem auto; - - @media (min-width: 768px) { - font-size: 1.1rem; - } - } - - a { - display: inline-block; - padding: .75rem 1.5rem; - font-size: 1.2rem; - border-radius: 20px; background: $bittersweet; + border-radius: 10px; color: $white; - text-decoration: none; + display: inline-block; + font-size: 1.2rem; font-weight: bold; - transition-property: background, color; + letter-spacing: 1.5px; + margin-top: 1.5rem; + padding: .7rem 1.3rem; + text-decoration: none; transition-duration: .2s; + transition-property: background, color; transition-timing-function: ease; &:visited { diff --git a/scss/_members.scss b/scss/_members.scss deleted file mode 100644 index ef7bfbd..0000000 --- a/scss/_members.scss +++ /dev/null @@ -1,59 +0,0 @@ -.members { - - h2 { - letter-spacing: 2px; - } - - p { - font-weight: bold; - } - - ul { - display: flex; - align-items: center; - justify-content: center; - width: 90vw; - max-width: 280px; - margin: 1rem auto; - position: relative; - } - - li { - width: 40px; - height: 40px; - margin: auto; - position: relative; - - p { - opacity: 0; - pointer-events: none; - min-width: 280px; - z-index: 99; - position: absolute; - font-weight: normal; - padding: 5px; - border-radius: 5px; - background: rgba($black, .9); - border: 1px solid $white; - left: 50%; - transform-origin: bottom left; - transform: scale(0) translateY(0) translateX(-50%); - transition-property: transform, opacity; - transition-duration: .2s; - transition-timing-function: ease-in-out; - } - - &:hover p { - opacity: 1; - transform: scale(1) translateY(-40px) translateX(-50%); - } - - a { - border-radius: 50%; - overflow: hidden; - display: block; - width: 100%; - height: 100%; - } - } -} diff --git a/scss/style.scss b/scss/style.scss index 946e8bc..74f5244 100644 --- a/scss/style.scss +++ b/scss/style.scss @@ -4,6 +4,6 @@ @import 'general'; @import 'header'; +@import 'content'; @import 'main'; -@import 'members'; -@import 'footer'; +@import 'codigo-de-conduta';