github.com/fanux/shipyard@v0.0.0-20161009071005-6515ce223235/controller/static/semantic/src/definitions/modules/nag.less (about) 1 /*! 2 * # Semantic UI - Nag 3 * http://github.com/semantic-org/semantic-ui/ 4 * 5 * 6 * Copyright 2014 Contributors 7 * Released under the MIT license 8 * http://opensource.org/licenses/MIT 9 * 10 */ 11 12 13 /******************************* 14 Theme 15 *******************************/ 16 17 @type : 'module'; 18 @element : 'nag'; 19 20 @import (multiple) '../../theme.config'; 21 22 /******************************* 23 Nag 24 *******************************/ 25 26 .ui.nag { 27 display: none; 28 opacity: @opacity; 29 position: @position; 30 31 top: @top; 32 left: 0px; 33 z-index: @zIndex; 34 35 min-height: @minHeight; 36 width: @width; 37 38 margin: @margin; 39 padding: @padding; 40 41 background: @background; 42 box-shadow: @boxShadow; 43 44 font-size: @fontSize; 45 text-align: @textAlign; 46 color: @color; 47 48 border-radius: @topBorderRadius; 49 transition: @transition; 50 } 51 52 a.ui.nag { 53 cursor: pointer; 54 } 55 56 .ui.nag > .title { 57 display: inline-block; 58 margin: @titleMargin; 59 color: @titleColor; 60 } 61 62 63 .ui.nag > .close.icon { 64 cursor: pointer; 65 opacity: @closeOpacity; 66 67 position: absolute; 68 top: @closeTop; 69 right: @closeRight; 70 71 font-size: @closeSize; 72 73 margin: @closeMargin; 74 color: @closeColor; 75 transition: @closeTransition; 76 } 77 78 79 80 /******************************* 81 States 82 *******************************/ 83 84 /* Hover */ 85 .ui.nag:hover { 86 background: @nagHoverBackground; 87 opacity: @nagHoverOpacity; 88 } 89 90 .ui.nag .close:hover { 91 opacity: @closeHoverOpacity; 92 } 93 94 95 /******************************* 96 Variations 97 *******************************/ 98 99 100 /*-------------- 101 Static 102 ---------------*/ 103 104 .ui.overlay.nag { 105 position: absolute; 106 display: block; 107 } 108 109 /*-------------- 110 Fixed 111 ---------------*/ 112 113 .ui.fixed.nag { 114 position: fixed; 115 } 116 117 /*-------------- 118 Bottom 119 ---------------*/ 120 121 .ui.bottom.nags, 122 .ui.bottom.nag { 123 border-radius: @bottomBorderRadius; 124 top: auto; 125 bottom: @bottom; 126 } 127 128 /*-------------- 129 White 130 ---------------*/ 131 132 .ui.inverted.nags .nag, 133 .ui.inverted.nag { 134 background-color: @invertedBackground; 135 color: @darkTextColor; 136 } 137 .ui.inverted.nags .nag .close, 138 .ui.inverted.nags .nag .title, 139 .ui.inverted.nag .close, 140 .ui.inverted.nag .title { 141 color: @lightTextColor; 142 } 143 144 145 /******************************* 146 Groups 147 *******************************/ 148 149 .ui.nags .nag { 150 border-radius: @groupedBorderRadius !important; 151 } 152 .ui.nags .nag:last-child { 153 border-radius: @topBorderRadius; 154 } 155 .ui.bottom.nags .nag:last-child { 156 border-radius: @bottomBorderRadius; 157 } 158 159 .loadUIOverrides();