diff --git a/1zadanie.css b/1zadanie.css new file mode 100644 index 0000000..dd352ef --- /dev/null +++ b/1zadanie.css @@ -0,0 +1,158 @@ +body{ + padding: 0 auto; + margin: 0 auto; +} + +#layout{ + background: linear-gradient(90deg, #83EB94 0%, #47D95E 100%); + padding-bottom: 10px; + width: 100%; + padding-top: 40px; + align-items: center; +} + +#coming_soon{ + position: absolute; + right: 0%; + top:0%; + +} + +#guy{ + width: 70%; + position: relative; + left: 15vw; + filter: brightness(70%); + padding: 5px; +} + +#code{ + font-family: 'Lato'; + font-style: normal; + font-weight: 300; + font-size: 60px; + text-align: center; + letter-spacing: 15px; + color: black; + width: 100%; + +} + +h3{ + text-align: center; + color: #FFFFFF; + font-family: 'Lato'; + font-style: normal; + font-weight: 200; + position: relative; + top:5px; + font-size: 24px; + width: 100%; +} + +#get_mail{ + display: flex; + flex-wrap: wrap; + width: 100%; + height: 80px; + margin-bottom: 200px; + text-align: center; + align-items: center; + justify-content: center; + +} + +#email_field{ + + border-radius: 9px; + border-style: none; + box-shadow:inset 0 0 10px #000000; + font-family: 'Lato'; + font-size: 16px; + text-indent: 10px; + font-style: normal; + font-weight: 300; + color: #A0A0A0; + font-weight: 300; + line-height: normal; + width: 250px; + height: 48px; + + +} + +#button{ + + background:#0297EC; + border-radius: 9px; + padding: 13px; + color:#FFFFFF; + border-style: none; + padding-left: 30px; + padding-right: 30px; + font-size: 16px; + text-align: center; + font-family: 'Lato'; + width: 250px; + height: 48px; + margin: 0; + position: relative; + bottom: 10px; + + + + +} + +#foot{ + + font-family: 'Lato'; + font-style: normal; + font-weight: 300; + text-align:center; + color: #FFFFFF; + width: 100%; + font-size: 24px; + line-height: 28px; +} +.sexiflexi{ + + margin-top: 10px; + margin-right: 14px; + margin-left: 14px; +} +#button:hover{ + box-shadow:2px 2px 10px #000000; + +} +#email_field:focus{ + border-style: solid; + border-color: black; + border-width: thin; + + + +} + + +.form-control-placeholder { + position: relative; + top:-35px; + right: 90px; + transition: all 200ms; + opacity: 0.5; + display: block; + margin: 0; + padding: 0; +} + +.form-control:focus + .form-control-placeholder, +.form-control:valid + .form-control-placeholder { + font-size: 100%; + transform: translate3d(0, -200%, 0); + font-family: 'Lato'; + color: white; + font-weight: 300; + opacity: 1; +} + diff --git a/1zadanie.html b/1zadanie.html new file mode 100644 index 0000000..193a9d8 --- /dev/null +++ b/1zadanie.html @@ -0,0 +1,32 @@ + + + + + + + + + + +
+ + +
CODE ACADEMY
+

Leave your email

+
+
+
+ +
+
+
+
+ + + +
+ + \ No newline at end of file diff --git a/README.md b/README.md index fd32fb1..92ac9d3 100644 --- a/README.md +++ b/README.md @@ -1,28 +1,28 @@ -# Academy +# Academy Projekty wykonywane przez społeczność discorda [helloroman](https://discordapp.com/invite/VTyJc9N) -Projekt jest we wczesnej fazie i obecne challenge sa testowe. Wszelkie sugestie propozycje pomocy mile widziane. +Projekt jest we wczesnej fazie i obecne challenge są testowe. Wszelkie sugestie, propozycje pomocy mile widziane. ## Challenge #1 - Landing Page -Celem wyzwania jest wykonanie warstwy frontendowej Landing Page, zbierającego adressy e-mail osób zainteresowanych udziałem w akademii. -Stack Technologiczny do wykonania zadania to html/css/js bez zadnych frameworkow, preprocesorow. +Celem wyzwania jest wykonanie warstwy frontendowej Landing Page, zbierającego adresy mail osób zainteresowanych udziałem w akademii. +Stack Technologiczny do wykonania zadania to html/css/js bez żadnych frameworkow, preprocesorow. Rozwiązanie powinno dzialać na: * Chrome 58+ * Edge 16+ * Safari 10.1+ * Firefox 54+ -Przycisk do wysyania formularza powinien mieć ID: LandingEmail -Wykonane zadanie należy przesylac jako pull request na branch develop. -Zwrocie uwagę na sematyke html i accessibility. +Przycisk do wysłania formularza powinien mieć ID: LandingEmail +Wykonane zadanie należy przesyłac jako pull request na branch develop. +Zwrocie uwagę na semantykę html i accessibility. ### Grafiki -[Project.pdf](/assets/Layout.pdf.pdf}) +[Project.pdf](/assets/Layout.pdf) [Figma](https://www.figma.com/file/gCTf2Ux96ETR0DMxr6T2m039/LandingPage?node-id=1%3A13) [Zeppelin](https://zpl.io/boKzeQv) - Marginesy mogą się trochę nie zgadzać dopiero się uczę figmy + Marginesy mogą się trochę nie zgadzać, dopiero się uczę figmy #### Bonus challenge * Wykonaj zadanie bez użycia javascriptu -* Stwórz warstwe backendowa(dowolny język) lub podepnij się do firebase +* Stwórz warstwę backendową(dowolny język) lub podepnij się do firebase ### Termin Wstępny czas na wykonanie challenga 21.01.2019