From a8657f0a03e88beefed2f4772abffc2783c72b8b Mon Sep 17 00:00:00 2001 From: LatysawanePhommachack Date: Wed, 20 May 2020 22:22:40 -0500 Subject: [PATCH 1/3] added into two files --- index.html | 54 ++++++++++++++++++++++--- less/index.less | 102 +++++++++++++++++++++++++++--------------------- 2 files changed, 106 insertions(+), 50 deletions(-) diff --git a/index.html b/index.html index a7f9e3ad1..9b7afc88c 100644 --- a/index.html +++ b/index.html @@ -1,19 +1,61 @@ - +
- My Resume - - + Latysawane Phommachack Resume + +
+ picture of son +
+

Latysawane Phommachack

+ - +
-

My Resume

+
+
+

- ABOUT -

+ Currently still learning web development skills at Lambda School.
+ Age: 21
+ +
+
+

- SKILLS -

+ Web Development
+ 4 Years of Customer Service
+ 4 years of Salesfloor Stocker
+ 2 years of Cashier
+
+
+

- WORK HISTORY -

+ WalMart

+ October 2016-February 2020

+ 5511 Murfreesboro Rd, La Vergne, TN 37086
+ (615) 984-0066 +
+
+
+ \ No newline at end of file diff --git a/less/index.less b/less/index.less index 191ce142e..fc8276fd8 100644 --- a/less/index.less +++ b/less/index.less @@ -3,57 +3,71 @@ v2.0 | 20110126 License: none (public domain) */ +@dark: black; -html, body, div, span, applet, object, iframe, -h1, h2, h3, h4, h5, h6, p, blockquote, pre, -a, abbr, acronym, address, big, cite, code, -del, dfn, em, img, ins, kbd, q, s, samp, -small, strike, strong, sub, sup, tt, var, -b, u, i, center, -dl, dt, dd, ol, ul, li, -fieldset, form, label, legend, -table, caption, tbody, tfoot, thead, tr, th, td, -article, aside, canvas, details, embed, -figure, figcaption, footer, header, hgroup, -menu, nav, output, ruby, section, summary, -time, mark, audio, video { - margin: 0; - padding: 0; - border: 0; - font-size: 100%; - font: inherit; - vertical-align: baseline; -} -/* HTML5 display-role reset for older browsers */ -article, aside, details, figcaption, figure, -footer, header, hgroup, menu, nav, section { - display: block; +header { + display: block; + margin-left: auto; + margin-right: auto; + background: @dark; +} +.pic { + text-align: center; +} +h1 { + background: lightblue; + color: blue; + text-align: center; +} +header nav { + text-align: center; + margin-bottom: 25px; +} +button { + color: white; + background-color: blue; + border-color: black; } body { - line-height: 1; + background: black; } -ol, ul { - list-style: none; +.top-body { + display: column; + justify-content: space-between; } -blockquote, q { - quotes: none; +.about-section { + border: 1px solid lightblue; + text-align: center; } -blockquote:before, blockquote:after, -q:before, q:after { - content: ''; - content: none; +.skills-list { + border: 1px solid lightblue; + text-align: center; } -table { - border-collapse: collapse; - border-spacing: 0; +.work-history { + border: 1px solid lightblue; + text-align: center; } - -/* Set every element's box-sizing to border-box */ -* { - box-sizing: border-box; +.walmart { + text-decoration: none; } - -html, body { - height: 100%; +h2 { + color: lightblue; + text-align: center; } - +p1 { + color: blue; +} +footer { + text-align: center; +} +footer p1 { + color: white +} +footer nav { + text-align: center; + word-spacing: 15px; + margin-top: 25px; +} +footer nav a { + color: blue; +} \ No newline at end of file From 7ae5faa866e6cbca3d8c674b2e13bb87bf25d2d3 Mon Sep 17 00:00:00 2001 From: LatysawanePhommachack Date: Wed, 20 May 2020 23:18:32 -0500 Subject: [PATCH 2/3] changes to three files --- css/index.css | 71 ++++++++++++++++++++++++++++++++++++++++++++++++- index.html | 7 ++--- less/index.less | 11 ++++---- 3 files changed, 80 insertions(+), 9 deletions(-) diff --git a/css/index.css b/css/index.css index 7dd97920d..1c12f8d60 100644 --- a/css/index.css +++ b/css/index.css @@ -1 +1,70 @@ -/* Compile your LESS file! */ \ No newline at end of file +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ +head { + display: block; + margin-left: auto; + margin-right: auto; + background: black; +} +.pic { + text-align: center; +} +h1 { + background: lightblue; + color: blue; + text-align: center; +} +header nav { + text-align: center; + margin-bottom: 25px; +} +button { + color: white; + background-color: blue; + border-color: black; +} +body { + background: black; +} +.top-body { + display: column; + justify-content: space-between; +} +.about-section { + border: 1px solid lightblue; + text-align: center; +} +.skills-list { + border: 1px solid lightblue; + text-align: center; +} +.work-history { + border: 1px solid lightblue; + text-align: center; +} +.walmart { + text-decoration: none; +} +h2 { + color: lightblue; + text-align: center; +} +p1 { + color: blue; +} +footer { + text-align: center; +} +footer p1 { + color: white; +} +footer nav { + text-align: center; + word-spacing: 15px; + margin-top: 25px; +} +footer nav a { + color: blue; +} diff --git a/index.html b/index.html index 9b7afc88c..69ed17893 100644 --- a/index.html +++ b/index.html @@ -1,8 +1,11 @@ + + + +
- Latysawane Phommachack Resume
-
diff --git a/less/index.less b/less/index.less index fc8276fd8..f1dd68d0b 100644 --- a/less/index.less +++ b/less/index.less @@ -4,8 +4,9 @@ License: none (public domain) */ @dark: black; +@bottomw: 25px; -header { +head { display: block; margin-left: auto; margin-right: auto; @@ -21,15 +22,15 @@ h1 { } header nav { text-align: center; - margin-bottom: 25px; + margin-bottom: @bottomw; } button { color: white; background-color: blue; - border-color: black; + border-color: @dark; } body { - background: black; + background: @dark; } .top-body { display: column; @@ -66,7 +67,7 @@ footer p1 { footer nav { text-align: center; word-spacing: 15px; - margin-top: 25px; + margin-top: @bottomw; } footer nav a { color: blue; From fc93688543b885f74433fde402986c4abeb93581 Mon Sep 17 00:00:00 2001 From: LatysawanePhommachack Date: Thu, 21 May 2020 00:17:25 -0500 Subject: [PATCH 3/3] modified two files --- css/index.css | 84 +++++++++++++++++- less/index.less | 221 +++++++++++++++++++++++++++++++++--------------- 2 files changed, 236 insertions(+), 69 deletions(-) diff --git a/css/index.css b/css/index.css index 1c12f8d60..0ba5bf062 100644 --- a/css/index.css +++ b/css/index.css @@ -2,7 +2,8 @@ v2.0 | 20110126 License: none (public domain) */ -head { +@media(max-width: 1920px) { + head { display: block; margin-left: auto; margin-right: auto; @@ -24,6 +25,7 @@ button { color: white; background-color: blue; border-color: black; + font-weight: bold; } body { background: black; @@ -35,14 +37,17 @@ body { .about-section { border: 1px solid lightblue; text-align: center; + margin-bottom: 20px; } .skills-list { border: 1px solid lightblue; text-align: center; + margin-bottom: 20px; } .work-history { border: 1px solid lightblue; text-align: center; + margin-bottom: 20px; } .walmart { text-decoration: none; @@ -64,7 +69,84 @@ footer nav { text-align: center; word-spacing: 15px; margin-top: 25px; + background: lightblue; + font-weight: bold; } footer nav a { color: blue; } +} +@media(max-width: 500px) { + head { + display: block; + margin-left: auto; + margin-right: auto; + background: lightblue; +} +.pic { + text-align: center; +} + h1 { + background: black; + color: blue; + text-align: center; +} + header nav { + text-align: center; + margin-bottom: 25px; +} +button { + color: white; + background-color: black; + border-color: black; + font-weight: bold; +} + body { + background: white; +} + .top-body { + display: column; + justify-content: space-between; +} +.about-section { + border: 1px solid black; + text-align: center; + margin-bottom: 20px; +} +.skills-list { + border: 1px solid black; + text-align: center; + margin-bottom: 20px; +} +.work-history { + border: 1px solid black; + text-align: center; + margin-bottom: 20px; +} +.walmart { + text-decoration: none; +} +h2 { + color: blue; + text-align: center; +} + p1 { + color: black; +} +footer { + text-align: center; +} +footer p1 { + color: black; +} +footer nav { + text-align: center; + word-spacing: 15px; + margin-top: 25px; + background: black; + font-weight: bold; +} +footer nav a { + color: white; +} +} diff --git a/less/index.less b/less/index.less index f1dd68d0b..3ac84d5c4 100644 --- a/less/index.less +++ b/less/index.less @@ -4,71 +4,156 @@ License: none (public domain) */ @dark: black; -@bottomw: 25px; - -head { - display: block; - margin-left: auto; - margin-right: auto; - background: @dark; -} -.pic { - text-align: center; -} -h1 { - background: lightblue; - color: blue; - text-align: center; -} -header nav { - text-align: center; - margin-bottom: @bottomw; -} -button { - color: white; - background-color: blue; - border-color: @dark; -} -body { - background: @dark; -} -.top-body { - display: column; - justify-content: space-between; -} -.about-section { - border: 1px solid lightblue; - text-align: center; -} -.skills-list { - border: 1px solid lightblue; - text-align: center; -} -.work-history { - border: 1px solid lightblue; - text-align: center; -} -.walmart { - text-decoration: none; -} -h2 { - color: lightblue; - text-align: center; -} -p1 { - color: blue; -} -footer { - text-align: center; -} -footer p1 { - color: white -} -footer nav { - text-align: center; - word-spacing: 15px; - margin-top: @bottomw; -} -footer nav a { - color: blue; -} \ No newline at end of file +@bl: blue; +@size: 25px; +@20: 20px +@blank: white; +@lb: lightblue; +@media(max-width: 1920px) { + head { + display: block; + margin-left: auto; + margin-right: auto; + background: @dark; + } + .pic { + text-align: center; + } + h1 { + background: @lb; + color: @bl; + text-align: center; + } + header nav { + text-align: center; + margin-bottom: @size; + } + button { + color: @blank; + background-color: @bl; + border-color: @dark; + font-weight: bold; + } + body { + background: @dark; + } + .top-body { + display: column; + justify-content: space-between; + } + .about-section { + border: 1px solid @lb; + text-align: center; + margin-bottom: @20; + } + .skills-list { + border: 1px solid @lb; + text-align: center; + margin-bottom: @20; + } + .work-history { + border: 1px solid @lb; + text-align: center; + margin-bottom: @20; + } + .walmart { + text-decoration: none; + } + h2 { + color: @lb; + text-align: center; + } + p1 { + color: @bl; + } + footer { + text-align: center; + } + footer p1 { + color: @blank; + } + footer nav { + text-align: center; + word-spacing: 15px; + margin-top: @size; + background: @lb; + font-weight: bold; + } + footer nav a { + color: @bl; + } + } + @media(max-width: 500px) { + head { + display: block; + margin-left: auto; + margin-right: auto; + background: @lb; + } + .pic { + text-align: center; + } + h1 { + background: @dark; + color: @bl; + text-align: center; + } + header nav { + text-align: center; + margin-bottom: @size; + } + button { + color: @blank; + background-color: @dark; + border-color: @dark; + font-weight: bold; + } + body { + background: @blank; + } + .top-body { + display: column; + justify-content: space-between; + } + .about-section { + border: 1px solid @dark; + text-align: center; + margin-bottom: @20; + } + .skills-list { + border: 1px solid @dark; + text-align: center; + margin-bottom: @20; + } + .work-history { + border: 1px solid @dark; + text-align: center; + margin-bottom: @20; + } + .walmart { + text-decoration: none; + } + h2 { + color: @bl; + text-align: center; + } + p1 { + color: @dark; + } + footer { + text-align: center; + } + footer p1 { + color: @dark; + } + footer nav { + text-align: center; + word-spacing: 15px; + margin-top: @size; + background: @dark; + font-weight: bold; + } + footer nav a { + color: blank; + } + } \ No newline at end of file