Github user derrickdoo commented on a diff in the pull request:
https://github.com/apache/kafka-site/pull/92#discussion_r143322899
--- Diff: css/styles.css ---
@@ -1031,50 +1054,438 @@ nav .btn {
justify-content: center;
width: 268px;
}
-
-.green_card{
+.green_card {
background-color: #00b900;
}
-
.customer__card__label {
color: #000000;
margin-top: 2.4rem;
display: flex;
}
-
@media only screen and (max-width: 1109px) {
.customer__cards {
height: 35rem;
-
- }
+ }
.customer_cards_2 {
- height: 45rem;
- }
-
+ height: 45rem;
+ }
}
-
@media only screen and (max-width: 1023px) {
+ .customer__cards {
+ height: 65rem;
+ flex-direction: column;
+ }
+ .customer_cards_2 {
+ height: 75rem;
+ flex-direction: column;
+ margin-top: 5.2rem;
+ }
+ .customer-right {
+ margin-right: 2rem;
+ }
+ .customer_cards_2 {
+ margin-top: 0rem;
+ }
+}
+.customer-title {
+ margin-top: 62px;
+ margin-bottom: 4.2rem;
+}
+}
+/* Streams page - adding video & cusomter logos*/
- .customer__cards{
- height: 65rem;
- flex-direction: column;
- }
- .customer_cards_2 {
- height: 75rem;
- flex-direction: column;
- margin-top: 5.2rem;
- }
- .customer-right{
- margin-right:2rem;
- }
- .customer_cards_2{
- margin-top: 0rem;
+.streams-menu ul {
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+}
+.streams-menu {
+ padding-left: 0px;
+ width: 90rem;
+}
+.streams-menu li .active-menu-item {
+ color: #000!important;
+ padding-bottom: 7px;
+}
+.streams-menu li .active-menu-item {
+ width: 108px;
+ height: 2px;
+ border-bottom: solid 4px #000000;
+}
+.streams-menu li a {
+ color: #8c8888;
+ margin-top: 16px;
+}
+.streams-menu li {
+ display: inline;
+ height: 28px;
+ font-family: Roboto;
+ font-size: 15px;
+ line-height: 1.87;
+ text-align: left;
+ color: #000000;
+ margin-right: 30px;
+ text-transform: uppercase;
+}
+.video__series__grid {
+ width: 100%;
+ display: -webkit-flex;
+ /* Safari */
+
+ display: flex;
+ margin-bottom: 58px;
+ /*flex-direction: row;*/
+}
+.video__series__grid div {
+ -webkit-flex: 1;
+ /* Safari 6.1+ */
+
+ -ms-flex: 1;
+ /* IE 10 */
+
+ flex: 1;
+}
+.video-list li {
+ display: list-item;
+ font-family: Roboto;
+ font-size: 15px;
+ line-height: 2.67;
+ text-align: left;
+ color: #d8d8d8;
+ text-transform: capitalize;
+}
+.mobile-video-list li {
+ display: inline-block;
+ font-family: Roboto;
+ font-size: 15px;
+ line-height: 2.67;
+ text-align: left;
+ color: #d8d8d8;
+ text-transform: capitalize;
+}
+.mobile-video-list .active {
+ color: #000;
+}
+.mobile-video-list .active:before {
+ background-color: #000;
+ border: solid 2px #000;
+}
+.video-list .active {
+ color: #000;
+}
+.video-list .active:before {
+ background-color: #000;
+ border: solid 2px #000;
+}
+@media only screen and (min-width: 1126px) {
+ .mobile-video-list {
+ display: none;
+ }
+}
+@media only screen and (max-width: 1125px) {
+ .video__series_grid {
+ flex-direction: column;
+ }
+ .video__block h3 {
+ display: none;
}
+ .video-list {
+ display: none;
+ }
+ .mobile-video-list {
+ display: block;
+ }
+}
+ul.video-list,
+ul.mobile-video-list {
+ list-style-type: none;
+ /* Setup the counter. */
+
+ counter-reset: num;
+ padding-left: 0px;
+}
+.video-list li,
+.mobile-video-list li {
+ margin-bottom: 1rem;
+}
+.video-list li:before,
+.mobile-video-list li:before {
+ /* Advance the number. */
+
+ counter-increment: num;
+ /* Use the counter number as content. */
+
+ content: counter(num);
+ color: #fff;
+ background-color: #d8d8d8;
+ width: 50px;
+ border-radius: 50%;
+ padding: 5px 10px;
+ margin-right: .8rem;
+}
+.grid__item__customer__description {
+ margin: 0 2rem 2rem;
+ padding-top: 0rem;
+}
+.stream__text {
+ margin-top: 5.2rem;
+ margin-bottom: 3.2rem;
+}
+.video__block h3 {
+ font-size: 15px;
+ line-height: 1.87;
+ font-family: Roboto;
+}
+.video__block {
+ padding-left: 42px;
+}
+.streams_intro {
+ margin-top: 42px;
+ margin-bottom: 15px;
+}
+.streams__description {
+ font-family: Roboto;
+ font-size: 15px;
+ line-height: 1.87;
+ text-align: justify;
+ color: #000000;
+ margin-bottom: 54px;
+ max-width: 91rem;
+}
+.separator {
+ width: 920px;
+ margin-right: 153px;
+}
+.customers__grid * {
+ box-sizing: border-box;
+}
+@media (min-width: 1126px) {
+ .customers__grid {
+ -webkit-column-count: 2;
+ -moz-column-count: 2;
+ column-count: 2;
+ max-width: 92rem;
+ }
+}
+.customer__grid {
+ margin: 0;
+ padding-bottom: 20px;
+}
+.customer__item {
+ border-radius: 10px;
+ overflow: hidden;
+ padding: 0px;
+ width: 100%;
+}
+.streams_logo_grid {
+ border: solid 1px #888888;
+}
+.streams__ny__grid,
+.streams__line__grid,
+.streams__rabobank__grid,
+.streams__zalando__grid {
+ height: auto;
+}
+.grid__logo__link {
+ display: block;
+ height: 8rem;
+ margin-bottom: 2rem;
+ text-align: center;
+ padding-top: 2rem;
+}
+.navbar-fixed {
+ position: fixed;
+ background-color: #fff;
+ color: #fff;
+ margin-top: 0px;
+ padding: 10px 0px;
--- End diff --
padding: 10px 0 20px;
---
