diff --git a/01/index.html b/01/index.html index 194076af..db911bed 100644 --- a/01/index.html +++ b/01/index.html @@ -1,12 +1,157 @@ + - - + + devmentor.pl - HTML & CSS BASICS - #01 + - +
+
+

logo

+ + +
+
+
+

Tytul

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Et perspiciatis + nostrum eos natus deserunt + repellat quasi libero voluptate, quidem distinctio nobis quaerat. Vitae velit nisi nostrum molestiae + deleniti veritatis provident quas corrupti, modi sint, asperiores ea, quo repellendus sed iusto + possimus exercitationem ipsa maiores? Tenetur maiores ipsam animi eius. Ex tenetur ad aliquam ut cum + illum quaerat eos, laudantium quas, tempore voluptates minima rerum ea rem? Atque fugit odio + reprehenderit, numquam adipisci ad debitis architecto in dicta qui voluptatem dolor libero + temporibus possimus eum doloribus repudiandae eius perferendis. Iste omnis facilis alias tempora, + sapiente laboriosam quo non veritatis et cumque!

+ Michal Wasiak + +
Ludzie spacerujacy po plazy na tle skal w oceanie +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
Cennik
UslugaCenaCzas realizacji
SEO300 PLN3 miesiace
Strona WWW1999 PLN2 tygodnie
Aplikacja webowa4999 PLN4 tygodnie
+
+
+
+

Dodaj komentarz

+ + + + +
+
+
+

Komentarze

+
    +
  • +

    Lorem ipsum, dolor sit amet consectetur adipisicing elit. Iste, ea?

    + John Doe + +
    • + +
  • +

    Lorem ipsum, dolor sit amet consectetur adipisicing elit. Iste, ea?

    + Jan Kowalski + +
    • +
  • +

    Lorem ipsum, dolor sit amet consectetur adipisicing elit. Iste, ea?

    + Andrzej Kwiatkowski + +
    • +
  • +

    Lorem ipsum, dolor sit amet consectetur adipisicing elit. Iste, ea?

    + Anna Mucha + +
    • +
+
+
+ +
+ \ No newline at end of file diff --git a/02/styles/index.css b/02/styles/index.css index 6f4fd057..e74977c7 100644 --- a/02/styles/index.css +++ b/02/styles/index.css @@ -7,11 +7,11 @@ Znacznik label, którego przodkiem jest klasa .ac-container (0, 1, 1) */ -?? { +.ac-container label { height: 30px !important; line-height: 21px !important; font-size: 12px !important; - font-family: 'Open Sans','Arial Narrow',Arial,sans-serif !important; + font-family: 'Open Sans', 'Arial Narrow', Arial, sans-serif !important; padding: 5px 20px; position: relative; z-index: 20; @@ -19,18 +19,18 @@ Znacznik label, którego przodkiem jest klasa .ac-container height: 30px; cursor: pointer; color: #777; - text-shadow: 1px 1px 1px rgba(255,255,255,0.8); + text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.8); line-height: 33px; font-size: 19px; background: #fff; - background: -moz-linear-gradient(top,#fff 1%,#eaeaea 100%); - background: -webkit-gradient(linear,left top,left bottom,color-stop(1%,#fff),color-stop(100%,#eaeaea)); - background: -webkit-linear-gradient(top,#fff 1%,#eaeaea 100%); - background: -o-linear-gradient(top,#fff 1%,#eaeaea 100%); - background: -ms-linear-gradient(top,#fff 1%,#eaeaea 100%); - background: linear-gradient(top,#fff 1%,#eaeaea 100%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff',endColorstr='#eaeaea',GradientType=0 ); - box-shadow: 0 0 0 1px rgba(155,155,155,0.3),1px 0 0 rgba(255,255,255,0.9) inset,0 2px 2px rgba(0,0,0,0.1); + background: -moz-linear-gradient(top, #fff 1%, #eaeaea 100%); + background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #fff), color-stop(100%, #eaeaea)); + background: -webkit-linear-gradient(top, #fff 1%, #eaeaea 100%); + background: -o-linear-gradient(top, #fff 1%, #eaeaea 100%); + background: -ms-linear-gradient(top, #fff 1%, #eaeaea 100%); + background: linear-gradient(top, #fff 1%, #eaeaea 100%); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#eaeaea', GradientType=0); + box-shadow: 0 0 0 1px rgba(155, 155, 155, 0.3), 1px 0 0 rgba(255, 255, 255, 0.9) inset, 0 2px 2px rgba(0, 0, 0, 0.1); font-size: 12px; height: 30px; line-height: 20px; @@ -47,7 +47,7 @@ Zmiana koloru tła po najechaniu przez kursor myszy na znacznik label, który znajduje się wewnątrze elementu o klasie .ac-container (0, 2, 1) */ -?? { +.ac-container label:hover { background: #fff; } @@ -61,19 +61,19 @@ i ten brat musi posiadać przodka o klasie .ac-container to samo co w 1) ale z efektem najechania kursorem na label (0, 3, 2) */ -??, -?? { +.ac-container input:checked+label, +.ac-container input:checked+label:hover { background: #f1f2f3; color: #666; - text-shadow: 0 1px 1px rgba(255,255,255,0.6); - box-shadow: 0 0 0 1px rgba(155,155,155,0.3),0 2px 2px rgba(0,0,0,0.1); + text-shadow: 0 1px 1px rgba(255, 255, 255, 0.6); + box-shadow: 0 0 0 1px rgba(155, 155, 155, 0.3), 0 2px 2px rgba(0, 0, 0, 0.1); height: 30px; line-height: 21px; font-size: 13px; } .ac-container label:hover:after, -.ac-container input:checked + label:hover:after { +.ac-container input:checked+label:hover:after { content: ''; position: absolute; width: 24px; @@ -89,7 +89,7 @@ którego poprzedni brat jest zaznaczonym inputem (użyj pseudoklasy), którego przodek to element o klasie .ac-container (0, 3, 3) */ -?? { +.ac-container input:checked+label:hover::after { background-image: url(../images/arrow_up.png); } @@ -98,17 +98,17 @@ którego przodek to element o klasie .ac-container } .ac-container article { - background: rgba(255,255,255,0.5); + background: rgba(255, 255, 255, 0.5); margin-top: -1px; overflow: hidden; height: 0; position: relative; z-index: 10; - -webkit-transition: height 0.3s ease-in-out,box-shadow 0.6s linear; - -moz-transition: height 0.3s ease-in-out,box-shadow 0.6s linear; - -o-transition: height 0.3s ease-in-out,box-shadow 0.6s linear; - -ms-transition: height 0.3s ease-in-out,box-shadow 0.6s linear; - transition: height 0.3s ease-in-out,box-shadow 0.6s linear; + -webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; + -moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; + -o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; + -ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; + transition: height 0.3s ease-in-out, box-shadow 0.6s linear; } .ac-container article p { @@ -117,7 +117,7 @@ którego przodek to element o klasie .ac-container line-height: 23px; font-size: 10px; padding: 20px; - text-shadow: 1px 1px 1px rgba(255,255,255,0.8); + text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.8); font: normal normal 12px 'Open Sans'; } @@ -126,23 +126,23 @@ Rodzeństwo o typie article, dla elementu input, który jest zaznaczony (użyj p oraz posiada przodka o klasie .ac-container (0, 2, 2) */ -?? { - -webkit-transition: height 0.5s ease-in-out,box-shadow 0.1s linear; - -moz-transition: height 0.5s ease-in-out,box-shadow 0.1s linear; - -o-transition: height 0.5s ease-in-out,box-shadow 0.1s linear; - -ms-transition: height 0.5s ease-in-out,box-shadow 0.1s linear; - transition: height 0.5s ease-in-out,box-shadow 0.1s linear; - box-shadow: 0 0 0 1px rgba(155,155,155,0.3); +.ac-container input:checked ~ article { +-webkit-transition: height 0.5s ease-in-out, box-shadow 0.1s linear; +-moz-transition: height 0.5s ease-in-out, box-shadow 0.1s linear; +-o-transition: height 0.5s ease-in-out, box-shadow 0.1s linear; +-ms-transition: height 0.5s ease-in-out, box-shadow 0.1s linear; +transition: height 0.5s ease-in-out, box-shadow 0.1s linear; +box-shadow: 0 0 0 1px rgba(155, 155, 155, 0.3); } -.ac-container input:checked ~ article.ac-small { +.ac-container input:checked~article.ac-small { height: 140px; } -.ac-container input:checked ~ article.ac-medium { +.ac-container input:checked~article.ac-medium { height: 180px; } -.ac-container input:checked ~ article.ac-large { +.ac-container input:checked~article.ac-large { height: 230px; } \ No newline at end of file diff --git a/03/fonts/SIL Open Font License.txt b/03/fonts/SIL Open Font License.txt new file mode 100644 index 00000000..295975a5 --- /dev/null +++ b/03/fonts/SIL Open Font License.txt @@ -0,0 +1,43 @@ +Copyright 2010, 2012 Adobe Systems Incorporated (http://www.adobe.com/), with Reserved Font Name 'Source'. All Rights Reserved. Source is a trademark of Adobe Systems Incorporated in the United States and/or other countries. + +This Font Software is licensed under the SIL Open Font License, Version 1.1. +This license is copied below, and is also available with a FAQ at: http://scripts.sil.org/OFL + +----------------------------------------------------------- +SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 +----------------------------------------------------------- + +PREAMBLE +The goals of the Open Font License (OFL) are to stimulate worldwide development of collaborative font projects, to support the font creation efforts of academic and linguistic communities, and to provide a free and open framework in which fonts may be shared and improved in partnership with others. + +The OFL allows the licensed fonts to be used, studied, modified and redistributed freely as long as they are not sold by themselves. The fonts, including any derivative works, can be bundled, embedded, redistributed and/or sold with any software provided that any reserved names are not used by derivative works. The fonts and derivatives, however, cannot be released under any other type of license. The requirement for fonts to remain under this license does not apply to any document created using the fonts or their derivatives. + +DEFINITIONS +"Font Software" refers to the set of files released by the Copyright Holder(s) under this license and clearly marked as such. This may include source files, build scripts and documentation. + +"Reserved Font Name" refers to any names specified as such after the copyright statement(s). + +"Original Version" refers to the collection of Font Software components as distributed by the Copyright Holder(s). + +"Modified Version" refers to any derivative made by adding to, deleting, or substituting -- in part or in whole -- any of the components of the Original Version, by changing formats or by porting the Font Software to a new environment. + +"Author" refers to any designer, engineer, programmer, technical writer or other person who contributed to the Font Software. + +PERMISSION & CONDITIONS +Permission is hereby granted, free of charge, to any person obtaining a copy of the Font Software, to use, study, copy, merge, embed, modify, redistribute, and sell modified and unmodified copies of the Font Software, subject to the following conditions: + +1) Neither the Font Software nor any of its individual components, in Original or Modified Versions, may be sold by itself. + +2) Original or Modified Versions of the Font Software may be bundled, redistributed and/or sold with any software, provided that each copy contains the above copyright notice and this license. These can be included either as stand-alone text files, human-readable headers or in the appropriate machine-readable metadata fields within text or binary files as long as those fields can be easily viewed by the user. + +3) No Modified Version of the Font Software may use the Reserved Font Name(s) unless explicit written permission is granted by the corresponding Copyright Holder. This restriction only applies to the primary font name as presented to the users. + +4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font Software shall not be used to promote, endorse or advertise any Modified Version, except to acknowledge the contribution(s) of the Copyright Holder(s) and the Author(s) or with their explicit written permission. + +5) The Font Software, modified or unmodified, in part or in whole, must be distributed entirely under this license, and must not be distributed under any other license. The requirement for fonts to remain under this license does not apply to any document created using the Font Software. + +TERMINATION +This license becomes null and void if any of the above conditions are not met. + +DISCLAIMER +THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM OTHER DEALINGS IN THE FONT SOFTWARE. \ No newline at end of file diff --git a/03/fonts/SourceSansPro-Black.otf b/03/fonts/SourceSansPro-Black.otf new file mode 100644 index 00000000..0c25f3d9 Binary files /dev/null and b/03/fonts/SourceSansPro-Black.otf differ diff --git a/03/fonts/SourceSansPro-BlackIt.otf b/03/fonts/SourceSansPro-BlackIt.otf new file mode 100644 index 00000000..da3504c6 Binary files /dev/null and b/03/fonts/SourceSansPro-BlackIt.otf differ diff --git a/03/fonts/SourceSansPro-Bold.otf b/03/fonts/SourceSansPro-Bold.otf new file mode 100644 index 00000000..98dbee74 Binary files /dev/null and b/03/fonts/SourceSansPro-Bold.otf differ diff --git a/03/fonts/SourceSansPro-BoldIt.otf b/03/fonts/SourceSansPro-BoldIt.otf new file mode 100644 index 00000000..6600c863 Binary files /dev/null and b/03/fonts/SourceSansPro-BoldIt.otf differ diff --git a/03/fonts/SourceSansPro-ExtraLight.otf b/03/fonts/SourceSansPro-ExtraLight.otf new file mode 100644 index 00000000..f885ce7f Binary files /dev/null and b/03/fonts/SourceSansPro-ExtraLight.otf differ diff --git a/03/fonts/SourceSansPro-ExtraLightIt.otf b/03/fonts/SourceSansPro-ExtraLightIt.otf new file mode 100644 index 00000000..f9320242 Binary files /dev/null and b/03/fonts/SourceSansPro-ExtraLightIt.otf differ diff --git a/03/fonts/SourceSansPro-It.otf b/03/fonts/SourceSansPro-It.otf new file mode 100644 index 00000000..2d627d9c Binary files /dev/null and b/03/fonts/SourceSansPro-It.otf differ diff --git a/03/fonts/SourceSansPro-Light.otf b/03/fonts/SourceSansPro-Light.otf new file mode 100644 index 00000000..159979f6 Binary files /dev/null and b/03/fonts/SourceSansPro-Light.otf differ diff --git a/03/fonts/SourceSansPro-LightIt.otf b/03/fonts/SourceSansPro-LightIt.otf new file mode 100644 index 00000000..e3d49b5f Binary files /dev/null and b/03/fonts/SourceSansPro-LightIt.otf differ diff --git a/03/fonts/SourceSansPro-Regular.otf b/03/fonts/SourceSansPro-Regular.otf new file mode 100644 index 00000000..bdcfb27a Binary files /dev/null and b/03/fonts/SourceSansPro-Regular.otf differ diff --git a/03/fonts/SourceSansPro-Semibold.otf b/03/fonts/SourceSansPro-Semibold.otf new file mode 100644 index 00000000..fffdbafe Binary files /dev/null and b/03/fonts/SourceSansPro-Semibold.otf differ diff --git a/03/fonts/SourceSansPro-SemiboldIt.otf b/03/fonts/SourceSansPro-SemiboldIt.otf new file mode 100644 index 00000000..e90515b3 Binary files /dev/null and b/03/fonts/SourceSansPro-SemiboldIt.otf differ diff --git a/03/index.html b/03/index.html index 0c018343..760140a4 100644 --- a/03/index.html +++ b/03/index.html @@ -1,20 +1,28 @@ + - - + + + devmentor.pl - HTML & CSS BASICS - #03 + - +
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo, asperiores.
-
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis praesentium in possimus!
-
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Delectus, iure?
+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo, asperiores.
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis praesentium in possimus!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Delectus, iure?
@@ -22,7 +30,7 @@ Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo, asperiores.
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis praesentium in possimus!
-
+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Delectus, iure?
@@ -35,4 +43,5 @@ Lorem ipsum dolor sit amet consectetur adipisicing elit. Delectus, iure? + \ No newline at end of file diff --git a/03/styles/style.css b/03/styles/style.css new file mode 100644 index 00000000..375f6cb0 --- /dev/null +++ b/03/styles/style.css @@ -0,0 +1,82 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + + +@font-face { + font-family: 'Source Sans PRO'; + src: url(../fonts/SourceSansPro-Regular.otf) format(opentype); + font-style: normal; + font-weight: normal; +} + +@font-face { + font-family: 'Source Sans PRO'; + src: url(../fonts/SourceSansPro-Bold.otf) format(opentype); + font-style: normal; + font-weight: bold; +} + +@font-face { + font-family: 'Source Sans PRO'; + src: url(../fonts/SourceSansPro-It.otf) format(opentype); + font-style: italic; + font-weight: normal; +} + +.parent { + width: 600px; + padding: 20px; + font-family: "Source Sans PRO"; + +} + + +.parent--inline-block .child { + display: inline-block; + vertical-align: top; + font-size: 0; +} + +.parent--inline-block .child { + font-size: 16px; +} + + +.parent--float { + background-color: red; +} + +.parent--float .child { + float: left; + +} + +.parent--float::after { + content: " "; + display: block; + clear: both; +} + +.parent--flexbox { + display: flex; +} + + +.child--first, .child--middle { + margin-right: 10px; + width: calc(30% - 10px); +} + +.child--middle { + font-weight: bold; + +} + +.child--last { + width: 40%; + margin-right: 0; + font-style: italic; +} \ No newline at end of file diff --git a/04/images/arrow-up-solid.svg b/04/images/arrow-up-solid.svg new file mode 100644 index 00000000..cc1b607f --- /dev/null +++ b/04/images/arrow-up-solid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/04/index.html b/04/index.html new file mode 100644 index 00000000..78616a3a --- /dev/null +++ b/04/index.html @@ -0,0 +1,66 @@ + + + + + + + + + + + Document + + + + + + + + \ No newline at end of file diff --git a/04/styles/index.css b/04/styles/index.css new file mode 100644 index 00000000..0dbec56d --- /dev/null +++ b/04/styles/index.css @@ -0,0 +1,104 @@ +:root { + --color-alfa: #F5F5F5; + --color-beta: #FFFFFF; + --dropdown-background: #333333; + --dropdown-color: white; + --hover-font-border: #009AE6; +} + +* { + padding: 0; + margin: 0; +} + +body { + background-color: var(--color-alfa); + font-family: "Roboto", sans-serif; + +} + +.nav__container { + margin-left: 10px; + margin-top: 40px; + +} + +.nav { + background-color: var(--color-beta); + /* padding: 20px; */ + display: flex; + +} + +.nav__item { + /* position: relative; */ + padding: 20px 30px; + background-color: var(--color-beta); + text-transform: uppercase; + cursor: pointer; + +} + +.nav__link { + /* display: inline-block; */ + /* height: 100%; + width: 100%; */ + color: var(--main-font); + text-decoration: none; +} + +.nav__item:hover { + border-top: 2px solid var(--hover-font-border); + color: var(--hover-font-border); +} + +.arrow__down { + position: relative; + left: 40px; + transform: rotate(90deg); +} + +.nav__item:hover>.nav__dropdown { + display: block; +} + +.nav__dropdown { + display: none; + padding-top: 20px; + position: absolute; + left: 100px; +} + +.dropdown__item { + position: relative; + background-color: var(--dropdown-background); + padding: 15px 20px; + width: 240px; + color: var(--dropdown-color); +} + +.arrow__right { + display: inline-block; + position: relative; + left: 135px; +} + +.dropdown__item:hover>.dropdown--right { + display: block; +} + +.dropdown--right { + display: none; + position: absolute; + left: 240px; + top: 0; + + +} + +.dropdown__item-sub { + background-color: var(--dropdown-background); + padding: 15px 20px; + width: 240px; + color: var(--dropdown-color); +} \ No newline at end of file diff --git a/04/styles/reset.css b/04/styles/reset.css new file mode 100644 index 00000000..3b7e936f --- /dev/null +++ b/04/styles/reset.css @@ -0,0 +1,141 @@ +/* + HTML5 Reset :: style.css + ---------------------------------------------------------- + We have learned much from/been inspired by/taken code where offered from: + + Eric Meyer :: http://meyerweb.com + HTML5 Doctor :: http://html5doctor.com + and the HTML5 Boilerplate :: http://html5boilerplate.com + +-------------------------------------------------------------------------------*/ + +/* Let's default this puppy out +-------------------------------------------------------------------------------*/ + +html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font-weight: normal; + vertical-align: baseline; + background: transparent; +} + +main, article, aside, figure, footer, header, nav, section, details, summary {display: block;} + +/* Handle box-sizing while better addressing child elements: + http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ +html { + box-sizing: border-box; +} + +*, +*:before, +*:after { + box-sizing: inherit; +} + +/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */ + +/* Responsive images and other embedded objects */ +/* if you don't have full control over `img` tags (if you have to overcome attributes), consider adding height: auto */ +img, +object, +embed {max-width: 100%;} + +/* + Note: keeping IMG here will cause problems if you're using foreground images as sprites. + In fact, it *will* cause problems with Google Maps' controls at small size. + If this is the case for you, try uncommenting the following: + +#map img { + max-width: none; +} +*/ + +/* force a vertical scrollbar to prevent a jumpy page */ +html {overflow-y: scroll;} + +/* we use a lot of ULs that aren't bulleted. + you'll have to restore the bullets within content, + which is fine because they're probably customized anyway */ +ul {list-style: none;} + +blockquote, q {quotes: none;} + +blockquote:before, +blockquote:after, +q:before, +q:after {content: ''; content: none;} + +a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;} + +del {text-decoration: line-through;} + +abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;} + +/* tables still need cellspacing="0" in the markup */ +table {border-collapse: separate; border-spacing: 0;} +th {font-weight: bold; vertical-align: bottom;} +td {font-weight: normal; vertical-align: top;} + +hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;} + +input, select {vertical-align: middle;} + +pre { + white-space: pre; /* CSS2 */ + white-space: pre-wrap; /* CSS 2.1 */ + white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */ + word-wrap: break-word; /* IE */ +} + +input[type="radio"] {vertical-align: text-bottom;} +input[type="checkbox"] {vertical-align: bottom;} +.ie7 input[type="checkbox"] {vertical-align: baseline;} +.ie6 input {vertical-align: text-bottom;} + +select, input, textarea {font: 99% sans-serif;} + +table {font-size: inherit; font: 100%;} + +small {font-size: 85%;} + +strong {font-weight: bold;} + +td, td img {vertical-align: top;} + +/* Make sure sup and sub don't mess with your line-heights http://gist.github.com/413930 */ +sub, sup {font-size: 75%; line-height: 0; position: relative;} +sup {top: -0.5em;} +sub {bottom: -0.25em;} + +/* standardize any monospaced elements */ +pre, code, kbd, samp {font-family: monospace, sans-serif;} + +/* hand cursor on clickable elements */ +.clickable, +label, +input[type=button], +input[type=submit], +input[type=file], +button {cursor: pointer;} + +/* Webkit browsers add a 2px margin outside the chrome of form elements */ +button, input, select, textarea {margin: 0;} + +/* make buttons play nice in IE */ +button, +input[type=button] {width: auto; overflow: visible;} + +/* scale images in IE7 more attractively */ +.ie7 img {-ms-interpolation-mode: bicubic;} + +/* prevent BG image flicker upon hover + (commented out as usage is rare, and the filter syntax messes with some pre-processors) +.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));} +*/ + +/* let's clear some floats */ +.clearfix:after { content: " "; display: block; clear: both; } \ No newline at end of file diff --git a/05/index.html b/05/index.html new file mode 100644 index 00000000..f5844ce1 --- /dev/null +++ b/05/index.html @@ -0,0 +1,66 @@ + + + + + + + + + + + + + + Uklad strony + + + +
+
+

+ +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + \ No newline at end of file diff --git a/05/styles/base.css b/05/styles/base.css new file mode 100644 index 00000000..a9883843 --- /dev/null +++ b/05/styles/base.css @@ -0,0 +1,22 @@ + .row, .cell, .container { + outline: 3px solid; + } + + .row { + padding-top: 10px; + padding-bottom: 10px; + outline-color: green; + margin: 10px; + } + + .container { + margin: 0 auto; + max-width: 1400px; + outline-color: #00A8F3; + } + + .cell { + + min-height: 50px; + outline-color: orange; + } \ No newline at end of file diff --git a/05/styles/footer.css b/05/styles/footer.css new file mode 100644 index 00000000..8f77dce2 --- /dev/null +++ b/05/styles/footer.css @@ -0,0 +1,11 @@ +.footer__container { + display: flex; + justify-content: center; + padding-top: 10px; + padding-bottom: 10px; +} + +.footer__copyrights { + width: 15%; + background-color: orange; +} \ No newline at end of file diff --git a/05/styles/header.css b/05/styles/header.css new file mode 100644 index 00000000..1749d5a7 --- /dev/null +++ b/05/styles/header.css @@ -0,0 +1,24 @@ +.header__container { + display: flex; + justify-content: space-between; + padding-top: 5px; + padding-bottom: 10px; + +} + +.header__logo { + background-color: orange; + min-width: 200px; + +} + +.header__nav { + min-width: 600px; + background-color: orange; + +} + +.row-small { + padding-top: 5px; + padding-bottom: 5px;; +} \ No newline at end of file diff --git a/05/styles/index.css b/05/styles/index.css new file mode 100644 index 00000000..e69de29b diff --git a/05/styles/main.css b/05/styles/main.css new file mode 100644 index 00000000..b701af54 --- /dev/null +++ b/05/styles/main.css @@ -0,0 +1,22 @@ +.content__container { + display: flex; + align-items: flex-start; + justify-content: space-between; + padding-top: 10px; + padding-bottom: 10px; + +} + +.content__article-left { + min-height: 400px; + width: 51%; + background-color: orange; + +} + +.content__article-right { + min-height: 400px; + width: 48%; + background-color: orange; + +} \ No newline at end of file diff --git a/05/styles/reset.css b/05/styles/reset.css new file mode 100644 index 00000000..e3a8e410 --- /dev/null +++ b/05/styles/reset.css @@ -0,0 +1,205 @@ +html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font-weight: normal; + vertical-align: baseline; + background: transparent; +} + +main, article, aside, figure, footer, header, nav, section, details, summary { + display: block; +} + +html { + box-sizing: border-box; +} + +*, *:before, *:after { + box-sizing: inherit; +} + +img { + max-width: 100%; +} + +ul { + list-style: none; +} + +/* we'll restore bullets as needed for content */ + +blockquote, q { + quotes: none; +} + +blockquote:before, blockquote:after, q:before, q:after { + content: ''; + content: none; +} + +a { + margin: 0; + padding: 0; + font-size: 100%; + vertical-align: baseline; + background: transparent; +} + +del { + text-decoration: line-through; +} + +abbr[title], dfn[title] { + border-bottom: 1px dotted #000; + cursor: help; +} + +table { + border-collapse: separate; + border-spacing: 0; + text-align: left; +} + +th { + font-weight: bold; + vertical-align: bottom; +} + +td { + font-weight: normal; + vertical-align: top; +} + +td img { + vertical-align: top; +} + +hr { + display: block; + height: 1px; + border: 0; + border-top: 1px solid #999; + margin: 1rem 0; + padding: 0; +} + +input, select { + vertical-align: middle; +} + +pre { + white-space: pre-line; +} + +input[type="radio"] { + vertical-align: text-bottom; +} + +input[type="checkbox"] { + vertical-align: bottom; +} + +small { + font-size: .8rem; +} + +strong { + font-weight: bold; +} + +sub, sup { + font-size: .8rem; + line-height: 0; + position: relative; +} + +sup { + top: -0.5rem; +} + +sub { + bottom: -0.25rem; +} + +pre, code, kbd, samp { + font-family: monospace, sans-serif; +} + +label, input[type=button], input[type=submit], input[type=file], button { + cursor: pointer; +} + +button, input, select, textarea { + margin: 0; +} + +ins { + background-color: var(--highlight-color); + color: #000; + text-decoration: none; +} + +mark { + background-color: var(--highlight-color); + color: #000; + font-style: italic; + font-weight: bold; +} + +blockquote { + padding: 2rem; + border-left: 1px solid #333; +} + +.clearfix:after { + content: ""; + display: table; + clear: both; +} + +/* https://css-tricks.com/snippets/css/clear-fix/ */ + +h1, h2, h3, h4, h5, h6 { + text-wrap: balance +} + +p { + text-wrap: pretty; +} + +@media (prefers-reduced-motion: no-preference) { + :has(:target) { + scroll-behavior: smooth; + } +} + +/* ———— END THE GENERIC RESETS ———— */ + +:root { + --font-system: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + /* https://css-tricks.com/snippets/css/system-font-stack */ + --text-color: #333; + --featured-color: #03f; + --featured-color-hover: #69f; + --highlight-color: #fcd700; +} + +body { + font-size: 16px; + font-family: var(--font-system); + color: var(--text-color); +} + +a { + color: var(--featured-color); +} + +a:hover { + color: var(--featured-color-hover); +} + +@media screen and (max-width: 480px) {} + +@media print {} \ No newline at end of file diff --git a/05/styles/section.css b/05/styles/section.css new file mode 100644 index 00000000..2edfd3db --- /dev/null +++ b/05/styles/section.css @@ -0,0 +1,21 @@ +.section__container { + display: flex; + justify-content: space-evenly; + padding-top: 10px; + padding-bottom: 10px; +} + + + +.section__item-middle { + width: 30%; + height: 400px; + background-color: orange; + +} + +.section__item-middle--right { + align-self: flex-end; + height: 380px; + +} \ No newline at end of file diff --git a/tatus b/tatus new file mode 100644 index 00000000..9ad2b45a --- /dev/null +++ b/tatus @@ -0,0 +1,258 @@ +commit 24892ebfd563720313863bff978bdc058af71271 (HEAD -> master, origin/master, origin/HEAD) +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Thu May 2 07:02:21 2024 +0200 + + Update README.md + +commit 98ea68b9b08aa02bce3f29da295cbf488fd9b328 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Thu May 2 07:01:45 2024 +0200 + + Update README.md + +commit aabd07c591c1986b3adb62b0f323b82ef64af808 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Thu May 2 07:01:15 2024 +0200 + + Update README.md + +commit 9c12bc2f84e91651e8bc28b5054fde00008678d4 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Thu May 2 07:00:23 2024 +0200 + + Update README.md + +commit 782abbc1225ee8358f213109699e6e698bfba48d +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Thu May 2 06:59:45 2024 +0200 + + Update README.md + +commit 626b547241a20408bd6cf4299ef4fa3e6fc1bb33 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Thu May 2 06:57:36 2024 +0200 + + Update README.md + +commit c38f1abe95ae402157c629359f56760bb7800766 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Dec 15 16:26:14 2023 +0100 + + Update README.md + +commit 14e617d642ceef84fd7a798b80720f9beb72f5cc +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Dec 15 16:18:33 2023 +0100 + + Update README.md + +commit 240acc461883b3f8031618a732592793d15484e0 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Nov 3 12:48:45 2023 +0100 + + Update rotate link + +commit 84d16a42937cd28260886f6b80af063b86bc8443 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Jul 21 11:04:51 2023 +0200 + + Update README.md + +commit dd7ad66e5706dfd11113c4ea7187325bcb75356d +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Thu Jul 20 16:53:13 2023 +0200 + + Update README.md + +commit 2c6549bdae91447cb268709051490962aa6876aa +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Thu Jul 20 16:52:45 2023 +0200 + + Add live share for devcontainer.json + +commit 74520ef354cddc148364e63d4dbf555a338c2ca9 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Wed Jul 19 10:14:24 2023 +0200 + + Update README.md + +commit a3f028c96f28b5c8b86d973331bf46e687347e37 +Merge: 9985055 e2e7972 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Wed Jul 19 10:13:09 2023 +0200 + + Merge pull request #153 from devmentor-pl/devmentor-pl-patch-1 + + Create README.md for .devcontainer + +commit e2e7972079dbb3b9328a5f51be5aaa377c683595 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Wed Jul 19 10:12:46 2023 +0200 + + Create README.md for .devcontainer + +commit 9985055da002ea2b9f9dfacb682f8613f1bd4e17 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Wed Jul 19 10:05:22 2023 +0200 + + Update devcontainer.json + +commit 4dc2d3eacfebf41e05080b1a7bf3c65412410afa +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Wed Jul 19 10:00:11 2023 +0200 + + Create devcontainer.json + +commit bbea66f076310087b31f2a09275d5ac433aeca69 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Mon Dec 27 18:07:00 2021 +0100 + + add font-face info + +commit bb49dceca24e5c4b57997a86d58a563c2a959b94 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Jul 30 11:38:17 2021 +0200 + + improve task text + +commit 339a7d909d4e5641cbc10fdf5b50b51e67578948 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Jul 30 11:27:42 2021 +0200 + + improve task text + +commit 2aafe7c5561073db33e7602aba655153d70e87bc +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Jul 30 11:23:26 2021 +0200 + + improve task text + +commit 7d0b199c968e27f72b154078e3633c3b49d8a589 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Jul 30 11:15:10 2021 +0200 + + improve task text + +commit acce7e85b359a0978f3c665296dc1938cf8a038d +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Jul 30 11:12:14 2021 +0200 + + improve task text + +commit 4d443b28219575a1cca8c597c55357b59d9c33f1 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Jul 30 11:09:07 2021 +0200 + + fix typo + +commit 84ed8ba901ac75678c87bc8736ab266b58c63c61 +Author: devmentor.pl <55095257+devmentor-pl@users.noreply.github.com> +Date: Fri Jul 30 11:08:16 2021 +0200 + + improve readme text + +commit 04b6780df7c4c321785a3dbd61a886631b4d0324 +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:31:57 2021 +0100 + + Remove unused files + +commit 0f1aed2d491b5105b2800c29cccbd11e3b8e1a80 +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:29:18 2021 +0100 + + Improve description for task 05 + +commit 28ef79da9b8a73ca25780588ec0165d388da9a3d +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:27:39 2021 +0100 + + Improve description for task 04 + +commit 1d29d50226ea466e9820abd32aeeba767d361679 +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:22:50 2021 +0100 + + Improve description for task 03 + +commit 8a145e6c6502817696ebee5ba9fabd00a0ae32f5 +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:22:25 2021 +0100 + + Fix link to prev test + +commit c1e2a9c9f00adcdc5dfada34de26722add4e37f7 +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:19:30 2021 +0100 + + Improve description for task 01 + +commit 8e8c6543c7520224c166d9a892a290c9c28a11b0 +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:13:33 2021 +0100 + + Fix typos in description + +commit 986362855b3b441538141d04d6bd80506d2cb089 +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:12:11 2021 +0100 + + Change content for section: How to complete tasks? + +commit 51ef480301cfb5b745ad01d2c37238f562911e9c +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:10:16 2021 +0100 + + Remove warnings + +commit 43eddc028960ef5781c136ec8a558e16a172c28f +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:09:11 2021 +0100 + + Change navigation view to tasks + +commit d7ca1abdbb72d0750d0ad1861e7ceb44abf4171a +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:08:13 2021 +0100 + + Add information about Code Review + +commit 878cea9f0fceb6b521cb995b72986202b9eb3317 +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:07:28 2021 +0100 + + Change header content + +commit 39ffc4c36a587d9c41e9604418c3482b587c4b83 +Author: Mateusz Bogolubow +Date: Tue Jan 19 10:06:30 2021 +0100 + + Add information about polling + +commit 83ea6897dfc51a2edae411ac60f380d66b60a801 +Author: Mateusz Bogolubow +Date: Fri Aug 14 12:20:49 2020 +0200 + + Fix typos in description task 04 + +commit f57691758b8138cf24bf88ce9c675ac1e5ae9463 +Author: Mateusz Bogolubow +Date: Fri Aug 14 12:08:10 2020 +0200 + + Fix descriptions in selectors + +commit fce039d8415a0a63ad7233d9051d8320675a0921 +Author: Mateusz Bogolubow +Date: Mon Aug 3 16:40:54 2020 +0200 + + Fix wrongly input type suggest + +commit 0d65357c4d754f7ea38df964c31fa198dbbf38ec +Author: Mateusz Bogolubow +Date: Mon Apr 6 06:36:22 2020 +0200 + + Add more info in readme + +commit c234547c905eaa8301496240a0a9868f25d88960 +Author: Mateusz Bogolubow +Date: Sat Mar 21 08:56:28 2020 + \ No newline at end of file