Guest User

Untitled

a guest
Dec 26th, 2011
1,865
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /* Copyright 2009, Red Hat, Inc.
  2. *
  3. * Portions adapted from Mx's data/style/default.css
  4. * Copyright 2009 Intel Corporation
  5. *
  6. * This program is free software; you can redistribute it and/or modify it
  7. * under the terms and conditions of the GNU Lesser General Public License,
  8. * version 2.1, as published by the Free Software Foundation.
  9. *
  10. * This program is distributed in the hope it will be useful, but WITHOUT ANY
  11. * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
  12. * FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for
  13. * more details.
  14. *
  15. * You should have received a copy of the GNU Lesser General Public License
  16. * along with this program; if not, write to the Free Software Foundation,
  17. * Inc., 51 Franklin St - Fifth Floor, Boston, MA 02110-1301 USA.
  18. */
  19.  
  20. /* Zukitwo Gnome-shell theme by lassekongo83 */
  21.  
  22. stage {
  23. font-family: Liberation Sans;
  24. }
  25.  
  26. .shell-link {
  27. color: #0000ff;
  28. text-decoration: underline;
  29. }
  30.  
  31. .shell-link:hover {
  32. color: #0000e0;
  33. }
  34.  
  35. .label-shadow {
  36. color: rgba(0,0,0,0.5);
  37. }
  38.  
  39. StScrollBar {
  40. padding: 0px;
  41. }
  42.  
  43. StScrollView.vfade {
  44. -st-vfade-offset: 68px;
  45. }
  46.  
  47. StScrollView StScrollBar {
  48. min-width: 8px;
  49. min-height: 20px;
  50. }
  51.  
  52.  
  53. StScrollBar StBin#trough {
  54. background-gradient-direction: vertical;
  55. background-gradient-start: rgba(255,255,255,0.2);
  56. background-gradient-end: rgba(255,255,255,0.0);
  57. box-shadow: inset 2px 2px 2px 0px rgba(0,0,0,0.1) ;
  58. border: 1px solid rgba(0,0,0,0.2);
  59. border-radius: 8px;
  60. }
  61.  
  62. StScrollBar StButton#vhandle {
  63. background-gradient-direction: horizontal;
  64. background-gradient-start: rgba(255,255,255,0.4);
  65. background-gradient-end: rgba(255,255,255,0.3);
  66. border: 1px solid rgba(0,0,0,0.25);
  67. border-radius: 8px;
  68. }
  69.  
  70. StScrollBar StButton#hhandle {
  71. background-gradient-direction: horizontal;
  72. background-gradient-start: rgba(255,255,255,0.5);
  73. background-gradient-end: rgba(255,255,255,0.6);
  74. border: 1px solid rgba(0,0,0,0.25);
  75. border-radius: 8px;
  76. }
  77.  
  78. StScrollBar StButton#hhandle:hover,
  79. StScrollBar StButton#vhandle:hover {
  80. background-gradient-direction: horizontal;
  81. background-gradient-start: rgba(255,255,255,0.8);
  82. background-gradient-end: rgba(255,255,255,0.9);
  83. }
  84.  
  85. StTooltip StLabel {
  86. border: 1px solid rgba(255,255,255,0.6);
  87. border-radius: 5px;
  88. padding: 2px 12px;
  89. background-color: rgba(0,0,0,0.9);
  90. color: #ffffff;
  91. font-size: 0.8em;
  92. font-weight: normal;
  93. text-align: center;
  94. }
  95.  
  96. /* PopupMenu */
  97.  
  98. .popup-menu-boxpointer {
  99. border: 2px solid rgba(255,255,255,0.4);
  100. background-gradient-direction: vertical;
  101. background-gradient-start: rgba(0,0,0,0.8);
  102. background-gradient-end: rgba(0,0,0,0.8);
  103. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.3);
  104. border-radius: 4px;
  105. }
  106.  
  107. .popup-menu {
  108. color: #fff;
  109. font-size: 9pt;
  110. min-width: 85px;
  111. }
  112.  
  113. .popup-submenu-menu-item:open {
  114. background-color: #4c4c4c;
  115. }
  116.  
  117. .popup-sub-menu { /* Don't use border-radius or box-shadow here. It causes the shell to crash. */
  118. background-gradient-start: rgba(0,0,0,0.0);
  119. background-gradient-end: rgba(0,0,0,0.0);
  120. background-gradient-direction: vertical;
  121. }
  122.  
  123. .popup-sub-menu .popup-menu-item:ltr {
  124. padding-right: 0em;
  125. }
  126.  
  127. .popup-sub-menu .popup-menu-item:rtl {
  128. padding-left: 0em;
  129. }
  130.  
  131. .popup-sub-menu StScrollBar {
  132. padding: 2px;
  133. }
  134.  
  135. .popup-sub-menu StScrollBar StBin#trough {
  136. border-width: 0px;
  137. }
  138.  
  139. .popup-sub-menu StScrollBar StBin#vhandle {
  140. background-color: #4c4c4c;
  141. border-width: 0px;
  142. }
  143.  
  144. .popup-combo-menu {
  145. background-color: rgba(0,0,0,0.9);
  146. padding: 1em 0em;
  147. color: #ffffff;
  148. font-size: 9pt;
  149. border: 1px solid #5f5f5f;
  150. border-radius: 4px;
  151. }
  152.  
  153. /* The remaining popup-menu sizing is all done in ems, so that if you
  154. * override .popup-menu.font-size, everything else will scale with it.
  155. */
  156. .popup-menu-content {
  157. padding: 1em 0em;
  158. }
  159.  
  160. .popup-menu-item {
  161. font-weight: normal;
  162. font-size: 9pt;
  163. padding: .4em 1.75em;
  164. spacing: 1em;
  165. color: #fff;
  166. }
  167.  
  168. .popup-menu-item:active {
  169. background-gradient-direction: vertical;
  170. background-gradient-start: rgba(162,184,202,0.9);
  171. background-gradient-end: rgba(117,145,169,0.9);
  172. color: #fff;
  173. }
  174.  
  175. .popup-menu-item:insensitive {
  176. color: #9f9f9f;
  177. }
  178.  
  179. .popup-image-menu-item {
  180. }
  181.  
  182. .popup-combobox-item {
  183. spacing: 1em;
  184. }
  185.  
  186. .popup-separator-menu-item {
  187. -gradient-height: 1px;
  188. -gradient-start: rgba(255,255,255,0.0);
  189. -gradient-end: rgba(255,255,255,0.12);
  190. -margin-horizontal: 1.5em;
  191. height: 1em;
  192. }
  193.  
  194. .popup-alternating-menu-item:alternate {
  195. font-weight: bold;
  196. }
  197.  
  198. .popup-slider-menu-item {
  199. height: 1em;
  200. min-width: 15em;
  201. -slider-height: 2px;
  202. -slider-background-color: #333333;
  203. -slider-border-color: #5f5f5f;
  204. -slider-active-background-color: rgb(117,145,169);
  205. -slider-active-border-color: rgb(162,184,202);
  206. -slider-border-width: 1px;
  207. -slider-handle-radius: 0.5em;
  208. }
  209.  
  210. .popup-device-menu-item {
  211. spacing: .5em;
  212. }
  213.  
  214. .popup-inactive-menu-item {
  215. font-weight: normal;
  216. color: #999;
  217. }
  218.  
  219. .popup-subtitle-menu-item {
  220. font-weight: bold;
  221. }
  222.  
  223. .popup-menu-icon {
  224. icon-size: 1.14em;
  225. }
  226.  
  227. /* Switches (to be used in menus) */
  228. .toggle-switch {
  229. width: 65px;
  230. height: 22px;
  231. }
  232.  
  233. .toggle-switch-us {
  234. background-image: url("off.png");
  235. }
  236. .toggle-switch-us:checked {
  237. background-image: url("on.png");
  238. }
  239.  
  240. .toggle-switch-intl {
  241. background-image: url("off.png");
  242. }
  243. .toggle-switch-intl:checked {
  244. background-image: url("on.png");
  245. }
  246.  
  247. .nm-menu-item-icons {
  248. spacing: .5em;
  249. }
  250.  
  251. /* Shared button properties */
  252.  
  253. .dash-search-button, .notification-button, .notification-icon-button,
  254. .hotplug-notification-item, .hotplug-resident-eject-button,
  255. .modal-dialog-button {
  256. color: white;
  257. border: 1px solid #8b8b8b;
  258. background-gradient-direction: vertical;
  259. background-gradient-start: rgba(255,255,255,0.2);
  260. background-gradient-end: rgba(255,255,255,0);
  261. }
  262.  
  263. .dash-search-button:hover, .notification-button:hover,
  264. .notification-icon-button:hover, .hotplug-notification-item:hover,
  265. .hotplug-resident-eject-button:hover, .modal-dialog-button:hover {
  266. background-gradient-start: rgba(255,255,255,0.3);
  267. background-gradient-end: rgba(255,255,255,0.1);
  268. }
  269.  
  270. .dash-search-button:selected, .notification-button:focus,
  271. .notification-icon-button:focus, .hotplug-notification-item:focus,
  272. .modal-dialog-button:focus {
  273. border: 2px solid #8b8b8b;
  274. }
  275.  
  276. .dash-search-button:active, .dash-search-button:pressed,
  277. .notification-button:active, .notification-icon-button:active,
  278. .hotplug-notification-item:active, .hotplug-resident-eject-button:active,
  279. .modal-dialog-button:active, .modal-dialog-button:pressed {
  280. background-gradient-start: rgba(255,255,255,0);
  281. background-gradient-end: rgba(255,255,255,0.2);
  282. }
  283.  
  284. /* Panel */
  285.  
  286. #panel {
  287. border: 1px solid rgba(255,255,255,0.2);
  288. border-top: 0px;
  289. border-left: 0px;
  290. border-right: 0px;
  291. border-radius: 0px;
  292. color: rgba(255,255,255,1.0);
  293. background-gradient-direction: vertical;
  294. background-gradient-start: rgba(100,100,100,0.1);
  295. background-gradient-end: rgba(0,0,0,0.4);
  296. height: 24px;
  297. font-size: 9pt;
  298. font-weight: bold;
  299. }
  300.  
  301. #panelLeft, #panelCenter {
  302. spacing: 4px;
  303. }
  304.  
  305. #panelLeft:ltr {
  306. padding-right: 4px;
  307. }
  308.  
  309. #panelLeft:rtl {
  310. padding-left: 4px;
  311. }
  312.  
  313. #panelRight:ltr {
  314. padding-left: 4px;
  315. }
  316.  
  317. #panelRight:rtl {
  318. padding-right: 4px;
  319. }
  320.  
  321. #appMenu {
  322. spacing: 0px;
  323. }
  324.  
  325. .panel-button #appMenuIcon {
  326. app-icon-bottom-clip: 1px;
  327. }
  328.  
  329. .panel-button:active #appMenuIcon,
  330. .panel-button:checked #appMenuIcon,
  331. .panel-button:focus #appMenuIcon {
  332. app-icon-bottom-clip: 2px;
  333. color: white;
  334. }
  335.  
  336. .app-menu-icon {
  337. width: 24px;
  338. height: 24px;
  339. }
  340.  
  341. .panel-button {
  342. -natural-hpadding: 12px;
  343. -minimum-hpadding: 6px;
  344. font-weight: bold;
  345. color: #fff;
  346. }
  347.  
  348. .panel-button:hover {
  349. color: white;
  350. background-gradient-direction: vertical;
  351. background-gradient-start: rgba(255,255,255,0.2);
  352. background-gradient-end: rgba(255,255,255,0.08);
  353. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.06);
  354. }
  355.  
  356. .panel-button:active,
  357. .panel-button:overview,
  358. .panel-button:focus {
  359. background-gradient-direction: vertical;
  360. background-gradient-start: rgba(255,255,255,0.3);
  361. background-gradient-end: rgba(255,255,255,0.18);
  362. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.1);
  363. color: white;
  364. }
  365.  
  366. .panel-status-button:active,
  367. .panel-status-button:checked,
  368. .panel-status-button:focus {
  369. background-gradient-direction: vertical;
  370. background-gradient-start: rgba(255,255,255,0.3);
  371. background-gradient-end: rgba(255,255,255,0.18);
  372. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.1);
  373. }
  374.  
  375. .panel-button:active > .system-status-icon,
  376. .panel-button:checked > .system-status-icon,
  377. .panel-button:focus > .system-status-icon {
  378. icon-shadow: black 0px 0px 3px;
  379. }
  380.  
  381. /* Replaces the activities text with a custom image. Height and width should use the same size as the image file. */
  382. #panelActivities {
  383. border: none;
  384. background-image: url("start1.png");
  385. background-position: 0 0;
  386. width: 58px;
  387. height: 24px;
  388. color: rgba(0,0,0,0.0);
  389. }
  390.  
  391. #panelActivities:hover {
  392. transition-duration: 300;
  393. background-image: url("start2.png");
  394. background-gradient-direction: vertical;
  395. background-gradient-start: rgba(140,200,255,0.0);
  396. background-gradient-end: rgba(61,149,231,0.0);
  397. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.0);
  398. }
  399. #panelActivities:active,
  400. #panelActivities:overview {
  401. background-image: url("start1.png");
  402. background-gradient-direction: vertical;
  403. background-gradient-start: rgba(140,200,255,0.0);
  404. background-gradient-end: rgba(61,149,231,0.0);
  405. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.0);
  406. }
  407.  
  408. .panel-menu {
  409. -boxpointer-gap: 4px
  410. }
  411.  
  412. #panelUserMenu {
  413. spacing: 4px;
  414. }
  415.  
  416. .status-chooser {
  417. spacing: .4em;
  418. }
  419.  
  420. .status-chooser .popup-menu-item,
  421. .status-chooser-combo .popup-menu-item {
  422. padding: .4em;
  423. }
  424.  
  425. .status-chooser-user-icon {
  426. border: 1px solid rgba(255,255,255,0.3);
  427. border-radius: 0px;
  428. width: 32pt;
  429. height: 32pt;
  430. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.2);
  431. }
  432.  
  433. .status-chooser-user-icon:hover {
  434. border: 1px solid rgba(255,255,255,0.5);
  435. }
  436.  
  437. .status-chooser-user-name {
  438. font-weight: bold;
  439. font-size: 9pt;
  440. min-width: 120pt;
  441. }
  442.  
  443. .status-chooser-combo {
  444. border: 1px solid transparent;
  445. }
  446.  
  447. .status-chooser-combo.popup-combo-menu {
  448. background-color: rgba(0,0,0,0.7);
  449. padding: .4em 0em;
  450. border-radius: 4px;
  451. border: 1px solid #5f5f5f;
  452. color: #ffffff;
  453. font-size: 9pt;
  454. }
  455.  
  456. .status-chooser-status-item,
  457. .status-chooser-combo .popup-combobox-item {
  458. spacing: .4em;
  459. }
  460.  
  461. .system-status-icon {
  462. icon-size: 1.14em;
  463. }
  464.  
  465. /* Overview */
  466.  
  467. #overview {
  468. spacing: 12px;
  469. background-color: rgba(0,0,0,0.4);
  470. }
  471.  
  472. .window-caption {
  473. color: white;
  474. spacing: 25px;
  475. }
  476.  
  477. .workspace-controls {
  478. visible-width: 6px; /* Amount visible before hovering */
  479. }
  480.  
  481. .workspace-thumbnails-background {
  482. background-color: rgba(0,0,0,0.0);
  483. border: 0px solid rgba(0,0,0,0.0);
  484. border-right: 0px;
  485. border-radius: 0px;
  486. padding: 8px;
  487. }
  488.  
  489. .workspace-thumbnails-background:rtl {
  490. border-right: 1px;
  491. border-left: 0px;
  492. border-radius: 0px;
  493. }
  494.  
  495. .workspace-thumbnails {
  496. spacing: 7px;
  497. }
  498.  
  499. .workspace-thumbnail-indicator {
  500. outline: 1px solid rgba(255,255,255,0.2);
  501. border: 1px solid rgba(255,255,255,0.5);
  502. }
  503.  
  504. .window-caption {
  505. background-color: rgba(0,0,0,0.0);
  506. border: 0px;
  507. border-radius: 0px;
  508. color: #fff;
  509. font-size: 9pt;
  510. padding: 2px 8px;
  511. -shell-caption-spacing: 4px;
  512. }
  513.  
  514. .window-close {
  515. background-image: url("close-window.svg");
  516. height: 34px;
  517. width: 34px;
  518. -shell-close-overlap: 20px;
  519. }
  520.  
  521. .window-close:rtl {
  522. -st-background-image-shadow: 2px 2px 6px rgba(0,0,0,0.5);
  523. }
  524.  
  525. /* Dash */
  526.  
  527. #dash {
  528. color: white;
  529. padding: 6px 0px;
  530. background-gradient-direction: horizontal;
  531. background-gradient-start: rgba(0,0,0,0.0);
  532. background-gradient-end: rgba(0,0,0,0.0);
  533. border: 0px;
  534. border-left: 0px;
  535. }
  536.  
  537. #dash:rtl {
  538. border-left: 1px;
  539. border-right: 0px;
  540. border-radius: 6px 0px 0px 6px;
  541. }
  542.  
  543. #dash:empty {
  544. height: 100px;
  545. width: 60px;
  546. }
  547.  
  548. .dash-placeholder {
  549. background-image: url("dash-placeholder.svg");
  550. }
  551.  
  552. #viewSelector {
  553. spacing: 1em;
  554. font-size: 9pt;
  555. }
  556.  
  557. #viewSelectorTabBar {
  558. padding: 1em;
  559. }
  560.  
  561. #searchArea {
  562. padding: 0px 24px;
  563. }
  564.  
  565. #searchEntry {
  566. padding: 4px 8px;
  567. border-radius: 2px;
  568. color: #2c2c2c;
  569. border: 1px solid rgba(255,255,255,0.8);
  570. background-gradient-direction: vertical;
  571. background-gradient-start: rgba(255,255,255,0.7);
  572. background-gradient-end: rgba(255,255,255,0.9);
  573. box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.5);
  574. selected-color: black;
  575. caret-color: rgb(128, 128, 128);
  576. caret-size: 1px;
  577. height: 16px;
  578. width: 250px;
  579. }
  580.  
  581. #searchEntry:focus,
  582. #searchEntry:hover {
  583. color: rgba(90,90,90,0.7);
  584. border: 1px solid rgba(255,255,255,0.8);
  585. background-gradient-direction: vertical;
  586. background-gradient-start: rgba(255,255,255,0.85);
  587. background-gradient-end: rgba(255,255,255,1.0);
  588. box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.5);
  589. }
  590.  
  591. #searchEntry:focus {
  592. color: #2c2c2c;
  593. border: 1px solid rgba(255,255,255,0.8);
  594. background-gradient-direction: vertical;
  595. background-gradient-start: rgba(255,255,255,0.85);
  596. background-gradient-end: rgba(255,255,255,1.0);
  597. box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.5);
  598. }
  599.  
  600. .search-entry-icon {
  601. icon-size: 1em;
  602. color: #222;
  603. }
  604.  
  605. .view-tab-title {
  606. color: rgba(255,255,255,0.7);
  607. font-size: 8pt;
  608. font-weight: bold;
  609. padding: 0px 12px;
  610. height: 24px;
  611. background-gradient-direction: vertical;
  612. background-gradient-start: rgba(255,255,255,0.0);
  613. background-gradient-end: rgba(255,255,255,0.0);
  614. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.0);
  615. border: 0px solid rgba(0,0,0,0.15);
  616. }
  617.  
  618. .view-tab-title:hover {
  619. color: rgba(189,210,228,1.0);
  620. }
  621.  
  622. .view-tab-title:selected {
  623. color: rgba(255,255,255,0.9);
  624. font-size: 8pt;
  625. font-weight: bold;
  626. height: 24px;
  627. padding: 0px 12px;
  628. background-gradient-direction: vertical;
  629. background-gradient-start: rgba(162,184,202,0.9);
  630. background-gradient-end: rgba(117,145,169,0.9);
  631. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.2);
  632. border: 1px solid rgba(0,0,0,0.15);
  633. border-radius: 3px;
  634. }
  635.  
  636. #searchResults {
  637. padding: 20px 10px 10px 10px;
  638. spacing: 18px;
  639. }
  640.  
  641. #searchResultsContent {
  642. padding-right: 20px;
  643. spacing: 36px;
  644. }
  645.  
  646. #searchResultsContent:rtl {
  647. padding-right: 0px;
  648. padding-left: 20px;
  649. }
  650.  
  651. .search-statustext,
  652. .search-section-header {
  653. padding: 4px 12px;
  654. spacing: 4px;
  655. color: #fff;
  656. font-size: 9pt;
  657. }
  658.  
  659. .search-section-results {
  660. color: #ffffff;
  661. padding: 6px;
  662. }
  663.  
  664. .search-section-list-results {
  665. spacing: 4px;
  666. }
  667.  
  668. .results-container {
  669. spacing: 4px;
  670. }
  671.  
  672. .search-providers-box {
  673. spacing: 12px;
  674. }
  675.  
  676. /* Text labels are an odd number of pixels tall. The uneven top and bottom
  677. * padding compensates for this and ensures that the label is vertically
  678. * centered */
  679. .dash-search-button {
  680. border: 1px solid rgba(255,255,255,0.09);
  681. background-gradient-direction: vertical;
  682. background-gradient-start: rgba(20,20,20,0.8);
  683. background-gradient-end: rgba(0,0,0,0.8);
  684. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.3);
  685. border-radius: 3px;
  686. padding-top: 4px;
  687. padding-bottom: 5px;
  688. width: 300px;
  689. font-weight: bold;
  690. }
  691.  
  692. .dash-search-button:selected,
  693. .dash-search-button:hover {
  694. border: 1px solid rgba(255,255,255,0.2);
  695. background-gradient-direction: vertical;
  696. background-gradient-start: rgba(30,30,30,0.8);
  697. background-gradient-end: rgba(10,10,10,0.8);
  698. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.3);
  699. border-radius: 3px;
  700. padding-top: 4px;
  701. padding-bottom: 5px;
  702. width: 300px;
  703. font-weight: bold;
  704. }
  705.  
  706. .dash-search-button-label {
  707. color: white;
  708. font-size: 9pt;
  709. }
  710.  
  711. /* Apps */
  712.  
  713. .icon-grid {
  714. spacing: 36px;
  715. -shell-grid-item-size: 118px; /* was 118px */
  716. }
  717.  
  718. .contact-grid {
  719. spacing: 36px;
  720. -shell-grid-item-size: 272px; /* 2 * -shell-grid-item-size + spacing */
  721. }
  722.  
  723. .icon-grid .overview-icon {
  724. icon-size: 80px;
  725. }
  726.  
  727. .all-app {
  728. padding: 16px 25px 16px 16px;
  729. spacing: 20px;
  730. }
  731.  
  732. .all-app:rtl {
  733. padding-right: 16px;
  734. padding-left: 25px;
  735. }
  736.  
  737. .app-filter {
  738. font-size: 9pt;
  739. font-weight: bold;
  740. height: 2.85em;
  741. color: white;
  742. width: 200px;
  743. padding-left: 8px;
  744. border: 1px solid rgba(0,0,0,0.0);
  745. }
  746.  
  747. .app-filter:hover {
  748. color: rgba(189,210,228,1.0);
  749. background-gradient-direction: vertical;
  750. background-gradient-start: rgba(255,255,255,0.12);
  751. background-gradient-end: rgba(255,255,255,0.05);
  752. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.15);
  753. border: 1px solid rgba(0,0,0,0.15);
  754. border-radius: 3px;
  755. }
  756.  
  757. .app-filter:selected {
  758. color: #ffffff;
  759. background-gradient-direction: vertical;
  760. background-gradient-start: rgba(162,184,202,0.9);
  761. background-gradient-end: rgba(117,145,169,0.9);
  762. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.3);
  763. border: 1px solid rgba(0,0,0,0.15);
  764. border-radius: 3px;
  765. }
  766.  
  767. .app-filter:selected:rtl {
  768. background-gradient-direction: vertical;
  769. background-gradient-start: rgba(162,184,202,0.9);
  770. background-gradient-end: rgba(117,145,169,0.9);
  771. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.3);
  772. border: 1px solid rgba(0,0,0,0.15);
  773. border-radius: 3px;
  774. }
  775.  
  776. .app-filter:focus {
  777. outline: 1px solid rgba(189,210,228,1.0);
  778. }
  779.  
  780. .dash-item-container > .app-well-app {
  781. padding: 4px 8px;
  782. }
  783.  
  784. .remove-favorite-icon {
  785. color: #a0a0a0;
  786. }
  787.  
  788. .remove-favorite-icon:hover {
  789. color: white;
  790. icon-shadow: black 0px 2px 2px;
  791. }
  792.  
  793. .app-well-app > .overview-icon,
  794. .remove-favorite > .overview-icon,
  795. .search-result-content > .overview-icon {
  796. border-radius: 4px;
  797. padding: 3px;
  798. border: 1px rgba(0,0,0,0);
  799. font-size: 9pt;
  800. color: white;
  801. text-align: center;
  802. }
  803.  
  804. .contact {
  805. width: 272px; /* Same width as two normal results + spacing */
  806. height: 118px; /* Aspect ratio = 1.75. Normal US business card ratio */
  807. border-radius: 3px;
  808. padding: 3px;
  809. border: 1px rgba(0,0,0,0);
  810. }
  811.  
  812. .contact-content {
  813. padding: 8px;
  814. width: 232px;
  815. height: 84px;
  816. color: white;
  817. text-align: center;
  818. border: 1px solid rgba(255,255,255,0.4);
  819. background-color: rgba(0,0,0,0.8);
  820. border-radius: 0px;
  821. }
  822.  
  823. .contact-icon {
  824. border-radius: 0px;
  825. }
  826.  
  827. .contact-details {
  828. padding: 6px 8px 11px 8px;
  829. }
  830.  
  831. .contact-details-alias {
  832. font-size: 9pt;
  833. padding-bottom: 11px;
  834. }
  835.  
  836. .contact-details-status {
  837. font-size: 9pt;
  838. }
  839.  
  840. .contact-details-status-icon {
  841. padding-right: 2px;
  842. }
  843.  
  844. .contact:hover {
  845. background-color: rgba(255,255,255,0.0);
  846. }
  847.  
  848. .app-well-app.running > .overview-icon {
  849. background-gradient-direction: vertical;
  850. background-gradient-start: rgba(162,184,202,0.9);
  851. background-gradient-end: rgba(117,145,169,0.9);
  852. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.3);
  853. border: 1px solid rgba(0,0,0,0.15);
  854. border-radius: 3px;
  855. padding: 3px;
  856. }
  857.  
  858. .app-well-app.running:hover > .overview-icon {
  859. background-gradient-direction: vertical;
  860. background-gradient-start: rgba(162,184,202,0.8);
  861. background-gradient-end: rgba(117,145,169,0.8);
  862. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.5);
  863. border: 1px solid rgba(0,0,0,0.15);
  864. border-radius: 3px;
  865. padding: 3px;
  866. }
  867.  
  868. .contact:selected,
  869. .app-well-app:selected > .overview-icon,
  870. .search-result-content:selected > .overview-icon {
  871. background-gradient-direction: vertical;
  872. background-gradient-start: rgba(162,184,202,0.9);
  873. background-gradient-end: rgba(117,145,169,0.9);
  874. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.3);
  875. border: 1px solid rgba(0,0,0,0.15);
  876. border-radius: 3px;
  877. padding: 3px;
  878. }
  879.  
  880. .contact:selected:hover,
  881. .app-well-app:selected:hover > .overview-icon,
  882. .search-result-content:selected:hover > .overview-icon {
  883. background-gradient-direction: vertical;
  884. background-gradient-start: rgba(162,184,202,0.8);
  885. background-gradient-end: rgba(117,145,169,0.8);
  886. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.5);
  887. border: 1px solid rgba(0,0,0,0.15);
  888. border-radius: 3px;
  889. padding: 3px;
  890. }
  891.  
  892. .app-well-app:hover > .overview-icon,
  893. .remove-favorite:hover > .overview-icon,
  894. .search-result-content:hover > .overview-icon {
  895. background-gradient-direction: vertical;
  896. background-gradient-start: rgba(255,255,255,0.12);
  897. background-gradient-end: rgba(255,255,255,0.05);
  898. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.15);
  899. border: 1px solid rgba(0,0,0,0.15);
  900. border-radius: 3px;
  901. padding: 3px;
  902. }
  903.  
  904. .contact:focus,
  905. .app-well-app:focus > .overview-icon,
  906. .search-result-content:focus > .overview-icon {
  907. border: 1px solid #cccccc;
  908. }
  909.  
  910. .app-well-menu {
  911. font-size: 9pt;
  912. }
  913.  
  914. /* LookingGlass */
  915.  
  916. #LookingGlassDialog {
  917. background-color: rgba(0,0,0,0.85);
  918. spacing: 4px;
  919. padding: 4px;
  920. border: 1px solid gray;
  921. border-radius: 0px;
  922. color: #fff;
  923. }
  924.  
  925. #LookingGlassDialog > #Toolbar {
  926. border: 1px solid grey;
  927. border-radius: 4px;
  928. }
  929.  
  930. #LookingGlassDialog .labels {
  931. spacing: 4px;
  932. }
  933.  
  934. #LookingGlassDialog .notebook-tab {
  935. padding: 2px;
  936. }
  937.  
  938. #LookingGlassDialog .notebook-tab:hover {
  939. color: #00ff00;
  940. }
  941.  
  942. #LookingGlassDialog .notebook-tab:selected {
  943. border: 1px solid #88ff66;
  944. border-radius: 4px;
  945. padding: 5px;
  946. }
  947.  
  948. #LookingGlassDialog .lg-inspector-title {
  949. font-weight: bold;
  950. padding-bottom: 8px;
  951. }
  952.  
  953. .lg-dialog StLabel {
  954. color: #88ff66;
  955. }
  956.  
  957. .lg-dialog StEntry {
  958. color: #88ff66;
  959. selection-background-color: #88ff66;
  960. selected-color: black;
  961. }
  962.  
  963. .lg-obj-inspector-title {
  964. spacing: 4px;
  965. }
  966.  
  967. .lg-obj-inspector-button {
  968. border: 1px solid #88ff66;
  969. padding: 4px;
  970. border-radius: 4px;
  971. }
  972.  
  973. .lg-obj-inspector-button:hover {
  974. border: 1px solid #00ff00;
  975. }
  976.  
  977. .lg-dialog .shell-link {
  978. color: #88ff66;
  979. }
  980.  
  981. .lg-dialog .shell-link:hover {
  982. color: #00ff00;
  983. }
  984.  
  985. #LookingGlassDialog StBoxLayout#EvalBox {
  986. padding: 4px;
  987. spacing: 4px;
  988. }
  989.  
  990. #LookingGlassDialog StBoxLayout#ResultsArea {
  991. spacing: 4px;
  992. }
  993.  
  994. #lookingGlassExtensions {
  995. padding: 4px;
  996. }
  997.  
  998. .lg-extension-list {
  999. padding: 4px;
  1000. spacing: 6px;
  1001. }
  1002.  
  1003. .lg-extension {
  1004. border: 1px solid #6f6f6f;
  1005. border-radius: 4px;
  1006. padding: 4px;
  1007. }
  1008.  
  1009. .lg-extension-name {
  1010. font-weight: bold;
  1011. }
  1012.  
  1013. .lg-extension-actions {
  1014. spacing: 6px;
  1015. }
  1016.  
  1017. #LookingGlassPropertyInspector {
  1018. background: rgba(0, 0, 0, 0.9);
  1019. border: 2px solid grey;
  1020. border-radius: 4px;
  1021. padding: 6px;
  1022. color: #88ff66;
  1023. }
  1024.  
  1025. /* Calendar popup */
  1026.  
  1027. #calendarEventsArea {
  1028. /* this is the width of the second column of the popup */
  1029. min-width: 200px;
  1030. }
  1031.  
  1032. .calendar-vertical-separator {
  1033. -stipple-width: 1px;
  1034. -stipple-color: rgba(255,255,255,0.2);
  1035. width: 0.3em;
  1036. }
  1037.  
  1038. #calendarPopup {
  1039. border: 2px solid rgba(255,255,255,0.4);
  1040. background-gradient-direction: vertical;
  1041. background-gradient-start: rgba(0,0,0,0.8);
  1042. background-gradient-end: rgba(0,0,0,0.8);
  1043. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.3);
  1044. color: white;
  1045. border-radius: 4px;
  1046. }
  1047.  
  1048. #calendarPopup .calendar {
  1049. padding: 10px;
  1050. }
  1051.  
  1052. .calendar {
  1053. padding: .4em 1.75em;
  1054. spacing-rows: 0px;
  1055. spacing-columns: 0px;
  1056. }
  1057.  
  1058. .calendar-month-label {
  1059. color: #e2e2e2;
  1060. font-size: 7.5pt;
  1061. padding-bottom: 8px;
  1062. padding-top: 8px;
  1063. font-weight: bold;
  1064. }
  1065.  
  1066. .calendar-change-month-back {
  1067. width: 18px;
  1068. height: 12px;
  1069. background-image: url("calendar-arrow-left.svg");
  1070. border-radius: 0px;
  1071. }
  1072.  
  1073. .calendar-change-month-back:rtl {
  1074. background-image: url("calendar-arrow-right.svg");
  1075. }
  1076.  
  1077. .calendar-change-month-back:hover {
  1078. background-color: rgba(255,255,255,0.1);
  1079. }
  1080. .calendar-change-month-back:active {
  1081. background-color: rgba(255,255,255,0.1);
  1082. }
  1083.  
  1084. .calendar-change-month-forward {
  1085. width: 18px;
  1086. height: 12px;
  1087. background-image: url("calendar-arrow-right.svg");
  1088. border-radius: 0px;
  1089. }
  1090.  
  1091. .calendar-change-month-forward:rtl {
  1092. background-image: url("calendar-arrow-left.svg");
  1093. }
  1094.  
  1095. .calendar-change-month-forward:hover {
  1096. background-color: rgba(255,255,255,0.1);
  1097. }
  1098. .calendar-change-month-forward:active {
  1099. background-color: rgba(255,255,255,0.1);
  1100. }
  1101.  
  1102. .datemenu-date-label {
  1103. padding: .4em 1.75em;
  1104. font-size: 9pt;
  1105. color: #e2e2e2;
  1106. font-weight: bold;
  1107. }
  1108.  
  1109. .calendar-day-base {
  1110. font-size: 7.5pt;
  1111. text-align: center;
  1112. width: 2.4em;
  1113. height: 2.4em;
  1114. }
  1115.  
  1116. .calendar-day-base:hover {
  1117. background-color: rgba(255,255,255,0.2);
  1118. color: #fff;
  1119. }
  1120.  
  1121. .calendar-day-base:active {
  1122. background-color: rgba(255,255,255,0.3);
  1123. }
  1124.  
  1125. .calendar-day-heading {
  1126. color: #e2e2e2;
  1127. padding-top: 1em;
  1128. }
  1129.  
  1130. .calendar-week-number {
  1131. color: #e2e2e2;
  1132. font-weight: bold;
  1133. }
  1134.  
  1135. /* Hack used in lieu of border-collapse - see calendar.js */
  1136. .calendar-day {
  1137. border: 1px solid #333;
  1138. color: #e2e2e2;
  1139. border-top-width: 0;
  1140. border-left-width: 0;
  1141. border-radius: 0px;
  1142. }
  1143. .calendar-day-top {
  1144. border-top-width: 1px;
  1145. }
  1146. .calendar-day-left {
  1147. border-left-width: 1px;
  1148. }
  1149.  
  1150. .calendar-work-day {
  1151. }
  1152.  
  1153. .calendar-nonwork-day {
  1154. background-color: rgba(128,128,128,.1);
  1155. }
  1156.  
  1157. .calendar-today {
  1158. background-color: #999;
  1159. color: #ffffff;
  1160. font-weight: bold;
  1161. }
  1162.  
  1163. .calendar-other-month-day {
  1164. color: #e2e2e2;
  1165. }
  1166.  
  1167. .calendar-day-with-events {
  1168. font-weight: bold;
  1169. color: #fff;
  1170. }
  1171.  
  1172. .events-header-vbox {
  1173. spacing: 6pt;
  1174. padding-right: 1.75em;
  1175. }
  1176.  
  1177. .events-header-vbox:rtl {
  1178. padding-right: 0em;
  1179. padding-left: 1.75em;
  1180. }
  1181.  
  1182. .events-header-hbox {
  1183. padding: 0.3em;
  1184. }
  1185.  
  1186. .events-day-header {
  1187. font-size: 9pt;
  1188. font-weight: bold;
  1189. color: #e2e2e2;
  1190. padding-left: 1.8em;
  1191. padding-top: 0.8em;
  1192. }
  1193.  
  1194. .events-day-header:rtl {
  1195. padding-left: 0em;
  1196. padding-right: 0.3em;
  1197. }
  1198.  
  1199. .events-day-dayname {
  1200. font-size: 9pt;
  1201. color: #e2e2e2;
  1202. text-align: left;
  1203. }
  1204.  
  1205. .events-day-dayname:rtl {
  1206. text-align: right;
  1207. }
  1208.  
  1209. .events-day-time {
  1210. font-size: 9pt;
  1211. color: #fff;
  1212. text-align: right;
  1213. }
  1214.  
  1215. .events-day-time:rtl {
  1216. text-align: left;
  1217. }
  1218.  
  1219. .events-day-task {
  1220. font-size: 9pt;
  1221. color: #e2e2e2;
  1222. }
  1223.  
  1224. .events-day-name-box {
  1225. min-width: 15pt;
  1226. }
  1227.  
  1228. .events-time-box {
  1229. min-width: 53pt;
  1230. padding-right: 6pt;
  1231. }
  1232.  
  1233. .events-time-box:rtl {
  1234. padding-right: 0px;
  1235. padding-left: 6pt;
  1236. }
  1237.  
  1238. .events-event-box {
  1239. }
  1240.  
  1241. .url-highlighter {
  1242. link-color: #ccccff;
  1243. }
  1244.  
  1245. /* Message Tray */
  1246. #message-tray {
  1247. background-gradient-direction: vertical;
  1248. background-gradient-start: rgba(0,0,0,0.1);
  1249. background-gradient-end: rgba(0,0,0,0.4);
  1250. border: 1px solid rgba(255,255,255,0.2);
  1251. border-radius: 0px;
  1252. border-bottom: 0px;
  1253. border-left: 0px;
  1254. border-right: 0px;
  1255. color: white;
  1256. height: 36px;
  1257. }
  1258.  
  1259. #notification {
  1260. border: 2px solid rgba(255,255,255,0.4);
  1261. background-gradient-direction: vertical;
  1262. background-gradient-start: rgba(0,0,0,0.8);
  1263. background-gradient-end: rgba(0,0,0,0.8);
  1264. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.3);
  1265. border-bottom: 0px;
  1266. font-size: 9pt;
  1267. border-radius: 4px 4px 0 0;
  1268. padding: 8px 8px 4px 8px;
  1269. spacing-rows: 10px;
  1270. spacing-columns: 10px;
  1271. width: 34em;
  1272. }
  1273.  
  1274. #notification.multi-line-notification {
  1275. padding-bottom: 8px;
  1276. }
  1277.  
  1278. /* We use row-span = 2 for the image cell, which prevents its height preferences to be
  1279. taken into account during allocation, so its height ends up being limited by the height
  1280. of the content in the other rows. To avoid showing a stretched image, we set the minimum
  1281. height of the table to be ICON_SIZE + IMAGE_SIZE + spacing-rows = 24 + 125 + 10 = 159 */
  1282. .notification-with-image {
  1283. min-height: 159px;
  1284. }
  1285.  
  1286. .summary-boxpointer {
  1287. border: 2px solid rgba(255,255,255,0.4);
  1288. background-gradient-direction: vertical;
  1289. background-gradient-start: rgba(0,0,0,0.8);
  1290. background-gradient-end: rgba(0,0,0,0.8);
  1291. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.3);
  1292. border-radius: 4px;
  1293. color: white;
  1294. }
  1295.  
  1296. .summary-boxpointer #notification {
  1297. border: 0px solid rgba(255,255,255,0.0);
  1298. border-radius: 4px;
  1299. border-bottom: 0px;
  1300. background: rgba(22,22,22,0.0) !important;
  1301. padding-bottom: 12px;
  1302. }
  1303.  
  1304. .summary-boxpointer #summary-right-click-menu {
  1305. font-size: 9pt;
  1306. padding-top: 12px;
  1307. padding-bottom: 12px;
  1308. }
  1309.  
  1310. #summary-notification-stack-scrollview {
  1311. max-height: 18em;
  1312. padding-top: 6px;
  1313. padding-bottom: 6px;
  1314. }
  1315.  
  1316. #summary-notification-stack-scrollview > .top-shadow, #summary-notification-stack-scrollview > .bottom-shadow {
  1317. height: 1em;
  1318. }
  1319.  
  1320. #summary-notification-stack-scrollview:ltr {
  1321. padding-right: 8px;
  1322. }
  1323.  
  1324. #summary-notification-stack-scrollview:rtl {
  1325. padding-left: 8px;
  1326. }
  1327.  
  1328. #notification-scrollview {
  1329. max-height: 10em;
  1330. }
  1331.  
  1332. #notification-scrollview > .top-shadow, #notification-scrollview > .bottom-shadow {
  1333. height: 1em;
  1334. }
  1335.  
  1336. #notification-scrollview:ltr > StScrollBar {
  1337. padding-left: 6px;
  1338. }
  1339.  
  1340. #notification-scrollview:rtl > StScrollBar {
  1341. padding-right: 6px;
  1342. }
  1343.  
  1344. #notification-body {
  1345. spacing: 5px;
  1346. }
  1347.  
  1348. #notification-actions {
  1349. spacing: 10px;
  1350. }
  1351.  
  1352. .notification-button {
  1353. border-radius: 2px;
  1354. font-size: 9pt;
  1355. padding: 2px 14px; /* 4px 42px 5px; */
  1356. }
  1357.  
  1358. .notification-button:focus {
  1359. padding: 3px 41px 4px;
  1360. }
  1361.  
  1362. .notification-icon-button {
  1363. border-radius: 2px;
  1364. padding: 5px;
  1365. }
  1366.  
  1367. .notification-icon-button:focus {
  1368. padding: 4px;
  1369. }
  1370.  
  1371. .notification-icon-button > StIcon {
  1372. icon-size: 16px;
  1373. }
  1374.  
  1375. .hotplug-transient-box {
  1376. spacing: 6px;
  1377. padding: 2px 72px 2px 12px;
  1378. }
  1379.  
  1380. .hotplug-notification-item {
  1381. padding: 2px 10px;
  1382. border-radius: 4px;
  1383. font-size: 9pt;
  1384. }
  1385.  
  1386. .hotplug-notification-item:focus {
  1387. padding: 1px 71px 1px 11px;
  1388. }
  1389.  
  1390. .hotplug-notification-item-icon {
  1391. icon-size: 24px;
  1392. padding: 2px 5px;
  1393. }
  1394.  
  1395. .hotplug-resident-box {
  1396. spacing: 8px;
  1397. }
  1398.  
  1399. .hotplug-resident-mount {
  1400. spacing: 8px;
  1401. border-radius: 4px;
  1402.  
  1403. color: #ccc;
  1404. }
  1405.  
  1406. .hotplug-resident-mount:hover {
  1407. background-gradient-direction: horizontal;
  1408. background-gradient-start: rgba(255,255,255,0.1);
  1409. background-gradient-end: rgba(255,255,255,0);
  1410.  
  1411. color: #fff;
  1412. }
  1413.  
  1414. .hotplug-resident-mount-label {
  1415. color: inherit;
  1416. padding-left: 6px;
  1417. }
  1418.  
  1419. .hotplug-resident-mount-icon {
  1420. icon-size: 24px;
  1421. padding-left: 6px;
  1422. }
  1423.  
  1424. .hotplug-resident-eject-icon {
  1425. icon-size: 16px;
  1426. }
  1427.  
  1428. .hotplug-resident-eject-button {
  1429. padding: 7px;
  1430. border-radius: 5px;
  1431. color: #ccc;
  1432. }
  1433.  
  1434. .chat-log-message {
  1435. color: #888888;
  1436. }
  1437.  
  1438. .chat-group-sent, .chat-group-meta {
  1439. padding: 8px 0;
  1440. }
  1441.  
  1442. .chat-sent {
  1443. padding-left: 4px;
  1444. border-radius: 4px;
  1445. }
  1446.  
  1447. .chat-received:rtl {
  1448. padding-left: 0px;
  1449. padding-right: 4px;
  1450. }
  1451.  
  1452. .chat-sent {
  1453. padding-left: 18pt;
  1454. border-radius: 4px;
  1455. color: #7E7E7E;
  1456. }
  1457.  
  1458. .chat-sent:rtl {
  1459. padding-left: 0px;
  1460. padding-right: 18pt;
  1461. }
  1462.  
  1463. .chat-meta-message {
  1464. padding-left: 4px;
  1465. border-radius: 4px;
  1466. font-size: 9pt;
  1467. color: #bbbbbb;
  1468. }
  1469.  
  1470. .chat-meta-message:rtl {
  1471. padding-left: 0px;
  1472. padding-right: 4px;
  1473. }
  1474.  
  1475. .subscription-message {
  1476. font-style: italic;
  1477. }
  1478.  
  1479. #notification StEntry {
  1480. padding: 4px;
  1481. selected-color: black;
  1482. color: white;
  1483. border: 1px solid rgba(0,0,0,0.6);
  1484. background-gradient-direction: vertical;
  1485. background-gradient-start: rgba(60,60,60,0.4);
  1486. background-gradient-end: rgba(90,90,90,0.6);
  1487. box-shadow: inset 0px -1px 1px 0px rgba(255,255,255,0.2);
  1488. border-radius: 3px;
  1489. caret-color: #a8a8a8;
  1490. caret-size: 1px;
  1491. }
  1492.  
  1493. #notification StEntry:focus {
  1494. color: white;
  1495. border: 1px solid rgba(0,0,0,0.6);
  1496. background-gradient-direction: vertical;
  1497. background-gradient-start: rgba(60,60,60,0.4);
  1498. background-gradient-end: rgba(90,90,90,0.6);
  1499. box-shadow: inset 0px -1px 1px 0px rgba(255,255,255,0.2);
  1500.  
  1501. caret-color: #545454;
  1502. selection-background-color: #808080;
  1503. }
  1504.  
  1505. /* The spacing and padding on the summary is tricky; we want to keep
  1506. * the icons from touching each other or the edges of the screen, but
  1507. * we also want them to be "Fitts"-y with respect to the edges, so the
  1508. * summary area's bottom and right padding must actually be part of
  1509. * the icons. However, we can't put *all* of the padding into the
  1510. * icons, because then the summary would be 0x0 when there were no
  1511. * icons in it, and so you wouldn't be able to hover over it to
  1512. * activate it.
  1513. *
  1514. * Also, the spacing between a summary-source's icon and title is
  1515. * actually specified as padding-left in source-title, because we
  1516. * want the spacing to collapse along with the title.
  1517. */
  1518. #summary-mode {
  1519. padding: 2px 0px 0px 4px;
  1520. height: 36px;
  1521. }
  1522.  
  1523. #summary-mode:rtl {
  1524. padding: 2px 4px 0px 0px;
  1525. }
  1526.  
  1527. .summary-source-button {
  1528. color: #fff;
  1529. }
  1530.  
  1531. .summary-source-button:ltr {
  1532. padding-right: 12px;
  1533. }
  1534.  
  1535. .summary-source-button:selected .summary-source {
  1536. background-gradient-direction: vertical;
  1537. background-gradient-start: rgba(255,255,255,0.2);
  1538. background-gradient-end: rgba(255,255,255,0.08);
  1539. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.06);
  1540. border-radius: 0px;
  1541. }
  1542.  
  1543. .summary-source-button:expanded:selected .summary-source {
  1544. background-image: none;
  1545. border-image: none;
  1546. }
  1547.  
  1548. .summary-source-button:expanded:selected {
  1549. background-color: none;
  1550. }
  1551.  
  1552. .summary-source-button:rtl {
  1553. padding-left: 12px;
  1554. }
  1555.  
  1556. .summary-source-button:last-child:ltr {
  1557. padding-right: 12px;
  1558. }
  1559.  
  1560. .summary-source-button:last-child:rtl {
  1561. padding-left: 12px;
  1562. }
  1563.  
  1564. .summary-source {
  1565. padding-right: 4px;
  1566. padding-left: 4px;
  1567. }
  1568.  
  1569. .summary-source-counter {
  1570. color: white;
  1571. background-color: #3465A4;
  1572. font-size: 9pt;
  1573. border-radius: 1em;
  1574. min-height: 1em;
  1575. min-width: 1em;
  1576. }
  1577.  
  1578. .source-title {
  1579. font-size: 9pt;
  1580. font-weight: bold;
  1581. padding-left: 4px;
  1582. }
  1583.  
  1584. .source-title:rtl {
  1585. padding-left: 0px;
  1586. padding-right: 4px;
  1587. }
  1588.  
  1589. /* App Switcher */
  1590. #altTabPopup {
  1591. padding: 8px;
  1592. spacing: 16px;
  1593. }
  1594.  
  1595. .switcher-list {
  1596. border: 2px solid rgba(255,255,255,0.4);
  1597. background-gradient-direction: vertical;
  1598. background-gradient-start: rgba(0,0,0,0.8);
  1599. background-gradient-end: rgba(0,0,0,0.8);
  1600. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.3);
  1601. border-radius: 4px;
  1602. padding: 20px;
  1603. font-size: 9pt;
  1604. color: rgba(255,255,255,1.0);
  1605. }
  1606.  
  1607. .switcher-list-item-container {
  1608. spacing: 8px;
  1609. }
  1610.  
  1611. .thumbnail-scroll-gradient-left {
  1612. background-gradient-direction: horizontal;
  1613. background-gradient-start: rgba(51, 51, 51, 1.0);
  1614. background-gradient-end: rgba(51, 51, 51, 0);
  1615. border-radius: 24px;
  1616. border-radius-topright: 0px;
  1617. border-radius-bottomright: 0px;
  1618. width: 60px;
  1619. }
  1620.  
  1621. .thumbnail-scroll-gradient-right {
  1622. background-gradient-direction: horizontal;
  1623. background-gradient-start: rgba(51, 51, 51, 0);
  1624. background-gradient-end: rgba(51, 51, 51, 1.0);
  1625. border-radius: 24px;
  1626. border-radius-topleft: 0px;
  1627. border-radius-bottomleft: 0px;
  1628. width: 60px;
  1629. }
  1630.  
  1631. .switcher-list .item-box {
  1632. padding: 8px;
  1633. border-radius: 8px;
  1634. }
  1635.  
  1636. .switcher-list .item-box:outlined {
  1637. background-gradient-direction: vertical;
  1638. background-gradient-start: rgba(162,184,202,0.9);
  1639. background-gradient-end: rgba(117,145,169,0.9);
  1640. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.3);
  1641. border-radius: 3px;
  1642. color: rgba(255,255,255,1.0);
  1643. padding: 6px;
  1644. }
  1645.  
  1646. .switcher-list .item-box:selected {
  1647. background-gradient-direction: vertical;
  1648. background-gradient-start: rgba(162,184,202,0.9);
  1649. background-gradient-end: rgba(117,145,169,0.9);
  1650. box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.3);
  1651. border-radius: 3px;
  1652. color: rgba(255,255,255,1.0);
  1653. }
  1654.  
  1655. .switcher-list .thumbnail-box {
  1656. padding: 2px;
  1657. spacing: 4px;
  1658. }
  1659.  
  1660. .switcher-list .thumbnail {
  1661. width: 256px;
  1662. }
  1663.  
  1664. .switcher-list .separator {
  1665. width: 1px;
  1666. background: rgba(255,255,255,0.33);
  1667. }
  1668.  
  1669. .ripple-box {
  1670. width: 52px;
  1671. height: 52px;
  1672. background-image: url("corner-ripple-ltr.png");
  1673. }
  1674.  
  1675. .ripple-box:rtl {
  1676. background-image: url("corner-ripple-rtl.png");
  1677. }
  1678.  
  1679. .switcher-arrow {
  1680. border-color: rgba(0,0,0,0);
  1681. color: #e2e2e2;
  1682. }
  1683.  
  1684. .switcher-arrow:highlighted {
  1685. border-color: rgba(0,0,0,0);
  1686. color: white;
  1687. }
  1688.  
  1689. /* Workspace Switcher */
  1690. .workspace-switcher-group {
  1691. padding: 12px;
  1692. }
  1693.  
  1694. .workspace-switcher-container {
  1695. border: 1px solid rgba(0,0,0,0.2);
  1696. background: rgba(214,214,214,1.0);
  1697. border-radius: 4px;
  1698. box-shadow: 0px 0px 6px 3px rgba(0,0,0,0.4);
  1699. padding: 20px;
  1700. }
  1701.  
  1702. .workspace-switcher {
  1703. background: transparent;
  1704. border: 0px;
  1705. border-radius: 0px;
  1706. padding: 0px;
  1707. spacing: 8px;
  1708. }
  1709.  
  1710. .ws-switcher-active-up {
  1711. height: 100px;
  1712. border: 0px;
  1713. background: rgba(255,255,255,0.5);
  1714. background-image: url("ws-switch-arrow-up.svg");
  1715. border-radius: 8px;
  1716. }
  1717.  
  1718. .ws-switcher-active-down {
  1719. height: 100px;
  1720. border: 0px;
  1721. background: rgba(255,255,255,0.5);
  1722. background-image: url("ws-switch-arrow-down.svg");
  1723. border-radius: 8px;
  1724. }
  1725.  
  1726. .ws-switcher-box {
  1727. height: 96px;
  1728. border: 2px solid rgba(85,85,85,0.5);
  1729. background: transparent;
  1730. border-radius: 8px;
  1731. }
  1732.  
  1733. /* Modal Dialogs */
  1734. .modal-dialog {
  1735. font-size: 9pt;
  1736. border-radius: 4px;
  1737. border: 2px solid rgba(255,255,255,0.4);
  1738. background-gradient-direction: vertical;
  1739. background-gradient-start: rgba(0,0,0,0.8);
  1740. background-gradient-end: rgba(0,0,0,0.8);
  1741. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.3);
  1742. color: #fff;
  1743.  
  1744. padding-right: 42px;
  1745. padding-left: 42px;
  1746. padding-bottom: 30px;
  1747. padding-top: 30px;
  1748. }
  1749.  
  1750. .modal-dialog-button-box {
  1751. spacing: 21px;
  1752. }
  1753.  
  1754. .modal-dialog-button {
  1755. border-radius: 2px;
  1756. font-size: 9pt;
  1757. color: #2c2c2c;
  1758.  
  1759. margin-left: 10px;
  1760. margin-right: 10px;
  1761. padding: 4px 32px 5px;
  1762. border: 0px solid rgba(255,255,255,0.0);
  1763. box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.5);
  1764. background-gradient-direction: vertical;
  1765. background-gradient-start: rgba(232,232,232,1.0);
  1766. background-gradient-end: rgba(212,212,212,1.0);
  1767. }
  1768.  
  1769. .modal-dialog-button:active,
  1770. .modal-dialog-button:pressed {
  1771. border: 0px solid rgba(255,255,255,0.0);
  1772. box-shadow: inset 0px 0px 2px 2px rgba(0,0,0,0.2);
  1773. background-gradient-direction: vertical;
  1774. background-gradient-start: rgba(180,180,180,1.0);
  1775. background-gradient-end: rgba(212,212,212,1.0);
  1776. }
  1777.  
  1778. .modal-dialog-button:active:hover,
  1779. .modal-dialog-button:pressed:hover {
  1780. border: 0px solid rgba(255,255,255,0.0);
  1781. box-shadow: inset 0px 0px 1px 2px rgba(0,0,0,0.2);
  1782. background-gradient-direction: vertical;
  1783. background-gradient-start: rgba(180,180,180,1.0);
  1784. background-gradient-end: rgba(212,212,212,1.0);
  1785. }
  1786.  
  1787. .modal-dialog-button:hover {
  1788. border: 0px solid rgba(255,255,255,0.0);
  1789. box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.5);
  1790. background-gradient-direction: vertical;
  1791. background-gradient-start: rgba(245,245,245,1.0);
  1792. background-gradient-end: rgba(232,232,232,1.0);
  1793. }
  1794.  
  1795. .modal-dialog-button:disabled {
  1796. color: rgb(60, 60, 60);
  1797. }
  1798.  
  1799. .modal-dialog-button:focus {
  1800. border: 0px solid rgba(255,255,255,0.0);
  1801. box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.5);
  1802. background-gradient-direction: vertical;
  1803. background-gradient-start: rgba(245,245,245,1.0);
  1804. background-gradient-end: rgba(232,232,232,1.0);
  1805. padding: 3px 31px 4px;
  1806. }
  1807.  
  1808. /* Run Dialog */
  1809. .run-dialog-label {
  1810. font-size: 9pt;
  1811. color: white;
  1812. padding-bottom: 6px;
  1813. }
  1814.  
  1815. .run-dialog-error-label {
  1816. font-size: 9pt;
  1817. color: white;
  1818. }
  1819.  
  1820. .run-dialog-error-box {
  1821. padding-top: 15px;
  1822. spacing: 5px;
  1823. }
  1824.  
  1825. .run-dialog-entry {
  1826. font-size: 9pt;
  1827. font-weight: normal;
  1828. width: 23em;
  1829. selection-background-color: white;
  1830. selected-color: #2c2c2c;
  1831. border-radius: 0px;
  1832. padding: 4px;
  1833. color: #2c2c2c;
  1834. border: 1px solid rgba(255,255,255,0.8);
  1835. background-gradient-direction: vertical;
  1836. background-gradient-start: rgba(255,255,255,0.7);
  1837. background-gradient-end: rgba(255,255,255,0.9);
  1838. box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.5);
  1839. }
  1840.  
  1841. .run-dialog {
  1842. border-radius: 4px;
  1843. border: 2px solid rgba(255,255,255,0.4);
  1844. background-gradient-direction: vertical;
  1845. background-gradient-start: rgba(0,0,0,0.8);
  1846. background-gradient-end: rgba(0,0,0,0.8);
  1847. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.3);
  1848.  
  1849. padding-right: 21px;
  1850. padding-left: 21px;
  1851. padding-bottom: 15px;
  1852. padding-top: 15px;
  1853. }
  1854.  
  1855. .lightbox {
  1856. background-color: rgba(160,160,160,0.0);
  1857. }
  1858.  
  1859. /* End Session Dialog */
  1860. .end-session-dialog {
  1861. spacing: 42px;
  1862. }
  1863.  
  1864. .end-session-dialog-subject {
  1865. font-size: 9pt;
  1866. font-weight: bold;
  1867. color: #fff;
  1868. padding-top: 10px;
  1869. padding-left: 17px;
  1870. padding-bottom: 30px;
  1871. }
  1872.  
  1873. .end-session-dialog-subject:rtl {
  1874. padding-left: 0px;
  1875. padding-right: 17px;
  1876. }
  1877.  
  1878. .end-session-dialog-description {
  1879. font-size: 9pt;
  1880. color: white;
  1881. padding-left: 17px;
  1882. width: 28em;
  1883. }
  1884.  
  1885. .end-session-dialog-description:rtl {
  1886. padding-right: 17px;
  1887. }
  1888.  
  1889. .end-session-dialog-logout-icon {
  1890. border: 2px solid #8b8b8b;
  1891. border-radius: 5px;
  1892. width: 32px;
  1893. height: 32px;
  1894. }
  1895.  
  1896. .end-session-dialog-shutdown-icon {
  1897. width: 32px;
  1898. height: 32px;
  1899. }
  1900.  
  1901. .end-session-dialog-app-list {
  1902. font-size: 9pt;
  1903. max-height: 200px;
  1904. padding-top: 42px;
  1905. padding-left: 49px;
  1906. padding-right: 32px;
  1907. }
  1908.  
  1909. .end-session-dialog-app-list:rtl {
  1910. padding-right: 49px;
  1911. padding-left: 32px;
  1912. }
  1913.  
  1914. .end-session-dialog-app-list-item {
  1915. color: #ccc;
  1916. }
  1917.  
  1918. .end-session-dialog-app-list-item:hover {
  1919. color: white;
  1920. }
  1921.  
  1922. .end-session-dialog-app-list-item:ltr {
  1923. padding-right: 1em;
  1924. }
  1925.  
  1926. .end-session-dialog-app-list-item:rtl {
  1927. padding-left: 1em;
  1928. }
  1929.  
  1930. .end-session-dialog-app-list-item-icon:ltr {
  1931. padding-right: 17px;
  1932. }
  1933.  
  1934. .end-session-dialog-app-list-item-icon:rtl {
  1935. padding-left: 17px;
  1936. }
  1937.  
  1938. .end-session-dialog-app-list-item-name {
  1939. font-size: 9pt;
  1940. }
  1941.  
  1942. .end-session-dialog-app-list-item-description {
  1943. font-size: 9pt;
  1944. color: #444444;
  1945. }
  1946.  
  1947. /* ShellMountOperation Dialogs */
  1948. .shell-mount-operation-icon {
  1949. icon-size: 48px;
  1950. }
  1951.  
  1952. .mount-password-reask {
  1953. color: red;
  1954. }
  1955.  
  1956. .show-processes-dialog,
  1957. .mount-question-dialog {
  1958. spacing: 24px;
  1959. }
  1960.  
  1961. .show-processes-dialog-subject,
  1962. .mount-question-dialog-subject {
  1963. font-size: 9pt;
  1964. font-weight: bold;
  1965. color: #666666;
  1966. padding-top: 10px;
  1967. padding-left: 17px;
  1968. padding-bottom: 6px;
  1969. }
  1970.  
  1971. .show-processes-dialog-subject:rtl,
  1972. .mount-question-dialog-subject:rtl {
  1973. padding-left: 0px;
  1974. padding-right: 17px;
  1975. }
  1976.  
  1977. .show-processes-dialog-description,
  1978. .mount-question-dialog-description {
  1979. font-size: 9pt;
  1980. color: white;
  1981. padding-left: 17px;
  1982. width: 28em;
  1983. }
  1984.  
  1985. .show-processes-dialog-description:rtl,
  1986. .mount-question-dialog-description:rtl {
  1987. padding-right: 17px;
  1988. }
  1989.  
  1990. .show-processes-dialog-app-list {
  1991. font-size: 9pt;
  1992. max-height: 200px;
  1993. padding-top: 24px;
  1994. padding-left: 49px;
  1995. padding-right: 32px;
  1996. }
  1997.  
  1998. .show-processes-dialog-app-list:rtl {
  1999. padding-right: 49px;
  2000. padding-left: 32px;
  2001. }
  2002.  
  2003. .show-processes-dialog-app-list-item {
  2004. color: #ccc;
  2005. }
  2006.  
  2007. .show-processes-dialog-app-list-item:hover {
  2008. color: white;
  2009. }
  2010.  
  2011. .show-processes-dialog-app-list-item:ltr {
  2012. padding-right: 1em;
  2013. }
  2014.  
  2015. .show-processes-dialog-app-list-item:rtl {
  2016. padding-left: 1em;
  2017. }
  2018.  
  2019. .show-processes-dialog-app-list-item-icon:ltr {
  2020. padding-right: 17px;
  2021. }
  2022.  
  2023. .show-processes-dialog-app-list-item-icon:rtl {
  2024. padding-left: 17px;
  2025. }
  2026.  
  2027. .show-processes-dialog-app-list-item-name {
  2028. font-size: 9pt;
  2029. }
  2030.  
  2031. /* PolicyKit Authentication Dialog */
  2032. .polkit-dialog {
  2033. /* this is the width of the entire modal popup */
  2034. width: 500px;
  2035. }
  2036.  
  2037. .polkit-dialog-main-layout {
  2038. spacing: 24px;
  2039. padding: 10px;
  2040. }
  2041.  
  2042. .polkit-dialog-message-layout {
  2043. spacing: 16px;
  2044. }
  2045.  
  2046. .polkit-dialog-headline {
  2047. font-size: 9pt;
  2048. font-weight: bold;
  2049. color: #666666;
  2050. }
  2051.  
  2052. .polkit-dialog-description {
  2053. font-size: 9pt;
  2054. color: white;
  2055. }
  2056.  
  2057. .polkit-dialog-user-layout {
  2058. padding-left: 10px;
  2059. spacing: 10px;
  2060. }
  2061.  
  2062. .polkit-dialog-user-layout:rtl {
  2063. padding-left: 0px;
  2064. padding-right: 10px;
  2065. }
  2066.  
  2067. .polkit-dialog-user-root-label {
  2068. color: #ff0000;
  2069. }
  2070.  
  2071. .polkit-dialog-password-label:ltr {
  2072. padding-right: 0.5em;
  2073. }
  2074.  
  2075. .polkit-dialog-password-label:rtl {
  2076. padding-left: 0.5em;
  2077. }
  2078.  
  2079. .polkit-dialog-password-entry {
  2080. background-gradient-start: rgb(236,236,236);
  2081. background-gradient-end: white;
  2082. background-gradient-direction: vertical;
  2083. color: black;
  2084. border-radius: 5px;
  2085. border: 2px solid #555753;
  2086. }
  2087.  
  2088. .polkit-dialog-password-entry:focus {
  2089. border: 2px solid #3465a4;
  2090. }
  2091.  
  2092. .polkit-dialog-error-label {
  2093. font-size: 9pt;
  2094. color: #ffff00;
  2095. padding-bottom: 8px;
  2096. }
  2097.  
  2098. .polkit-dialog-info-label {
  2099. font-size: 9pt;
  2100. padding-bottom: 8px;
  2101. }
  2102.  
  2103. /* intentionally left transparent to avoid dialog changing size */
  2104. .polkit-dialog-null-label {
  2105. font-size: 9pt;
  2106. color: rgba(0,0,0,0);
  2107. padding-bottom: 8px;
  2108. }
  2109.  
  2110. .network-dialog-show-password-checkbox {
  2111. padding-top: 5px;
  2112. padding-bottom: 5px;
  2113. font-size: 9pt;
  2114. color: white;
  2115. spacing: 10px;
  2116. }
  2117.  
  2118. .network-dialog-secret-table {
  2119. spacing-rows: 15px;
  2120. }
  2121.  
  2122. /* Magnifier */
  2123.  
  2124. .magnifier-zoom-region {
  2125. border: 2px solid rgba(128, 0, 0, 255);
  2126. }
  2127.  
  2128. .magnifier-zoom-region.full-screen {
  2129. border-width: 0px;
  2130. }
  2131.  
  2132. /* On-screen Keyboard */
  2133.  
  2134. #keyboard {
  2135. background: rgba(0,0,0,0.8);
  2136. }
  2137.  
  2138. .keyboard-layout {
  2139. spacing: 10px;
  2140. padding: 10px;
  2141. }
  2142.  
  2143. .keyboard-row {
  2144. spacing: 15px;
  2145. }
  2146.  
  2147. .keyboard-key {
  2148. min-height: 30px;
  2149. min-width: 30px;
  2150. background-gradient-start: rgba(255,245,245,0.4);
  2151. background-gradient-end: rgba(105,105,105,0.1);
  2152. background-gradient-direction: vertical;
  2153. font-size: 9pt;
  2154. font-weight: bold;
  2155. border-radius: 10px;
  2156. border: 2px solid #a0a0a0;
  2157. color: white;
  2158. }
  2159.  
  2160. .keyboard-key:grayed {
  2161. color: #808080;
  2162. border-color: #808080;
  2163. }
  2164.  
  2165. .keyboard-key:checked,
  2166. .keyboard-key:hover {
  2167. background: #303030;
  2168. border: 3px solid white;
  2169. }
  2170.  
  2171. .keyboard-key:active {
  2172. background: #808080;
  2173. }
  2174.  
  2175. .keyboard-subkeys {
  2176. color: white;
  2177. padding: 5px;
  2178. -arrow-border-radius: 10px;
  2179. -arrow-background-color: #090909;
  2180. -arrow-border-width: 2px;
  2181. -arrow-border-color: white;
  2182. -arrow-base: 20px;
  2183. -arrow-rise: 10px;
  2184. -boxpointer-gap: 5px;
  2185. }
RAW Paste Data