Fix before and after selectors

docs/_sass/example.sass

@@ -3,7 +3,7 @@
 .bd-snippet
   border: 1px solid $yellow
   position: relative
-  &:before
+  &::before
     background: $yellow
     border-radius: $radius $radius 0 0
     bottom: 100%
@@ -150,14 +150,14 @@ $structure-invert: $danger-invert
   border-color: $structure
   border-radius: $radius
   padding: 1.5rem
-  &:before
+  &::before
     background: $structure
     color: $structure-invert
     content: "Structure"
 
 .bd-structure-item
   position: relative
-  &:before
+  &::before
     +overlay
     background: rgba($black, 0.7)
     background: $background
@@ -165,7 +165,7 @@ $structure-invert: $danger-invert
     content: ""
     display: block
     z-index: 1
-  &:after
+  &::after
     +overlay
     align-items: center
     content: attr(title)
@@ -177,7 +177,7 @@ $structure-invert: $danger-invert
     z-index: 2
   &.bd-is-structure-container
     padding: 1.5rem 0.75rem 0.75rem
-    &:after
+    &::after
       align-items: flex-start
       justify-content: flex-start
       padding: 0.5rem 0.75rem