Changeset 1196 for sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss

Timestamp:

01/27/2015 12:39:51 AM (12 years ago)

Author:

coffee2code

Message:

developer.wordpress.org: Add 'Used By' and 'Uses' sections to parsed content permalink pages.

Basically the UI surfacing of the P2P relationships.

Fixes #323.
Props atimmer.

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss (modified) (5 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss

@@ -466 +466 @@
          * section styles
          */
+
+        section {
+                overflow: auto;
+        }
 
         .home-landing .section {
@@ -923 +927 @@
         .wp-parser-class, .wp-parser-function, .wp-parser-hook, .wp-parser-method {
                 border-bottom: 1px solid #dfdfdf;
+
                 h1 {
                         margin: 24px 0;
@@ -1013 +1018 @@
         }
 
+        /* = Usage
+        ----------------------------------------------- */
+        .usage {
+                article {
+                        float: left;
+                        width: 50%;
+                }
+
+                .used-by {
+                        padding-right: 30px;
+                }
+
+                .uses {
+                        padding-left: 30px;
+                }
+
+                ul {
+                        line-height: 1.7; /* Slightly increase the line height for more readability */
+                        list-style-type: none;
+                        margin: 0;
+                }
+
+                .show-more, .hide-more {
+                        display: none;
+                }
+        }
+
+
         .source-content {
                 overflow: auto;
@@ -1303 +1336 @@
                         padding-left: 0;
                 }
+
+                &.archive, &.search {
+                        .meta {
+                                font-size: 100%;
+                                margin-bottom: 1.5em;
+
+                                a {
+                                        color: #21759b;
+                                }
+                        }
+                }
+        }
+
+}
+
+@media ( min-width: 43em ) {
+        .devhub-wrap {
+                &.archive, &.search {
+                        .meta {
+                                float: right;
+                        }
+
+                        .sourcefile {
+                                float: left;
+                        }
+                }
         }
 }
@@ -1390 +1449 @@
                         width: 99%;
                 }
+
+                .usage {
+                        article {
+                                width: 100%;
+                        }
+                }
         }
 }