You are here

Home » API reference » Acquia Lift Connector 7.2

acquia_lift.navbar.css in Acquia Lift Connector 7.2

Same filename and directory in other branches
  1. 7 css/acquia_lift.navbar.css

Styles for integrating Personalize with the Navbar module (version > 1.5).

File

css/acquia_lift.navbar.css
View source 
  1. /**

  2.  * @file

  3.  * Styles for integrating Personalize with the Navbar module (version > 1.5).

  4.  */

  5. /**

  6.  * @file

  7.  * Styles for integrating Personalize with the Navbar module.

  8.  */

  9. /**

  10.  * Personalize top-level icon.

  11.  */

  12. .navbar-bar .navbar-icon-acquia-lift:before {

  13.   background-image: url("../images/bebebe/rocket.svg");

  14. }

  15. 

  16. .no-svg .navbar-bar .navbar-icon-acquia-lift:before {

  17.   background-image: url("../images/bebebe/rocket.png");

  18. }

  19. 

  20. .navbar-bar .navbar-icon-acquia-lift:active:before, .navbar-bar .navbar-icon-acquia-lift.navbar-active:before {

  21.   background-image: url("../images/ffffff/rocket.svg");

  22. }

  23. 

  24. .no-svg .navbar-bar .navbar-icon-acquia-lift:active:before, .no-svg .navbar-bar .navbar-icon-acquia-lift.navbar-active:before {

  25.   background-image: url("../images/ffffff/rocket.png");

  26. }

  27. 

  28. /**

  29.  * Personalize second-level icon.

  30.  */

  31. .navbar-box .navbar-icon-acquia-lift:before {

  32.   background-image: url("../images/707070/rocket.svg");

  33. }

  34. 

  35. .no-svg .navbar-box .navbar-icon-acquia-lift:before {

  36.   background-image: url("../images/707070/rocket.png");

  37. }

  38. 

  39. #navbar-administration .acquia-lift-active {

  40.   font-weight: bold;

  41. }

  42. #navbar-administration .acquia-lift-active .acquia-lift-campaign {

  43.   font-weight: bold;

  44. }

  45. #navbar-administration .acquia-lift-active.acquia-lift-menu-link {

  46.   font-weight: normal;

  47. }

  48. #navbar-administration .acquia-lift-campaigns .navbar-box {

  49.   display: inline-block;

  50.   width: 100%;

  51. }

  52. #navbar-administration .navbar-tray-vertical .acquia-lift-campaigns .navbar-box .acquia-lift-campaign {

  53.   margin-right: 0;

  54. }

  55. #navbar-administration.navbar-oriented .acquia-lift-campaign {

  56.   padding-right: 0;

  57.   /* LTR */

  58. }

  59. #navbar-administration .navbar-tray-horizontal > .navbar-lining {

  60.   padding-right: 3em;

  61.   /* LTR */

  62. }

  63. 

  64. /* Menu wrapper container */

  65. #navbar-administration .navbar-tray-vertical .navbar-twisty > .menu-wrapper {

  66.   display: none;

  67. }

  68. #navbar-administration .navbar-tray-vertical .navbar-twisty.open > .menu-wrapper {

  69.   display: block;

  70. }

  71. #navbar-administration .acquia-lift-menu-item {

  72.   margin-top: .88em;

  73.   margin-bottom: .88em;

  74. }

  75. #navbar-administration .navbar-level-1 .menu-wrapper > .navbar-menu *:not(select),

  76. #navbar-administration .navbar-level-1 .navbar-menu *:not(select) {

  77.   line-height: 1.5;

  78. }

  79. 

  80. /* Horizontal dropdowns */

  81. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-menu li:hover ul {

  82.   display: block;

  83. }

  84. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-level-1 > ul, #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-level-1 > .menu-wrapper {

  85.   border-color: #ccc;

  86.   border-style: solid;

  87.   border-width: 0 0.1em 0.1em;

  88.   box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.6);

  89.   margin-left: -1px;

  90.   position: absolute;

  91.   top: 100%;

  92. }

  93. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-level-1 > .menu-wrapper > .navbar-menu,

  94. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-level-1 > .navbar-menu {

  95.   max-width: 30em;

  96.   min-width: 26em;

  97. }

  98. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .acquia-lift-scrollable {

  99.   max-height: 70vh;

  100.   overflow-y: auto;

  101. }

  102. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-menu ul ul {

  103.   border-bottom: 0.1em solid #ccc;

  104.   border-top: 0.1em solid #ccc;

  105. }

  106. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-level-2 {

  107.   clear: both;

  108.   float: none;

  109. }

  110. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .acquia-lift-personalize-type-count {

  111.   display: inline-block;

  112. }

  113. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .acquia-lift-personalize-type-count span {

  114.   background-color: #85b200;

  115.   border-radius: 1em;

  116.   color: #fff;

  117.   padding: 0 0.35em;

  118.   font-weight: bold;

  119. }

  120. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .acquia-lift-personalize-type-count.acquia-lift-empty span {

  121.   background-color: #ccc;

  122. }

  123. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .acquia-lift-content-variation {

  124.   border-top: 0.1em solid #ccc;

  125.   background-color: #eee;

  126. }

  127. 

  128. /* Campaign drop-down */

  129. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item {

  130.   margin-top: .7em;

  131.   margin-bottom: .7em;

  132.   padding-top: 0;

  133.   padding-bottom: 0;

  134. }

  135. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-menu-actions {

  136.   float: right;

  137.   padding-left: .5em;

  138. }

  139. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-campaign-edit,

  140. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-variation-delete,

  141. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-variation-rename,

  142. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-variation-edit,

  143. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-goal-rename,

  144. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-goal-delete {

  145.   margin-left: .5em;

  146. }

  147. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-campaign {

  148.   margin-right: -4.2em;

  149.   padding-right: 4.2em;

  150. }

  151. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-campaign-edit {

  152.   width: 4.2em;

  153. }

  154. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-variation-edit {

  155.   width: 2.3em;

  156. }

  157. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-variation-delete,

  158. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-goal-delete {

  159.   width: 4em;

  160. }

  161. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-variation-rename,

  162. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-item .acquia-lift-goal-rename {

  163.   width: 4.6em;

  164. }

  165. #navbar-administration .navbar-tray-vertical .acquia-lift-active-container * {

  166.   line-height: 1.3;

  167. }

  168. #navbar-administration .navbar-tray-vertical .acquia-lift-menu-item {

  169.   margin-top: 0.65em;

  170.   margin-bottom: 0.65em;

  171.   padding-top: 0;

  172.   padding-bottom: 0;

  173.   padding-left: 0;

  174.   line-height: 1.3;

  175. }

  176. #navbar-administration .navbar-tray-vertical .acquia-lift-menu-item a {

  177.   display: block;

  178. }

  179. 

  180. /* Displayed as links within menus */

  181. #navbar-administration .navbar-tray .acquia-lift-menu-link, #navbar-administration .navbar-menu .navbar-menu a.acquia-lift-menu-link {

  182.   color: #29aae1;

  183. }

  184. #navbar-administration .navbar-tray .acquia-lift-menu-link:hover, #navbar-administration .navbar-tray .acquia-lift-menu-link:active, #navbar-administration .navbar-menu .navbar-menu a.acquia-lift-menu-link:hover, #navbar-administration .navbar-menu .navbar-menu a.acquia-lift-menu-link:active {

  185.   color: #007ec0;

  186. }

  187. #navbar-administration .navbar-tray .acquia-lift-menu-link.acquia-lift-disabled, #navbar-administration .navbar-menu .navbar-menu a.acquia-lift-menu-link.acquia-lift-disabled {

  188.   color: #999;

  189.   cursor: default;

  190. }

  191. 

  192. /* Create links */

  193. #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-create, #navbar-administration .navbar-tray-horizontal .acquia-lift-menu-all {

  194.   border-top: 0.1em solid #ccc;

  195.   padding: 1.0em 1.3333em 1.0em 1.3333em;

  196. }

  197. #navbar-administration .navbar-tray-horizontal .navbar-menu ul li.last {

  198.   padding-top: .6em;

  199. }

  200. #navbar-administration .acquia-lift-variation-add:before,

  201. #navbar-administration .acquia-lift-menu-create:before {

  202.   content: '+';

  203.   font-weight: bold;

  204.   font-size: 1.3em;

  205.   line-height: 0.89982;

  206.   padding-right: 0.2em;

  207.   vertical-align: text-bottom;

  208. }

  209. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-menu ul ul:last-child {

  210.   border-bottom: none;

  211. }

  212. 

  213. /* General text */

  214. #navbar-administration .navbar-tray .acquia-lift-menu-disabled {

  215.   color: #c6c6c6;

  216. }

  217. #navbar-administration .navbar-tray a.acquia-lift-menu-disabled {

  218.   pointer-events: none;

  219.   cursor: default;

  220. }

  221. #navbar-administration .navbar-tray a.acquia-lift-menu-disabled:hover, #navbar-administration .navbar-tray a.acquia-lift-menu-disabled:active {

  222.   color: #c6c6c6;

  223. }

  224. #navbar-administration .navbar-tray .acquia-lift-menu-campaign-warning {

  225.   padding-left: 38px;

  226.   margin-left: 1.5em;

  227.   background: #fff url(../images/FF8000/alert.png) no-repeat left center;

  228. }

  229. 

  230. /* Nested menu uls for data grouping (rather than visual grouping) */

  231. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-menu ul ul.innerMenuList {

  232.   border: none;

  233.   background-color: inherit;

  234.   padding-top: 1em;

  235. }

  236. #navbar-administration .navbar-tray-acquia-lift.navbar-tray-horizontal .navbar-menu ul ul.innerMenuList .navbar-menu-item {

  237.   padding: .5em 1.3333em .5em .2em;

  238. }

  239. 

  240. /* Additional edit links are only available in horizontal view */

  241. #navbar-administration .navbar-tray-vertical .acquia-lift-campaign-edit, #navbar-administration .navbar-tray-vertical .acquia-lift-variation-delete, #navbar-administration .navbar-tray-vertical .acquia-lift-variation-rename, #navbar-administration .navbar-tray-vertical .acquia-lift-variation-edit, #navbar-administration .navbar-tray-vertical .acquia-lift-goal-rename, #navbar-administration .navbar-tray-vertical .acquia-lift-goal-delete {

  242.   display: none !important;

  243. }

  244. #navbar-administration .navbar-tray-vertical .acquia-lift-goal {

  245.   padding-left: .6663em;

  246. }

  247. 

  248. /**

  249.  * Keep long names compact.

  250.  */

  251. #navbar-administration .acquia-lift-campaign-list,

  252. #navbar-administration .acquia-lift-option-sets-list {

  253.   padding-top: 0.9em;

  254.   padding-bottom: 0.75em;

  255.   min-height: 3em;

  256. }

  257. #navbar-administration .acquia-lift-campaign-list, #navbar-administration .acquia-lift-campaign-list span,

  258. #navbar-administration .acquia-lift-option-sets-list,

  259. #navbar-administration .acquia-lift-option-sets-list span {

  260.   line-height: 1.2em;

  261. }

  262. #navbar-administration .acquia-lift-active-container {

  263.   position: relative;

  264.   display: inline-block;

  265.   word-wrap: normal;

  266.   overflow-x: hidden;

  267. }

  268. #navbar-administration .acquia-lift-active-container::after {

  269.   content: "\02026";

  270.   display: inline-block;

  271.   position: absolute;

  272.   top: 0;

  273.   width: 2em;

  274.   margin-left: -2em;

  275.   text-align: right;

  276.   font-weight: bold;

  277.   background-image: -webkit-linear-gradient(180deg, #fff, #fff 1.1em, rgba(255, 255, 255, 0) 100%);

  278.   background-image: linear-gradient(270deg, #fff, #fff 1.1em, rgba(255, 255, 255, 0) 100%);

  279.   color: rgba(51, 51, 51, 0.6);

  280. }

  281. html[dir="rtl"] #navbar-administration .acquia-lift-active-container::after {

  282.   text-align: left;

  283.   background-image: -webkit-linear-gradient(0deg, #fff, #fff 1.1em, rgba(255, 255, 255, 0) 100%);

  284.   background-image: linear-gradient(90deg, #fff, #fff 1.1em, rgba(255, 255, 255, 0) 100%);

  285. }

  286. #navbar-administration .acquia-lift-active-container, #navbar-administration .acquia-lift-active-container * {

  287.   white-space: pre;

  288. }

  289. #navbar-administration .navbar-tray-horizontal .acquia-lift-active-container {

  290.   max-width: 8em;

  291. }

  292. #navbar-administration .navbar-tray-horizontal .acquia-lift-active-container::after {

  293.   left: 8em;

  294. }

  295. @media screen and (min-width: 1024px) {

  296.   #navbar-administration .navbar-tray-horizontal .acquia-lift-active-container {

  297.     max-width: 16em;

  298.   }

  299.   #navbar-administration .navbar-tray-horizontal .acquia-lift-active-container::after {

  300.     left: 16em;

  301.   }

  302. }

  303. @media screen and (min-width: 1366px) {

  304.   #navbar-administration .navbar-tray-horizontal .acquia-lift-active-container {

  305.     max-width: 30em;

  306.   }

  307.   #navbar-administration .navbar-tray-horizontal .acquia-lift-active-container::after {

  308.     left: 30em;

  309.   }

  310.   html[dir="rtl"] #navbar-administration .navbar-tray-horizontal .acquia-lift-active-container::after {

  311.     right: 30em;

  312.     left: auto;

  313.   }

  314. }

  315. #navbar-administration .navbar-tray-vertical .acquia-lift-active-container {

  316.   max-width: 13em;

  317. }

  318. #navbar-administration .navbar-tray-vertical .acquia-lift-active-container::after {

  319.   left: 13em;

  320. }

  321. html[dir="rtl"] #navbar-administration .navbar-tray-vertical .acquia-lift-active-container::after {

  322.   right: 13em;

  323.   left: auto;

  324. }