Style of Tracks Section

Melissa Wen
1 parent 32c0ebb6
Showing 6 changed files with 103 additions and 0 deletions Show diff stats
_tracks.sass
images/home/05.png
images/home/06.png
images/home/13.png
images/home/14.png
images/home/15.png
@@ -0,0 +1,103 @@
+.track_list
+  .item_card
+    border: 2px solid #ccc
+    border-radius: 5px
+    font-family: 'Ubuntu'
+    height: 295px
+    margin: 0 15px 0 0
+    padding: 0
+    width: 305px
+    &:last-child
+      margin: 0
+    .title
+      border-radius: 5px 5px 0 0
+      height: 100px
+      font-family: 'Ubuntu Mediun'
+      font-size: 22px
+      font-weight: normal
+      line-height: 100px
+      margin: 0
+      text-indent: 95px
+    .name
+      color: #404040 !important
+      font-family: 'Ubuntu Mediun'
+      font-size: 16px
+      font-weight: normal
+      margin: 20px 10px 15px
+      padding: 0
+    .lead
+      margin: 0 10px
+      color: #868686
+      font-size: 14px
+    .track_stats
+      background: #DDD
+      border: none
+      border-radius: 0 0 3px 3px
+      display: block
+      height: 41px
+      margin: 2px
+      .comments, .hits
+        background: transparent url('images/home/05.png') no-repeat left center
+        float: left
+        height: 18px
+        margin: 12px 0px 10px 25px
+        width: auto
+        .label
+          display: none
+        .counter
+          color: #FFF
+          font-size: 14px
+          padding: 0 0 0 25px
+      .hits
+        background: transparent url('images/home/06.png') no-repeat left center
+        margin: 10px 0px 10px 20px
+        .label, .counter
+          color: #FFF
+          display: inline-block
+          font-size: 14px
+    &.category_cultura
+      background: #FAF9EE
+      border-color: #F4DFBE
+      .track_content
+        .title
+          background: #FFF url('images/home/13.png') no-repeat 15px center !important
+          border-color: #F4DFBE
+          color: #AF6EAF
+      .track_stats
+        background: #FA9E00
+    &.category_energia
+      background: #F7FAE7
+      border-color: #DDE5BF
+      .track_content
+        .title
+          background: #FFF url('images/home/14.png') no-repeat 15px center !important
+          border-color: #DDE5BF
+          color: #64BCCA
+      .track_stats
+        background: #9DB329
+    &.category_ciencia
+      background: #F4FBFB
+      border-color: #0D3E6A
+      .track_content
+        .title
+          background: #FFF url('images/home/15.png') no-repeat 15px center !important
+          border-color: #0D3E6A
+          color: #E4CAA7
+      .track_stats
+        background: #123D6E
+
+.community-track-plugin_track-card-list-block
+  .block-footer-content
+    float: right
+    margin: 30px 0 0 auto
+    .more_button
+      background: #258FC2
+      border-radius: 45px
+      padding: 10px 45px
+      width: auto
+      a
+        color: #FFF
+        font-family: 'Ubuntu Mediun'
+        font-size: 14px
+        font-weight: normal
+        text-decoration: none
...	...	@@ -0,0 +1,103 @@
	1	+.track_list
	2	+ .item_card
	3	+ border: 2px solid #ccc
	4	+ border-radius: 5px
	5	+ font-family: 'Ubuntu'
	6	+ height: 295px
	7	+ margin: 0 15px 0 0
	8	+ padding: 0
	9	+ width: 305px
	10	+ &:last-child
	11	+ margin: 0
	12	+ .title
	13	+ border-radius: 5px 5px 0 0
	14	+ height: 100px
	15	+ font-family: 'Ubuntu Mediun'
	16	+ font-size: 22px
	17	+ font-weight: normal
	18	+ line-height: 100px
	19	+ margin: 0
	20	+ text-indent: 95px
	21	+ .name
	22	+ color: #404040 !important
	23	+ font-family: 'Ubuntu Mediun'
	24	+ font-size: 16px
	25	+ font-weight: normal
	26	+ margin: 20px 10px 15px
	27	+ padding: 0
	28	+ .lead
	29	+ margin: 0 10px
	30	+ color: #868686
	31	+ font-size: 14px
	32	+ .track_stats
	33	+ background: #DDD
	34	+ border: none
	35	+ border-radius: 0 0 3px 3px
	36	+ display: block
	37	+ height: 41px
	38	+ margin: 2px
	39	+ .comments, .hits
	40	+ background: transparent url('images/home/05.png') no-repeat left center
	41	+ float: left
	42	+ height: 18px
	43	+ margin: 12px 0px 10px 25px
	44	+ width: auto
	45	+ .label
	46	+ display: none
	47	+ .counter
	48	+ color: #FFF
	49	+ font-size: 14px
	50	+ padding: 0 0 0 25px
	51	+ .hits
	52	+ background: transparent url('images/home/06.png') no-repeat left center
	53	+ margin: 10px 0px 10px 20px
	54	+ .label, .counter
	55	+ color: #FFF
	56	+ display: inline-block
	57	+ font-size: 14px
	58	+ &.category_cultura
	59	+ background: #FAF9EE
	60	+ border-color: #F4DFBE
	61	+ .track_content
	62	+ .title
	63	+ background: #FFF url('images/home/13.png') no-repeat 15px center !important
	64	+ border-color: #F4DFBE
	65	+ color: #AF6EAF
	66	+ .track_stats
	67	+ background: #FA9E00
	68	+ &.category_energia
	69	+ background: #F7FAE7
	70	+ border-color: #DDE5BF
	71	+ .track_content
	72	+ .title
	73	+ background: #FFF url('images/home/14.png') no-repeat 15px center !important
	74	+ border-color: #DDE5BF
	75	+ color: #64BCCA
	76	+ .track_stats
	77	+ background: #9DB329
	78	+ &.category_ciencia
	79	+ background: #F4FBFB
	80	+ border-color: #0D3E6A
	81	+ .track_content
	82	+ .title
	83	+ background: #FFF url('images/home/15.png') no-repeat 15px center !important
	84	+ border-color: #0D3E6A
	85	+ color: #E4CAA7
	86	+ .track_stats
	87	+ background: #123D6E
	88	+
	89	+.community-track-plugin_track-card-list-block
	90	+ .block-footer-content
	91	+ float: right
	92	+ margin: 30px 0 0 auto
	93	+ .more_button
	94	+ background: #258FC2
	95	+ border-radius: 45px
	96	+ padding: 10px 45px
	97	+ width: auto
	98	+ a
	99	+ color: #FFF
	100	+ font-family: 'Ubuntu Mediun'
	101	+ font-size: 14px
	102	+ font-weight: normal
	103	+ text-decoration: none
...	...