code-squad · crongro · Feb 13, 2020 · Feb 10, 2020 · Feb 11, 2020 · Feb 12, 2020
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,216 @@
+
+# Created by https://www.gitignore.io/api/osx,node,sublimetext,visualstudiocode
+# Edit at https://www.gitignore.io/?templates=osx,node,sublimetext,visualstudiocode
+
+### Node ###
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# rollup.js default build output
+dist/
+
+# Uncomment the public line if your project uses Gatsby
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# https://create-react-app.dev/docs/using-the-public-folder/#docsNav
+# public
+
+# Storybook build outputs
+.out
+.storybook-out
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# Temporary folders
+tmp/
+temp/
+
+### OSX ###
+# General
+.DS_Store
+.AppleDouble
+.LSOverride
+
+# Icon must end with two \r
+Icon
+
+# Thumbnails
+._*
+
+# Files that might appear in the root of a volume
+.DocumentRevisions-V100
+.fseventsd
+.Spotlight-V100
+.TemporaryItems
+.Trashes
+.VolumeIcon.icns
+.com.apple.timemachine.donotpresent
+
+# Directories potentially created on remote AFP share
+.AppleDB
+.AppleDesktop
+Network Trash Folder
+Temporary Items
+.apdisk
+
+### SublimeText ###
+# Cache files for Sublime Text
+*.tmlanguage.cache
+*.tmPreferences.cache
+*.stTheme.cache
+
+# Workspace files are user-specific
+*.sublime-workspace
+
+# Project files should be checked into the repository, unless a significant
+# proportion of contributors will probably not be using Sublime Text
+# *.sublime-project
+
+# SFTP configuration file
+sftp-config.json
+
+# Package control specific files
+Package Control.last-run
+Package Control.ca-list
+Package Control.ca-bundle
+Package Control.system-ca-bundle
+Package Control.cache/
+Package Control.ca-certs/
+Package Control.merged-ca-bundle
+Package Control.user-ca-bundle
+oscrypto-ca-bundle.crt
+bh_unicode_properties.cache
+
+# Sublime-github package stores a github token in this file
+# https://packagecontrol.io/packages/sublime-github
+GitHub.sublime-settings
+
+### VisualStudioCode ###
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+
+### VisualStudioCode Patch ###
+# Ignore all local history of files
+.history
+
+# End of https://www.gitignore.io/api/osx,node,sublimetext,visualstudiocode
+
+#---------------------------------------#
+# Project Ignores                       #
+#---------------------------------------#
+
+# output
+/.temp
+/.tmp
+/build
+/dist
+
+# dependencies
+/node_modules
+.package.swp
+
+# linters
+.eslintcache/
+.eslintrc
+.eslintrc.yaml
+.eslintrc.json
+.eslintrc.js
+.stylelintcache/
+.stylelintrc
+.stylelintrc.yaml
+.stylelintrc.json
+.stylelintrc.js
+
+# misc
+/connect.lock
+/coverage/*
+/report_*
+/reports/
+.sass-cache/
+*.log
diff --git a/README.md b/README.md
@@ -1,2 +1,3 @@
 # javascript-amazon
 레벨3
+[데모 페이지](https://sally4405.github.io/demoPage/amazon/amazon.html)
diff --git a/amazon.css b/amazon.css
@@ -0,0 +1,132 @@
+* {
+ box-sizing: content-box;
+}
+
+ul {
+    padding: 0;
+    margin: 0;
+}
+
+.card-container {
+    display: flex;
+    flex-direction: column;
+    padding: 30px 50px;
+    position: relative;
+}
+
+.menu-list {
+    display: flex;
+}
+
+.menu-list>li {
+    display: flex;
+    width: 200px;
+    height: 30px;
+    padding: 20px;
+    margin: 40px 5px;
+    text-align: center;
+    align-items: center;
+    justify-content: center;
+}
+
+.menu-list>li>p {
+    color: white;
+    font-size: 20px;
+    font-weight: bold;
+}
+
+.menu-list>li:nth-child(1) {
+    background-color: #DE9A24;
+}
+
+.menu-list>li:nth-child(2) {
+    background-color: #FEC7C7;
+}
+
+.menu-list>li:nth-child(3) {
+    background-color: #7694B5;
+}
+
+.menu-list>li:nth-child(4) {
+    background-color: #614C15;
+}
+
+.content {
+    display: flex;
+    vertical-align: middle;
+    width: 929px;
+}
+
+button {
+    line-height: 30px;
+    width: 30px;
+    height: 30px;
+    margin: 0 10px;
+    font-size: 20px;
+    border: none;
+    border-radius: 50%;
+    background-color: #A9B7B8;
+    color: white;
+    position: absolute;
+    top: 100%;
+}
+
+#left-button {
+    left: 5%;
+}
+
+#right-button {
+    right: 5%;
+}
+
+
+.content-container-parent {
+    position: absolute;
+    left: 8%;
+    display: flex;
+    width: 841px;
+    height: 250px;
+    overflow: hidden;
+}
+
+.content-container-childs{
+    width: 3364px;
+}
+
+.content-container-child{
+    display: flex;
+    width: 841px;
+    justify-content: space-around;
+}
+
+.content-container-child__img {
+    width: 250px;
+    height: 250px;
+}
+
+.content-container-child__text {
+    width: 500px;
+    height: 250px;
+}
+
+.content-container-child__text-title {
+    font-size: 30px;
+    font-weight: bold;
+}
+
+.content-container-child__text-description {
+    font-size: 15px;
+    margin-top: 5px;
+    margin-bottom: 15px;
+    font-weight: bold;
+}
+
+.content-container-child__text-list {
+    font-size: 13px;
+}
+
+.content-container-child__text > ul > li {
+    list-style: none;
+    color: #949494;
+    line-height: 20px;
+}