fix(pointed borders) - Change the appearance order and style of ‘poin…

…ted’ borders to be consistent with the rounded ones Also rename them to ‘flat’ borders
delaguilaluis · Mar 8, 2017 · 7b6b451 · 7b6b451
1 parent 3cf354f
commit 7b6b451
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 17 deletions.
diff --git a/styles-map.js b/styles-map.js
@@ -7,8 +7,8 @@ module.exports = {
   3: 'box top-right',
   4: 'box bottom-right',
   5: 'box bottom-left',
-  6: 'pointed-border top-left',
-  7: 'pointed-border top-right',
-  8: 'pointed-border bottom-right',
-  9: 'pointed-border bottom-left'
+  6: 'flat-border top-left',
+  7: 'flat-border top-right',
+  8: 'flat-border bottom-right',
+  9: 'flat-border bottom-left'
 }
diff --git a/styles.css b/styles.css
@@ -8,7 +8,7 @@
   padding: 25px;
 }
 
-.pointed-border {
+.flat-border {
   background-color: transparent;
   padding: 0;
 }
@@ -37,26 +37,26 @@
   border-bottom-left-radius: 100%; 
 }
 
-.pointed-border.top-left {
-  border-top: 50px solid blue;
-	border-right: 50px solid transparent;
-}
-
-.pointed-border.top-right {
-  border-top: 50px solid blue;
-	border-left: 50px solid transparent;
-}
-
-.pointed-border.bottom-right {
+.flat-border.top-left {
   border-bottom: 50px solid blue;
   border-left: 50px solid transparent; 
 }
 
-.pointed-border.bottom-left {
+.flat-border.top-right {
   border-bottom: 50px solid blue;
 	border-right: 50px solid transparent;
 }
 
+.flat-border.bottom-right {
+  border-top: 50px solid blue;
+	border-right: 50px solid transparent;
+}
+
+.flat-border.bottom-left {
+  border-top: 50px solid blue;
+	border-left: 50px solid transparent;
+}
+
 .header {
   font-family: sans-serif;
   font-size: 20px;