diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..7a9dfa0 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,15 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "pwa-chrome", + "request": "launch", + "name": "Launch Chrome against localhost", + "url": "http://localhost:8080", + "webRoot": "${workspaceFolder}" + } + ] +} \ No newline at end of file diff --git a/index.html b/index.html index 4a81684..c67624c 100644 --- a/index.html +++ b/index.html @@ -5,14 +5,81 @@ Spotify Clone + + + + + + + - - Premium Discover Help Download Music for everyone. Spotify is now free on mobile, tablet and computer. Listen to the - right music, wherever you are. What’s on Spotify? Millions of Songs There are millions of songs on Spotify HD Music - Listen to music as if you were listening live Stream Everywhere Stream music on your smartphone, tablet or computer - It’s as yeezy as Kanye West. Search Know what you want to listen to? Just search and hit play. Browse Check out the - latest charts, brand new releases and great playlists for right now. Discover Enjoy new music every Monday with your - own personal playlist. Or sit back and enjoy Radio. + + +
+
+ +
+
+ +
+
+
+
+

Music for everyone.

+

Spotify is now free on mobile, tablet and computer.
Listen to the + right music, wherever you are.

+
+ +
+
+

What’s on Spotify?

+
+
+
+ +

Millions of Songs

+

There are millions of songs on Spotify

+
+
+ +

HD Music

+

Listen to music as if you were listening live

+
+
+ +

Stream Everywhere

+

Stream music on your smartphone, tablet or computer

+
+
+
+
+

It’s as yeezy as Kanye West.

+

+ Search +

+

Know what you want to listen to?
Just search and hit play.

+

+ Browse +

+

Check out the + latest charts,
brand new releases and great
playlists for right now.

+

Discover

+

Enjoy new music every Monday
with your + own personal playlist.
Or sit back and enjoy Radio.

+
+
+ Icono Spotify blanco +
+
+ Imagen de la aplicación Spotify +
+
\ No newline at end of file diff --git a/styles/style.css b/styles/style.css index 68b1e59..ca27683 100644 --- a/styles/style.css +++ b/styles/style.css @@ -3,4 +3,162 @@ Colors: Text: 1A1A1A Green: #00B172 White: #FFF -*/ \ No newline at end of file +*/ +.margen{ + margin-top: 10vh; +} +body{ + margin-bottom: 0%; +} +.barrafija{ + + width: 60vw; + height: 10vh; + background-color: white; + + order: 1; +} +.informacion{ + width: 40vw; + height: 93vh; + margin-top: 7vh; + margin-left: 5vw; + +} +#especificaciones{ + display: flex; + flex-direction: row; + + margin-left: 2.5vw; + margin-right: 2.5vw; + background-color: #00B172; + width: 95vw; + height: 100vh; +} + +#iconos{ + display: flex; + margin-top: 10vh; + flex-direction: row; + justify-content: center; +} +#aboutMe{ + display: flex; + + flex-direction: row; + justify-content: flex-start; + +} +.imagenspot{ + width: 15vw; + height: 8vh; + padding-top: 1vh; + padding-left: 15px; + +} +.horizontal{ + display: inline; + font-family: 'Encode Sans SC', sans-serif; + font-size:medium; + margin-left: 20px; + +} +.segundo{ + order: 2; + padding-left: 15vh; + + height: 10vh; + width: 40vw; + background-color:#FFF; +} +.fondoetiqueta{ + background-image: url("../images/landing.jpg"); + margin-top: 0%; + background-size:100vw 90vh; + width: 100vw; + height:90vh; +} +.texto{ + + margin-top: 0%; + padding-top: 25vh; + color: white; + font-family: 'Encode Sans SC', sans-serif; + font-family: 'Open Sans', sans-serif; + text-align: center; + font-size: 70px; +} +.textopequeno{ + + color: white; + text-align: center; + font-size: 25px; +} +.tamanosection{ + padding-top: 10vh; +} +.texto_sub{ + text-align: center; + text-decoration: underline #00B172; + +} +.texto_imagen{ + width: 20vw; + height: 50vh; + text-align: center; + margin-right: 15vh; + margin-left: 15vh; +} +.redimensionar_Icon{ + width: 20vw; + height: 20vh; +} +.verde{ + color: #00B172; +} +.fuente_icono{ + font-family: 'Encode Sans SC', sans-serif; + font-family: 'Open Sans', sans-serif; + color:grey; +} +.texto_grande{ + color: #FFF; + font-family: 'Encode Sans SC', sans-serif; +font-family: 'Open Sans', sans-serif; + font-size: 35px; + text-decoration: underline; +} +.texto_informacion{ + color: #FFF; + font-family: 'Encode Sans SC', sans-serif; +font-family: 'Open Sans', sans-serif; + font-size: 22px; +} +.texto_informacion_pequeno{ + color: #FFF; + font-family: 'Encode Sans SC', sans-serif; +font-family: 'Open Sans', sans-serif; + font-size: 16px; +} +.reducir_imagen{ + width: 20vh; + height: 20vh; +} +.informacion--imagen{ + width: 10vw; + height: 50vh; + padding-top: 40vh; + +} +.informacion--album{ + width: 40 vw; + height: 80vh; + margin-top: 10vh; + margin-bottom: 10vh; + margin-left: 10vw; + margin-right: 5vw; +} +.informacion--album--imagen{ + width: 30vw; + height: 80vh; +} \ No newline at end of file