diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 00000000..83dffe16 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,5 @@ +{ + "cSpell.words": [ + "Wireframe" + ] +} \ No newline at end of file diff --git a/Wireframe/css/style.css b/Wireframe/css/style.css index e69de29b..00a9c932 100644 --- a/Wireframe/css/style.css +++ b/Wireframe/css/style.css @@ -0,0 +1,171 @@ + +/* Body */ + +body{ +background-color:rgb(63, 54, 65); +} + + + +/* Header */ + + +.page_title{ +font-size: 40px; +margin-bottom: 10px; +position: relative; +left: 750px; +color: aliceblue; +} + + +.title_description{ +font-family: Georgia, 'Times New Roman', Times, serif; +font-size: large; +font-style: italic; +margin-top:0px; +margin-bottom: 80px; +position: relative; +left: 600px; +color: aliceblue; +} + + +/* Article Title */ + + +article { +position: relative; +left: 170px; +} + + + +h4{ +font-size: 18px; +color: aliceblue; +} + + +/* Article 1 */ + +.div_article1:first-child{ +border: 0.5px solid rgb(245, 234, 217); +width: 1000px; +position: relative; +left:300px ;; +} + +.div_article1 img{ + width: 1000px; +height: 500px; +} + +.subdivided_div_article1{ +text-align: left; +padding: 15px; +font-family:Georgia, 'Times New Roman', Times, serif; +color: aliceblue; +} + + + + +/* Article 2 */ + +.div_article2{ +border:0.5px solid rgb(245, 234, 217); +width: 500px; +height: 420px; +position: relative; +left: 300px; +top:53px; +overflow: hidden; +padding-bottom:15px; +} + +.div_article2 img{ +width:500px; +} + +.subdivided_div_article2{ +margin: 10px; +font-family:Georgia, 'Times New Roman', Times, serif; +color: aliceblue; +} + + + + + +/* Article 3 */ + + + +.div_article3{ +border:0.5px solid rgb(245, 234, 217); +width: 455px; +height:420px; +position:relative; +left: 848px; +bottom:385px; +overflow: hidden; +padding-bottom:15px; +} + +.div_article3 img{ +width:455px; +height: 250px; +} + +.subdivided_div_article3{ +margin: 10px; +font-family:Georgia, 'Times New Roman', Times, serif; +color: aliceblue; +} + + + +/* Buttons */ + +.subdivided_div_article1 button { +color:black; +border-radius: 7px; +border:0.5px solid grey; +background-color: rgb(181, 207, 183); +height:30px; +width: 100px; +} + +.subdivided_div_article2 button { +color:black; +border-radius: 7px; +border:0.5px solid grey; +background-color: rgb(181, 207, 183); +height:30px; +width: 100px; +} + +.subdivided_div_article3 button { +color:black; +border-radius: 7px; +border:0.5px solid grey; +background-color: rgb(181, 207, 183); +height:30px; +width: 100px; +} + + +/* Footer */ + +footer{ +color: rgb(218, 240, 231); +background-color: rgb(71, 63, 80); +text-align: center; +font-size: larger; +padding:30px; +position: fixed; +bottom: 0; +width: 100%; +box-shadow: 0 -2px 5px rgb(126, 126, 126); +} \ No newline at end of file diff --git a/Wireframe/index.html b/Wireframe/index.html index 67544158..1f10beeb 100644 --- a/Wireframe/index.html +++ b/Wireframe/index.html @@ -1,13 +1,118 @@ + Wireframe - + + + + +
+ +

Git: A Developer's Best Friend

+

Explore the world of Git branching and discover how this powerful feature can enhance your development workflow.

+ +
+ + + + + +
+
+ + + +
+ + An image with the inscription Git + +
+ +

What Is Git?

+ +

Git is a powerful version control system that enables developers to efficiently manage their code, collaborative development, tracking changes, and undoing mistakes.

+ + + + + +
+ + +
+ + + +
+ + An image with question why Git? + + + +
+

Importance Of Git

+ +

Git is a revolutionized way developers work. It provides a robust framework for tracking changes to code, collaborating with team members, and managing project history.

+ + + + +
+ + + +
+ + + +
+ + This is an image of a source control icon + + +
+

What is a Git Branch?

+ +

Git Branches are like parallel paths within a project's history. They allow developers to work on different features, bug fixes, or experimental changes without affecting the main codebase.

+ + + + + + +
+ + +
+ +
+
+ + + + + + + + + + +