rwd#155
Open
Amanitus wants to merge 4 commits into
Open
Conversation
devmentor-pl
approved these changes
Oct 11, 2024
Owner
devmentor-pl
left a comment
devmentor-pl
left a comment
There was a problem hiding this comment.
Piotrze,
Nic więcej nie znalazłem ponad to co omawialiśmy na spotkaniu :)
Działaj dalej tj. teraz czekam na projekt :)
| border: 150px solid #dcdcdc; | ||
| border-right-color: transparent; | ||
| border-bottom-color: transparent; | ||
| shape-outside: polygon(0 0, 0% 100%, 100% 0%); |
| .b { | ||
| grid-column: 2; | ||
| grid-row: 2; | ||
| } |
|
|
||
| <side class="v"> | ||
| <iframe width="560" height="315" src="https://www.youtube.com/embed/9lUIkCpUwNM?si=-zv1TaQ5K4sNHY0a" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe> | ||
| </side> |
| grid-area: t; | ||
| grid-column: span 2; | ||
| max-width: 100%; | ||
| } |
| } | ||
|
|
||
|
|
||
| .menu ul { |
Owner
There was a problem hiding this comment.
Przypominam tylko, aby stylować po klasach - wtedy łatwiej jest zapanować nad całością czyli zamiast .menu ul to np. .submenu lub podobnie.
| <div></div> | ||
| </footer> | ||
| </body> | ||
| </html> No newline at end of file |
| width: 100%; | ||
| } | ||
|
|
||
| .dwie-kolumny, .trzy-kolumny { |
Owner
There was a problem hiding this comment.
Staraj się używać jedynie angielskich nazw dla klas :)
Author
|
Okay, postaram się używać języka angielskiego. Dziękuję za sprawdzenie
…On Fri, 11 Oct 2024 at 15:48, devmentor.pl ***@***.***> wrote:
***@***.**** approved this pull request.
Piotrze,
Nic więcej nie znalazłem ponad to co omawialiśmy na spotkaniu :)
Działaj dalej tj. teraz czekam na projekt :)
------------------------------
In 01/style.css
<#155 (comment)>
:
> @@ -20,4 +20,5 @@
border: 150px solid #dcdcdc;
border-right-color: transparent;
border-bottom-color: transparent;
+ shape-outside: polygon(0 0, 0% 100%, 100% 0%);
👍
------------------------------
In 02/styles/global.css
<#155 (comment)>
:
> + }
+
+ .b, .c {
+ height: 100%;
+ }
+
+
+ .c {
+ grid-column: 1;
+ grid-row: 2;
+ }
+
+ .b {
+ grid-column: 2;
+ grid-row: 2;
+ }
👍
------------------------------
In 03/index.html
<#155 (comment)>
:
>
- <main class="t">T</main>
- <header class="p">P</header>
- <side class="v">V</side>
-
+ <main class="t">
+ <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias voluptas rerum obcaecati, sed labore illum consectetur eum corrupti eius neque aut odio sunt, a ab illo molestiae asperiores sapiente harum!</p>
+ </main>
+
+ <side class="v">
+ <iframe width="560" height="315" src="https://www.youtube.com/embed/9lUIkCpUwNM?si=-zv1TaQ5K4sNHY0a" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+ </side>
👍
------------------------------
In 03/styles/global.css
<#155 (comment)>
:
> + overflow: hidden; /* Ukrywamy wszelkie nadmiarowe elementy */
+ }
+
+ .v iframe {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%; /* iframe wypełnia cały kontener i zachowuje proporcje */
+ }
+
+ .t {
+ grid-area: t;
+ grid-column: span 2;
+ max-width: 100%;
+ }
👍
------------------------------
In 04/style/style.css
<#155 (comment)>
:
> +}
+
+.hamburger::before {
+ top: 10px;
+}
+
+.hamburger::after {
+ top: 25px;
+}
+
+#toggle-menu {
+ display: none;
+}
+
+
+.menu ul {
Przypominam tylko, aby stylować po klasach - wtedy łatwiej jest zapanować
nad całością czyli zamiast .menu ul to np. .submenu lub podobnie.
------------------------------
In 05/index.html
<#155 (comment)>
:
> + <div class="kolumna"></div>
+ <div class="kolumna"></div>
+ </section>
+
+ <section class="trzy-kolumny">
+ <div class="kolumna"></div>
+ <div class="kolumna"></div>
+ <div class="kolumna"></div>
+ </section>
+</main>
+
+<footer>
+ <div></div>
+</footer>
+</body>
+</html>
👍
------------------------------
In 05/style/style.css
<#155 (comment)>
:
> +}
+
+.menu {
+ display: none;
+}
+
+.hamburger-checkbox:checked ~ .menu {
+ display: block;
+ position: absolute;
+ top: 50px;
+ right: 0;
+ background-color: #fff;
+ width: 100%;
+}
+
+.dwie-kolumny, .trzy-kolumny {
Staraj się używać jedynie angielskich nazw dla klas :)
—
Reply to this email directly, view it on GitHub
<#155 (review)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/BKNFEC4HR5V5IWFOQLPWEWTZ27JJFAVCNFSM6AAAAABPWASB6OVHI2DSMVQWIX3LMV43YUDVNRWFEZLROVSXG5CSMV3GSZLXHMZDGNRSHA2DMMBUGQ>
.
You are receiving this because you authored the thread.Message ID:
***@***.***
com>
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.