go-captcha-angular
Version:
GoCaptcha for Angular, which implements click mode, slider mode, drag-drop mode and rotation mode.
2 lines (1 loc) • 6.26 kB
CSS
:root{--go-captcha-theme-text-color: #333333;--go-captcha-theme-bg-color: #ffffff;--go-captcha-theme-btn-color: #ffffff;--go-captcha-theme-btn-disabled-color: #749ff9;--go-captcha-theme-btn-bg-color: #4e87ff;--go-captcha-theme-btn-border-color: #4e87ff;--go-captcha-theme-active-color: #3e7cff;--go-captcha-theme-border-color: rgba(206, 223, 254, 0.5);--go-captcha-theme-icon-color: #3C3C3C;--go-captcha-theme-drag-bar-color: #e0e0e0;--go-captcha-theme-drag-bg-color: #3e7cff;--go-captcha-theme-drag-icon-color: #ffffff;--go-captcha-theme-round-color: #e0e0e0;--go-captcha-theme-loading-icon-color: #3e7cff;--go-captcha-theme-body-bg-color: #34383e;--go-captcha-theme-dot-color: #cedffe;--go-captcha-theme-dot-bg-color: #3e7cff;--go-captcha-theme-dot-border-color: #f7f9fb;--go-captcha-theme-default-color: #3e7cff;--go-captcha-theme-default-bg-color: #ecf5ff;--go-captcha-theme-default-border-color: #3e7cff;--go-captcha-theme-default-hover-color: #e0efff;--go-captcha-theme-error-color: #ed4630;--go-captcha-theme-error-bg-color: #fef0f0;--go-captcha-theme-error-border-color: #ff5a34;--go-captcha-theme-warn-color: #ffa000;--go-captcha-theme-warn-bg-color: #fdf6ec;--go-captcha-theme-warn-border-color: #ffbe09;--go-captcha-theme-success-color: #5eaa2f;--go-captcha-theme-success-bg-color: #f0f9eb;--go-captcha-theme-success-border-color: #8bc640}.go-captcha.gc-wrapper{padding:12px 16px;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;box-sizing:border-box}.go-captcha.gc-theme{border:1px solid rgba(206,223,254,0.5);border-color:var(--go-captcha-theme-border-color);-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;box-shadow:0 0 20px rgba(100,100,100,0.1);-webkit-box-shadow:0 0 20px rgba(100,100,100,0.1);-moz-box-shadow:0 0 20px rgba(100,100,100,0.1)}.go-captcha.gc-theme.gc-wrapper{background-color:var(--go-captcha-theme-bg-color)}.go-captcha .gc-header{height:36px;width:100%;font-size:15px;color:var(--go-captcha-theme-text-color);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.go-captcha .gc-header span{flex:1;padding-right:5px}.go-captcha .gc-header em{padding:0 3px;font-weight:bold;color:var(--go-captcha-theme-active-color);font-style:normal}.go-captcha .gc-body{position:relative;width:100%;margin-top:10px;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;background:var(--go-captcha-theme-body-bg-color);border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;overflow:hidden}.go-captcha .gc-body .gc-body-inner{position:relative;background:var(--go-captcha-theme-body-bg-color)}.go-captcha .gc-picture{position:relative;z-index:2;width:100%}.go-captcha .gc-hide{visibility:hidden}.go-captcha .gc-loading{position:absolute;z-index:1;top:50%;left:50%;width:68px;height:68px;margin-left:-34px;margin-top:-34px;line-height:68px;text-align:center;display:flex;align-content:center;justify-content:center}.go-captcha .gc-loading svg,.go-captcha .gc-loading circle{color:var(--go-captcha-theme-loading-icon-color);fill:var(--go-captcha-theme-loading-icon-color)}.go-captcha .gc-footer{width:100%;height:50px;color:#34383e;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;align-items:center;padding-top:10px;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.go-captcha .gc-footer .icon-block{flex:1}.go-captcha .gc-icon-block{display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;align-items:center}.go-captcha .gc-icon-block>*{display:flex;align-items:center;justify-content:center}.go-captcha .gc-icon-block svg{color:var(--go-captcha-theme-icon-color);fill:var(--go-captcha-theme-icon-color);margin:0 5px;cursor:pointer}.go-captcha .gc-button-block{width:120px;height:40px}.go-captcha .gc-button-block button{width:100%;height:40px;text-align:center;padding:9px 15px;font-size:15px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;display:inline-block;line-height:1;white-space:nowrap;cursor:pointer;color:var(--go-captcha-theme-btn-color);background-color:var(--go-captcha-theme-btn-bg-color);border:1px solid transparent;border-color:var(--go-captcha-theme-btn-bg-color);-webkit-appearance:none;box-sizing:border-box;outline:none;margin:0;transition:.1s;font-weight:500;-moz-user-select:none;-webkit-user-select:none}.go-captcha .gc-button-block button.disabled{pointer-events:none;background-color:var(--go-captcha-theme-btn-disabled-color);border-color:var(--go-captcha-theme-btn-disabled-color)}.go-captcha .gc-drag-slide-bar{width:100%;height:100%;position:relative;touch-action:none}.go-captcha .gc-drag-line{position:absolute;height:14px;background-color:var(--go-captcha-theme-drag-bar-color);left:0;right:0;top:50%;margin-top:-7px;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px}.go-captcha .gc-drag-block{position:absolute;left:0;top:50%;margin-top:-20px;width:82px;height:40px;z-index:2;background-color:var(--go-captcha-theme-drag-bg-color);cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-border-radius:24px;-moz-border-radius:24px;border-radius:24px;box-shadow:0 0 20px rgba(100,100,100,0.35);-webkit-box-shadow:0 0 20px rgba(100,100,100,0.35);-moz-box-shadow:0 0 20px rgba(100,100,100,0.35);color:var(--go-captcha-theme-drag-icon-color);fill:var(--go-captcha-theme-drag-icon-color)}.go-captcha .gc-drag-block>*{display:flex;align-items:center;justify-content:center}.go-captcha .gc-drag-block.disabled{pointer-events:none;background-color:var(--go-captcha-theme-btn-disabled-color);border-color:var(--go-captcha-theme-btn-disabled-color)}.go-captcha .drag-block-inline{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.go-captcha .drag-block-inline>*{display:flex;align-items:center;justify-content:center}