wip

src/index.pug

@@ -35,6 +35,9 @@ html(lang="en")
         #circle(hidden).with-sidebar
           include page-circle.pug
 
+        #circle-edit(hidden).no-sidebar
+          include page-circle-edit.pug
+
         #messages(hidden).with-sidebar
           include page-messages.pug
         

src/menu-left.pug

@@ -77,6 +77,7 @@ nav#main__menu
           order-by='username'
           next='messages'
         )
+    sib-route(hidden, name='circle-edit')
 
     //- div.divider
     //- sib-route.menu(hidden, name='my-profile', rdf-type='foaf:user', use-id='')

src/page-circle-profile.pug

 .content-box.with-padding.full-width
+
+
+
+  sib-display.content-box__header.with-edit(
+    bind-resources
+    fields='name'
+    class-name='name'
+    value-status='Public'
+  )
+
+  sib-link(class="editlink", next="circle-edit" bind-resources)
+
   h2 Channel's name:
   sib-display(
     fields='name',

src/page-circle.pug

@@ -3,7 +3,7 @@
     include page-circle-chat.pug
   #circle-profile
     include page-circle-profile.pug
-  #circle-edit
+  //-#circle-edit
     include page-circle-edit.pug
   //-#circle-create
     include page-circle-create.pug
@@ -18,7 +18,7 @@ nav.jsRightMenu(role='navigation')
       sib-route(name='circle-profile')
         li
           a Information
-      sib-route(name='circle-edit')
+      //-sib-route(name='circle-edit')
         li
           a Edit
       //-sib-route(name='circle-create')

src/styles/base/main.scss

@@ -155,6 +155,23 @@ sib-delete {
   border: 0;
 }
 
+.content-box__header.with-edit {
+  border-bottom: 1px solid $color-221-51-90;
+
+  div {
+
+    .name {
+      text-transform: uppercase;
+    }
+
+    .edit {
+      color: $color-213-4-50;
+      font-size: 1.6rem;
+      margin-left: auto;
+    }
+  }
+}
+
 .backlink {
   font-size: 1.5rem;
   margin: 2rem 0 0 2rem;
@@ -172,6 +189,20 @@ sib-delete {
   }
 }
 
+.editlink {
+  font-size: 1.6rem;
+  @include icon('pencil');
+  color: white;
+
+  &::before {
+    background: $color-244-73-62;
+    border-radius: 50%;
+    text-decoration: none;
+    height: 34px;
+    width: 34px;
+  }
+}
+
 .name {
   color: $color-216-4-22;
   font-size: 2rem;