Skip to content

Instantly share code, notes, and snippets.

@nautical

nautical/styles.diff

Last active September 13, 2018 00:59
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save nautical/c7d006c5808b9229976b8de80ed8c60f to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save nautical/c7d006c5808b9229976b8de80ed8c60f to your computer and use it in GitHub Desktop.
Download ZIP
Raw
styles.diff
--- app_extract/styles/main.css 2018-09-13 06:25:53.000000000 +0530
+++ app_extract.backup/styles/main.css 2018-09-13 05:50:13.000000000 +0530
@@ -5838,21 +5838,21 @@
color: rgba(255, 255, 255, 0.3); }
.mdi-rotate-45 {
- /*
- // Not included in production
- &.mdi-flip-h:before {
- -webkit-transform: scaleX(-1) rotate(45deg);
- transform: scaleX(-1) rotate(45deg);
- filter: FlipH;
- -ms-filter: "FlipH";
- }
- &.mdi-flip-v:before {
- -webkit-transform: scaleY(-1) rotate(45deg);
- -ms-transform: rotate(45deg);
- transform: scaleY(-1) rotate(45deg);
- filter: FlipV;
- -ms-filter: "FlipV";
- }
+ /*
+ // Not included in production
+ &.mdi-flip-h:before {
+ -webkit-transform: scaleX(-1) rotate(45deg);
+ transform: scaleX(-1) rotate(45deg);
+ filter: FlipH;
+ -ms-filter: "FlipH";
+ }
+ &.mdi-flip-v:before {
+ -webkit-transform: scaleY(-1) rotate(45deg);
+ -ms-transform: rotate(45deg);
+ transform: scaleY(-1) rotate(45deg);
+ filter: FlipV;
+ -ms-filter: "FlipV";
+ }
*/ }
.mdi-rotate-45:before {
-webkit-transform: rotate(45deg);
@@ -5860,21 +5860,21 @@
transform: rotate(45deg); }
.mdi-rotate-90 {
- /*
- // Not included in production
- &.mdi-flip-h:before {
- -webkit-transform: scaleX(-1) rotate(90deg);
- transform: scaleX(-1) rotate(90deg);
- filter: FlipH;
- -ms-filter: "FlipH";
- }
- &.mdi-flip-v:before {
- -webkit-transform: scaleY(-1) rotate(90deg);
- -ms-transform: rotate(90deg);
- transform: scaleY(-1) rotate(90deg);
- filter: FlipV;
- -ms-filter: "FlipV";
- }
+ /*
+ // Not included in production
+ &.mdi-flip-h:before {
+ -webkit-transform: scaleX(-1) rotate(90deg);
+ transform: scaleX(-1) rotate(90deg);
+ filter: FlipH;
+ -ms-filter: "FlipH";
+ }
+ &.mdi-flip-v:before {
+ -webkit-transform: scaleY(-1) rotate(90deg);
+ -ms-transform: rotate(90deg);
+ transform: scaleY(-1) rotate(90deg);
+ filter: FlipV;
+ -ms-filter: "FlipV";
+ }
*/ }
.mdi-rotate-90:before {
-webkit-transform: rotate(90deg);
@@ -5882,21 +5882,21 @@
transform: rotate(90deg); }
.mdi-rotate-135 {
- /*
- // Not included in production
- &.mdi-flip-h:before {
- -webkit-transform: scaleX(-1) rotate(135deg);
- transform: scaleX(-1) rotate(135deg);
- filter: FlipH;
- -ms-filter: "FlipH";
- }
- &.mdi-flip-v:before {
- -webkit-transform: scaleY(-1) rotate(135deg);
- -ms-transform: rotate(135deg);
- transform: scaleY(-1) rotate(135deg);
- filter: FlipV;
- -ms-filter: "FlipV";
- }
+ /*
+ // Not included in production
+ &.mdi-flip-h:before {
+ -webkit-transform: scaleX(-1) rotate(135deg);
+ transform: scaleX(-1) rotate(135deg);
+ filter: FlipH;
+ -ms-filter: "FlipH";
+ }
+ &.mdi-flip-v:before {
+ -webkit-transform: scaleY(-1) rotate(135deg);
+ -ms-transform: rotate(135deg);
+ transform: scaleY(-1) rotate(135deg);
+ filter: FlipV;
+ -ms-filter: "FlipV";
+ }
*/ }
.mdi-rotate-135:before {
-webkit-transform: rotate(135deg);
@@ -5904,21 +5904,21 @@
transform: rotate(135deg); }
.mdi-rotate-180 {
- /*
- // Not included in production
- &.mdi-flip-h:before {
- -webkit-transform: scaleX(-1) rotate(180deg);
- transform: scaleX(-1) rotate(180deg);
- filter: FlipH;
- -ms-filter: "FlipH";
- }
- &.mdi-flip-v:before {
- -webkit-transform: scaleY(-1) rotate(180deg);
- -ms-transform: rotate(180deg);
- transform: scaleY(-1) rotate(180deg);
- filter: FlipV;
- -ms-filter: "FlipV";
- }
+ /*
+ // Not included in production
+ &.mdi-flip-h:before {
+ -webkit-transform: scaleX(-1) rotate(180deg);
+ transform: scaleX(-1) rotate(180deg);
+ filter: FlipH;
+ -ms-filter: "FlipH";
+ }
+ &.mdi-flip-v:before {
+ -webkit-transform: scaleY(-1) rotate(180deg);
+ -ms-transform: rotate(180deg);
+ transform: scaleY(-1) rotate(180deg);
+ filter: FlipV;
+ -ms-filter: "FlipV";
+ }
*/ }
.mdi-rotate-180:before {
-webkit-transform: rotate(180deg);
@@ -5926,21 +5926,21 @@
transform: rotate(180deg); }
.mdi-rotate-225 {
- /*
- // Not included in production
- &.mdi-flip-h:before {
- -webkit-transform: scaleX(-1) rotate(225deg);
- transform: scaleX(-1) rotate(225deg);
- filter: FlipH;
- -ms-filter: "FlipH";
- }
- &.mdi-flip-v:before {
- -webkit-transform: scaleY(-1) rotate(225deg);
- -ms-transform: rotate(225deg);
- transform: scaleY(-1) rotate(225deg);
- filter: FlipV;
- -ms-filter: "FlipV";
- }
+ /*
+ // Not included in production
+ &.mdi-flip-h:before {
+ -webkit-transform: scaleX(-1) rotate(225deg);
+ transform: scaleX(-1) rotate(225deg);
+ filter: FlipH;
+ -ms-filter: "FlipH";
+ }
+ &.mdi-flip-v:before {
+ -webkit-transform: scaleY(-1) rotate(225deg);
+ -ms-transform: rotate(225deg);
+ transform: scaleY(-1) rotate(225deg);
+ filter: FlipV;
+ -ms-filter: "FlipV";
+ }
*/ }
.mdi-rotate-225:before {
-webkit-transform: rotate(225deg);
@@ -5948,21 +5948,21 @@
transform: rotate(225deg); }
.mdi-rotate-270 {
- /*
- // Not included in production
- &.mdi-flip-h:before {
- -webkit-transform: scaleX(-1) rotate(270deg);
- transform: scaleX(-1) rotate(270deg);
- filter: FlipH;
- -ms-filter: "FlipH";
- }
- &.mdi-flip-v:before {
- -webkit-transform: scaleY(-1) rotate(270deg);
- -ms-transform: rotate(270deg);
- transform: scaleY(-1) rotate(270deg);
- filter: FlipV;
- -ms-filter: "FlipV";
- }
+ /*
+ // Not included in production
+ &.mdi-flip-h:before {
+ -webkit-transform: scaleX(-1) rotate(270deg);
+ transform: scaleX(-1) rotate(270deg);
+ filter: FlipH;
+ -ms-filter: "FlipH";
+ }
+ &.mdi-flip-v:before {
+ -webkit-transform: scaleY(-1) rotate(270deg);
+ -ms-transform: rotate(270deg);
+ transform: scaleY(-1) rotate(270deg);
+ filter: FlipV;
+ -ms-filter: "FlipV";
+ }
*/ }
.mdi-rotate-270:before {
-webkit-transform: rotate(270deg);
@@ -5970,21 +5970,21 @@
transform: rotate(270deg); }
.mdi-rotate-315 {
- /*
- // Not included in production
- &.mdi-flip-h:before {
- -webkit-transform: scaleX(-1) rotate(315deg);
- transform: scaleX(-1) rotate(315deg);
- filter: FlipH;
- -ms-filter: "FlipH";
- }
- &.mdi-flip-v:before {
- -webkit-transform: scaleY(-1) rotate(315deg);
- -ms-transform: rotate(315deg);
- transform: scaleY(-1) rotate(315deg);
- filter: FlipV;
- -ms-filter: "FlipV";
- }
+ /*
+ // Not included in production
+ &.mdi-flip-h:before {
+ -webkit-transform: scaleX(-1) rotate(315deg);
+ transform: scaleX(-1) rotate(315deg);
+ filter: FlipH;
+ -ms-filter: "FlipH";
+ }
+ &.mdi-flip-v:before {
+ -webkit-transform: scaleY(-1) rotate(315deg);
+ -ms-transform: rotate(315deg);
+ transform: scaleY(-1) rotate(315deg);
+ filter: FlipV;
+ -ms-filter: "FlipV";
+ }
*/ }
.mdi-rotate-315:before {
-webkit-transform: rotate(315deg);
@@ -6561,7 +6561,7 @@
flex-direction: column;
align-items: center;
width: 68px;
- background: #2d2d2d;
+ background: #f7f7f9;
box-shadow: 1px 0 10px rgba(0, 0, 0, 0.08);
z-index: 200;
text-align: center;
@@ -6650,8 +6650,8 @@
min-height: 50px;
transition: background 0.5s; }
.tab-item.is-active {
- border-left: 4px solid #8d2663;
- background: #000000; }
+ border-left: 4px solid #3498db;
+ background: #cce5f6; }
.tab-item.is-active .tab-item__icon {
margin-left: -4px; }
.tab-item.is-disabled .tab-item__icon {
@@ -6788,7 +6788,7 @@
min-height: 400px;
max-height: 720px;
z-index: 9999;
- background: #2d2d2d;
+ background: #FFF;
border-radius: 6px;
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
overflow: hidden; }
@@ -6796,7 +6796,6 @@
flex: 1;
display: flex;
flex-direction: column;
- color: white;
height: auto; }
.settings .settings__header {
display: flex;
@@ -6804,7 +6803,7 @@
width: calc(100% - 60px);
height: 50px;
padding: 0 40px;
- background: #373a3c; }
+ background: #eceeef; }
.settings .settings__header h1 {
margin: 0; }
.settings .settings__header .separator {
@@ -6848,15 +6847,15 @@
.settings .settings__close {
position: absolute;
right: 0;
- background: #373a3c;
+ background: #eceeef;
height: 50px;
padding: 0 20px;
font-size: 20px;
- border-left: 1px solid #373a3c;
+ border-left: 1px solid #dee2e3;
color: #818a91;
transition: background 0.5s; }
.settings .settings__close:hover {
- background: #4c4c4c; }
+ background: #dee2e3; }
.settings .search-input {
margin-bottom: 30px; }
.settings__options {
@@ -6909,7 +6908,7 @@
.settings .account {
height: auto; }
.settings .account .account__box {
- background: #373a3c;
+ background: #f7f7f9;
border-radius: 6px;
padding: 20px;
margin-bottom: 40px;
@@ -6981,7 +6980,7 @@
.settings-navigation {
width: 200px;
height: auto;
- background: #373a3c;
+ background: #f7f7f9;
display: flex;
flex-direction: column; }
.settings-navigation .settings-navigation__link {
@@ -6990,13 +6989,13 @@
height: 50px;
flex-shrink: 0;
text-decoration: none;
- color: white;
+ color: #373a3c;
padding: 0 20px;
transition: background 0.5s, color 0.5s; }
.settings-navigation .settings-navigation__link:hover {
- background: #4c4c4c; }
+ background: #e8e8ee; }
.settings-navigation .settings-navigation__link:hover .badge {
- background: #55595c; }
+ background: #FFF; }
.settings-navigation .settings-navigation__link.is-active {
background: #3498db;
color: #FFF; }
@@ -7081,12 +7080,11 @@
height: 120px;
margin: 0 20px 20px 0;
border-radius: 6px;
- background-color: #373a3c;
- color: white;
+ background-color: #f7f7f9;
transition: background 0.5s;
overflow: hidden; }
.recipe-teaser:hover {
- background-color: #4c4c4c; }
+ background-color: #eceeef; }
.recipe-teaser .recipe-teaser__icon {
width: 50px;
margin-bottom: 10px; }
@@ -7537,7 +7535,7 @@
display: inline-block;
padding: 5px 10px;
border-radius: 6px;
- background: #4c4c4c; }
+ background: #eceeef; }
.badge.badge--primary, .badge.badge--premium {
background: #3498db;
color: #FFF; }
@@ -7745,7 +7743,7 @@
.franz-form .franz-form__radio {
border: 2px solid #eceeef;
- color: #eceeef;
+ color: #55595c;
padding: 11px;
margin-right: 20px;
text-align: center;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment