From b0ecaadbbc30c80cd8851a0e586ff2516eb10bfe Mon Sep 17 00:00:00 2001 From: mitza24 Date: Mon, 11 Dec 2017 12:06:21 +0200 Subject: [PATCH] style-CSS --- index.html | 4 +- style/normalize.css => normalize.css | 0 style.1css | 35 ++++++++ style.css | 45 +++++++++++ style2.css | 116 +++++++++++++++++++++++++++ 5 files changed, 198 insertions(+), 2 deletions(-) rename style/normalize.css => normalize.css (100%) create mode 100644 style.1css create mode 100644 style.css create mode 100644 style2.css diff --git a/index.html b/index.html index f4587c8..d946db1 100644 --- a/index.html +++ b/index.html @@ -11,11 +11,11 @@ Jad Sarout | CV - + -
+
diff --git a/style/normalize.css b/normalize.css similarity index 100% rename from style/normalize.css rename to normalize.css diff --git a/style.1css b/style.1css new file mode 100644 index 0000000..7e5a606 --- /dev/null +++ b/style.1css @@ -0,0 +1,35 @@ + + + +/* + +section { + + float: right; + margin: auto; +} +#about { + float: left; + margin: auto; + width: 20% + display: block; + overflow: hidden; +} +#experiences { + float: left; + margin: 0 1.5% +} +#hobbies { + float: left; + margin: 0 1.5%} + div { + clear: left; + } + +hgroup{ + background-color:grey; + color: red; + } + + +*/ diff --git a/style.css b/style.css new file mode 100644 index 0000000..64519d7 --- /dev/null +++ b/style.css @@ -0,0 +1,45 @@ + +.content, +header div{ + max-width:700px; + margin: 0 auto; + background: orange; +} + +section { + float: left; + margin: auto; + width: 50%; + background: green; +} + +header{ + background: grey; +} + +section p{ + padding:10px; +} + +.experience .experience-details, +.experience h4{ + margin-left:10px; +} + +#competencies{ + height:300px; /* TEMPORARY */ +} + +#hobbies { + float: left; + margin: auto; + width: 48%; + div { + clear: left; + } + +hgroup{ + background-color:grey; + color: red; + } + diff --git a/style2.css b/style2.css new file mode 100644 index 0000000..6030a75 --- /dev/null +++ b/style2.css @@ -0,0 +1,116 @@ +header{ + background: grey; + padding:5px; + } +#wrapper{ + width: 100%; +} +section{float: left; +width: 650px;} + +header div{ +max-width:100%; + margin: 0 auto; + background: grey; + padding: 5px; +} +figure { + position:absolute; + left:300px; + top:12px; +} +.skills-primary::before{ +content: "Main" +} + +[data-skill="5"] span{ + width: 50%; + height: 15px; + padding: 5px; + background-color: red; + display: block; + margin: 10px; +} +[data-skill="3"] span{ + width: 30%; + height: 15px; + padding: 5px; + background-color: red; + display: block; + margin: 10px; +} +[data-skill="1"] span{ + width: 15%; + height: 15px; + padding: 5px; + background-color: red; + display: block; + margin: 10px; +} +.skills-secondary::before{ + content: "other" + } +.skill{ + background-color: gray; + width: 500px; + height: 40px; + margin: 1px; + padding:1px; + color:white; +} +[data-skill="9"] span{ + width: 90%; + height: 15px; + padding: 5px; + background-color: red; + display: block; + margin: 10px; +} +[data-skill="7"] span{ + width: 15%; + height: 15px; + padding: 5px; + background-color: red; + display: block; + margin: 10px; +} +.contacts{ +position: absolute; +color:red; +top:35px; +right:39px; +width:500px; +} + +} +#contact h3{ + display: none; +} + +dl { + width: 116.5%; + + background: #ff0; + padding: 0; + margin: 0; + } + dt { + float: left; + width: 21%; + color: white; + background:orangered; + + } + dd { + float: left; + width: 70%; + + background:black; + padding: 0; + margin: 0; + color:orangered; + } +.contact-value { + color:black; +} +