Advertisement
Guest User

Untitled

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