修改badge
This commit is contained in:
@@ -14,7 +14,7 @@ class YuthonBase(http.Controller):
|
||||
self.jinja_env = Environment(loader=FileSystemLoader(template_path),
|
||||
autoescape=True)
|
||||
# http://82.156.218.102/webh5#/notice?id=64
|
||||
@http.route('/webh5', type='http', auth='public', methods=['GET'], csrf=False)
|
||||
@http.route('/webh5', type='http', auth='none', methods=['GET'], csrf=False)
|
||||
def index(self):
|
||||
t = self.jinja_env.get_template('webh5/index.html')
|
||||
return Response(t.render(), mimetype='text/html')
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -1 +0,0 @@
|
||||
import{_ as e}from"./index-BVX99fD-.js";const r={};function c(n,t){return null}const o=e(r,[["render",c]]);export{o as default};
|
||||
@@ -1 +0,0 @@
|
||||
import{B as _,E as i,C as d,D as v}from"./requests-hL36VCQn.js";import{_ as p,r as h,o as m,u as y,h as f,i as l,g as a,t,k,l as g}from"./index-BVX99fD-.js";const w=r=>_("/yuthon/yuthon/will/task",{id:r}),x={class:"container"},B={class:"meeting-header"},C={class:"title"},q={class:"time"},D={class:"location"},E={__name:"Journey",setup(r){const u=y(),e=h({});return m(async()=>{try{const s=parseInt(u.query.id),n=await w(s);e.value=n.data}catch(s){i("获取任务详情失败"),console.error(s)}}),(s,n)=>{const o=v,c=d;return g(),f("div",x,[l("div",B,[l("div",C,t(e.value.name),1),l("div",q,t(e.value.start_date)+" "+t(e.value.start_date_week)+" "+t(e.value.request_hour_from)+" - "+t(e.value.request_hour_to),1),l("div",D,"地址: "+t(e.value.address),1)]),a(c,null,{default:k(()=>[a(o,{title:"组织人",value:e.value.user_id},null,8,["value"]),a(o,{title:"参与人",value:"共"+(e.value.employee_ids?.length||0)+"人"},null,8,["value"]),a(o,{title:"描述",value:e.value.remarks},null,8,["value"]),a(o,{title:"任务编号",value:e.value.code},null,8,["value"])]),_:1})])}}},N=p(E,[["__scopeId","data-v-0aa7162a"]]);export{N as default};
|
||||
File diff suppressed because one or more lines are too long
@@ -1 +0,0 @@
|
||||
import{v as B,t as A,c as p,H as E,I as V,j as w,n as b,F as y,B as q,E as H,C as O,D as j}from"./requests-hL36VCQn.js";import{d as x,g as a,T as G,F as I,s as K,_ as M,r as R,o as J,u as Q,h as S,i as f,t as k,k as P,l as C,p as U,q as W}from"./index-BVX99fD-.js";import{I as X}from"./index-Bo6F90vT.js";const[Y,T]=p("tag"),Z={size:String,mark:Boolean,show:A,type:B("default"),color:String,plain:Boolean,round:Boolean,textColor:String,closeable:Boolean};var ee=x({name:Y,props:Z,emits:["close"],setup(t,{slots:e,emit:u}){const l=o=>{o.stopPropagation(),u("close",o)},r=()=>t.plain?{color:t.textColor||t.color,borderColor:t.color}:{color:t.textColor,background:t.color},d=()=>{var o;const{type:m,mark:i,plain:c,round:v,size:s,closeable:_}=t,g={mark:i,plain:c,round:v};s&&(g[s]=s);const h=_&&a(V,{name:"cross",class:[T("close"),E],onClick:l},null);return a("span",{style:r(),class:T([g,m])},[(o=e.default)==null?void 0:o.call(e),h])};return()=>a(G,{name:t.closeable?"van-fade":void 0},{default:()=>[t.show?d():null]})}});const te=w(ee),[ae,n]=p("card"),ne={tag:String,num:b,desc:String,thumb:String,title:String,price:b,centered:Boolean,lazyLoad:Boolean,currency:B("¥"),thumbLink:String,originPrice:b};var re=x({name:ae,props:ne,emits:["clickThumb"],setup(t,{slots:e,emit:u}){const l=()=>{if(e.title)return e.title();if(t.title)return a("div",{class:[n("title"),"van-multi-ellipsis--l2"]},[t.title])},r=()=>{if(e.tag||t.tag)return a("div",{class:n("tag")},[e.tag?e.tag():a(te,{mark:!0,type:"primary"},{default:()=>[t.tag]})])},d=()=>e.thumb?e.thumb():a(X,{src:t.thumb,fit:"cover",width:"100%",height:"100%",lazyLoad:t.lazyLoad},null),o=()=>{if(e.thumb||t.thumb)return a("a",{href:t.thumbLink,class:n("thumb"),onClick:c=>u("clickThumb",c)},[d(),r()])},m=()=>{if(e.desc)return e.desc();if(t.desc)return a("div",{class:[n("desc"),"van-ellipsis"]},[t.desc])},i=()=>{const c=t.price.toString().split(".");return a("div",null,[a("span",{class:n("price-currency")},[t.currency]),a("span",{class:n("price-integer")},[c[0]]),c.length>1&&a(I,null,[K("."),a("span",{class:n("price-decimal")},[c[1]])])])};return()=>{var c,v,s;const _=e.num||y(t.num),g=e.price||y(t.price),h=e["origin-price"]||y(t.originPrice),D=_||g||h||e.bottom,F=g&&a("div",{class:n("price")},[e.price?e.price():i()]),L=h&&a("div",{class:n("origin-price")},[e["origin-price"]?e["origin-price"]():`${t.currency} ${t.originPrice}`]),N=_&&a("div",{class:n("num")},[e.num?e.num():`x${t.num}`]),$=e.footer&&a("div",{class:n("footer")},[e.footer()]),z=D&&a("div",{class:n("bottom")},[(c=e["price-top"])==null?void 0:c.call(e),F,L,N,(v=e.bottom)==null?void 0:v.call(e)]);return a("div",{class:n()},[a("div",{class:n("header")},[o(),a("div",{class:n("content",{centered:t.centered})},[a("div",null,[l(),m(),(s=e.tags)==null?void 0:s.call(e)]),z])]),$])}}});const ce=w(re),oe=t=>q("/yuthon/yuthon/salary",{id:t}),ie={class:"container"},le={class:"header"},se={class:"salary-amount"},ue={class:"detail-section"},de={__name:"Salary",setup(t){const e=R({}),u=Q();return J(async()=>{const l=parseInt(u.query.id);try{const r=await oe(l);console.log(r),e.value=r.data}catch(r){H("获取工资条失败"),console.error(r)}}),(l,r)=>{const d=ce,o=j,m=O;return C(),S("div",ie,[f("div",le,k(e.value.date_from)+" - "+k(e.value.date_to)+" 工资条 ",1),a(d,{class:"salary-card",title:"实发工资",bordered:""},{desc:P(()=>[f("div",se,k(e.value.amount_total),1)]),_:1}),f("div",ue,[r[0]||(r[0]=f("div",{class:"section-title"},"明细",-1)),a(m,null,{default:P(()=>[(C(!0),S(I,null,U(e.value.lines_ids,i=>(C(),W(o,{key:i.name,title:i.name,value:i.total},null,8,["title","value"]))),128))]),_:1})])])}}},_e=M(de,[["__scopeId","data-v-4564b9eb"]]);export{_e as default};
|
||||
File diff suppressed because one or more lines are too long
@@ -1 +0,0 @@
|
||||
import{v as P,t as S,n as d,c as B,G as u,F as $,J as j,I as D,j as _}from"./requests-hL36VCQn.js";import{d as C,r as f,v as F,c as N,w as R,f as U,o as G,n as z,g as n,x as J,y as M,m as b}from"./index-BVX99fD-.js";const[O,i]=B("image"),T={src:String,alt:String,fit:String,position:String,round:Boolean,block:Boolean,width:d,height:d,radius:d,lazyLoad:Boolean,iconSize:d,showError:S,errorIcon:P("photo-fail"),iconPrefix:String,showLoading:S,loadingIcon:P("photo"),crossorigin:String,referrerpolicy:String,decoding:String};var V=C({name:O,props:T,emits:["load","error"],setup(r,{emit:g,slots:c}){const t=f(!1),a=f(!0),o=f(),{$Lazyload:l}=F().proxy,x=N(()=>{const e={width:u(r.width),height:u(r.height)};return $(r.radius)&&(e.overflow="hidden",e.borderRadius=u(r.radius)),e});R(()=>r.src,()=>{t.value=!1,a.value=!0});const v=e=>{a.value&&(a.value=!1,g("load",e))},m=()=>{const e=new Event("load");Object.defineProperty(e,"target",{value:o.value,enumerable:!0}),v(e)},h=e=>{t.value=!0,a.value=!1,g("error",e)},y=(e,s,I)=>I?I():n(D,{name:e,size:r.iconSize,class:s,classPrefix:r.iconPrefix},null),E=()=>{if(a.value&&r.showLoading)return n("div",{class:i("loading")},[y(r.loadingIcon,i("loading-icon"),c.loading)]);if(t.value&&r.showError)return n("div",{class:i("error")},[y(r.errorIcon,i("error-icon"),c.error)])},k=()=>{if(t.value||!r.src)return;const e={alt:r.alt,class:i("img"),decoding:r.decoding,style:{objectFit:r.fit,objectPosition:r.position},crossorigin:r.crossorigin,referrerpolicy:r.referrerpolicy};return r.lazyLoad?J(n("img",b({ref:o},e),null),[[M("lazy"),r.src]]):n("img",b({ref:o,src:r.src,onLoad:v,onError:h},e),null)},w=({el:e})=>{const s=()=>{e===o.value&&a.value&&m()};o.value?s():z(s)},L=({el:e})=>{e===o.value&&!t.value&&h()};return l&&j&&(l.$on("loaded",w),l.$on("error",L),U(()=>{l.$off("loaded",w),l.$off("error",L)})),G(()=>{z(()=>{var e;(e=o.value)!=null&&e.complete&&!r.lazyLoad&&m()})}),()=>{var e;return n("div",{class:i({round:r.round,block:r.block}),style:x.value},[k(),E(),(e=c.default)==null?void 0:e.call(c)])}}});const H=_(V);export{H as I};
|
||||
File diff suppressed because one or more lines are too long
@@ -2,10 +2,10 @@
|
||||
<html lang="">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<link rel="icon" href="/yuthon_base/static/webh5/favicon.ico">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Vite App</title>
|
||||
<script type="module" crossorigin src="/assets/index-BVX99fD-.js"></script>
|
||||
<script type="module" crossorigin src="/yuthon_base/static/webh5/assets/index-CimcMLIq.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
'security/ir.model.access.csv',
|
||||
'views/yuthon_property_report_views.xml',
|
||||
'views/menu.xml',
|
||||
'wizard/yuthon_property_report_wizard.xml',
|
||||
'wizard/yuthon_property_report_wizard.xml'
|
||||
],
|
||||
'assets': {
|
||||
'web.assets_backend': [
|
||||
|
||||
@@ -1,2 +1,3 @@
|
||||
# -*- coding: utf-8 -*-
|
||||
from . import yuthon_property_report
|
||||
from . import yuthon_property_report
|
||||
from . import res_partner
|
||||
@@ -0,0 +1,16 @@
|
||||
from odoo import fields, models, api
|
||||
|
||||
|
||||
class ResPartner(models.Model):
|
||||
_inherit = 'res.partner'
|
||||
|
||||
@api.model
|
||||
def get_report_data(self, params):
|
||||
domain = []
|
||||
if params.get("keyword"):
|
||||
domain.append(("name", "ilike", params["keyword"]))
|
||||
partners = self.search(domain, limit=100)
|
||||
return [
|
||||
{"customer": p.name, "amount": p.credit}
|
||||
for p in partners
|
||||
]
|
||||
@@ -0,0 +1,35 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<odoo>
|
||||
<data>
|
||||
|
||||
<record id="action_youthon_report" model="ir.actions.client">
|
||||
<field name="name">Youthon 报表</field>
|
||||
<field name="tag">youthon_report_client</field>
|
||||
<field name="context">
|
||||
{
|
||||
"report_config": {
|
||||
"model": "res.partner",
|
||||
"method": "get_report_data",
|
||||
"search_fields": [
|
||||
{"name": "date_start", "type": "date", "label": "开始日期"},
|
||||
{"name": "date_end", "type": "date", "label": "结束日期"},
|
||||
{"name": "keyword", "type": "char", "label": "关键字"}
|
||||
],
|
||||
"columns": [
|
||||
{"headerName": "客户", "field": "customer", "flex": 1},
|
||||
{"headerName": "销售额", "field": "amount", "flex": 1}
|
||||
]
|
||||
}
|
||||
}
|
||||
</field>
|
||||
</record>
|
||||
|
||||
<menuitem id="menu_youthon_report"
|
||||
name="Youthon 报表"
|
||||
parent="yuthon_property_science_menu"
|
||||
action="action_youthon_report"
|
||||
sequence="160"
|
||||
/>
|
||||
|
||||
</data>
|
||||
</odoo>
|
||||
@@ -0,0 +1 @@
|
||||
|
||||
@@ -0,0 +1,32 @@
|
||||
# -*- coding: utf-8 -*-
|
||||
{
|
||||
'name': "Yuthon Report",
|
||||
'summary': "",
|
||||
'description': """报表 """,
|
||||
'category': 'zhou',
|
||||
'version': '0.1',
|
||||
'license': 'LGPL-3',
|
||||
'depends': ['base', 'web'],
|
||||
'data': [
|
||||
|
||||
],
|
||||
'installable': True,
|
||||
'application': True,
|
||||
'assets': {
|
||||
'web.assets_backend': [
|
||||
# 样式
|
||||
'yuthon_report/static/src/lib/ag-grid-c/styles/ag-grid.css',
|
||||
'yuthon_report/static/src/lib/ag-grid-c/styles/ag-theme-alpine.css',
|
||||
|
||||
# 先引入 community
|
||||
'yuthon_report/static/src/lib/ag-grid-c/dist/ag-grid-community.noStyle.js',
|
||||
# 再引入 enterprise
|
||||
'yuthon_report/static/src/lib/ag-grid-e/dist/ag-grid-enterprise.js',
|
||||
|
||||
'yuthon_report/static/src/components/yuthon_report/yuthon_report.js',
|
||||
'yuthon_report/static/src/components/yuthon_report/yuthon_report.xml',
|
||||
'yuthon_report/static/src/components/yuthon_report/yuthon_report.scss',
|
||||
],
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,51 @@
|
||||
/** @odoo-module **/
|
||||
|
||||
|
||||
import { registry } from "@web/core/registry";
|
||||
import { Component, onMounted, useRef, useState } from "@odoo/owl";
|
||||
|
||||
class YouthonReport extends Component {
|
||||
setup() {
|
||||
this.gridRef = useRef("grid");
|
||||
this.dateRangeRef = useRef("date_range_picker");
|
||||
this.keywordRef = useRef("keyword_input");
|
||||
|
||||
this.state = useState({
|
||||
startDate: null,
|
||||
endDate: null,
|
||||
keyword: "",
|
||||
});
|
||||
|
||||
this.config = this.props.config || {};
|
||||
|
||||
onMounted(async () => {
|
||||
// 加载 ag-grid
|
||||
//await loadJS("https://cdn.jsdelivr.net/npm/ag-grid-community/dist/ag-grid-community.min.js");
|
||||
this.gridOptions = {
|
||||
columnDefs: this.config.columns || [],
|
||||
rowData: [],
|
||||
defaultColDef: { resizable: true, sortable: true, filter: true },
|
||||
};
|
||||
this.grid = new agGrid.Grid(this.gridRef.el, this.gridOptions);
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
async onSearch() {
|
||||
const params = {
|
||||
date_start: this.state.startDate,
|
||||
date_end: this.state.endDate,
|
||||
keyword: this.state.keyword,
|
||||
};
|
||||
|
||||
const result = await this.env.services.orm.call(
|
||||
this.config.model,
|
||||
this.config.method,
|
||||
[params]
|
||||
);
|
||||
this.gridOptions.api.setRowData(result);
|
||||
}
|
||||
}
|
||||
|
||||
YouthonReport.template = "youthon_report.YouthonReport";
|
||||
registry.category("actions").add("youthon_report_client", YouthonReport);
|
||||
@@ -0,0 +1,30 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<templates id="template" xml:space="preserve">
|
||||
<t t-name="youthon_report.YouthonReport">
|
||||
<div class="container-fluid d-flex flex-column h-100">
|
||||
|
||||
<!-- 搜索区域 -->
|
||||
<div class="row mb-2" t-ref="search_area">
|
||||
<div class="col-auto">
|
||||
<label>日期范围</label>
|
||||
<div t-ref="date_range_picker"></div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<label>关键字</label>
|
||||
<div t-ref="keyword_input"></div>
|
||||
</div>
|
||||
<div class="col-auto align-self-end">
|
||||
<button class="btn btn-primary" t-on-click="onSearch">搜索</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ag-grid 区域 -->
|
||||
<div class="row flex-grow-1">
|
||||
<div class="col-12 h-100">
|
||||
<div class="ag-theme-alpine w-100 h-100" t-ref="grid"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</t>
|
||||
</templates>
|
||||
@@ -0,0 +1,21 @@
|
||||
The MIT License
|
||||
|
||||
Copyright (c) 2015-2025 AG GRID LTD
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
@@ -0,0 +1,508 @@
|
||||
# JavaScript Data Grid | JavaScript Table
|
||||
|
||||
<div align="center">
|
||||
<a href="https://www.ag-grid.com?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">
|
||||
<picture>
|
||||
<source media="(prefers-color-scheme: dark)" srcset="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/ag-logos/svg-logos/AG-Grid-Logo_Dark-Theme.svg?raw=true"/>
|
||||
<source media="(prefers-color-scheme: light)" srcset="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/ag-logos/svg-logos/AG-Grid-Logo_Light-Theme.svg?raw=true"/>
|
||||
<img width="100%" alt="AG Grid Logo" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/ag-logos/svg-logos/AG-Grid-Logo_Light-Theme.svg?raw=true"/>
|
||||
</picture>
|
||||
</a>
|
||||
<div align="center">
|
||||
<h4><a href="https://www.ag-grid.com?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">🌐 Website</a> • <a href="https://www.ag-grid.com/javascript-data-grid/getting-started/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">📖 Documentation</a> • <a href="https://www.ag-grid.com/community?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">🏘️ Community</a></h4>
|
||||
</div>
|
||||
<br>
|
||||
<a href="https://github.com/ag-grid/ag-grid/releases">
|
||||
<img src="https://img.shields.io/github/v/release/ag-grid/ag-grid?style=for-the-badge" alt="GitHub Release">
|
||||
</a>
|
||||
<a href="https://www.npmjs.com/package/ag-grid-community">
|
||||
<img src="https://img.shields.io/npm/dm/ag-grid-community?style=for-the-badge" alt="NPM Downloads">
|
||||
</a>
|
||||
<a href="https://github.com/ag-grid/ag-grid">
|
||||
<img src="https://img.shields.io/github/stars/ag-grid/ag-grid?style=for-the-badge" alt="GitHub Repo stars">
|
||||
</a>
|
||||
<a href="https://github.com/ag-grid/ag-grid">
|
||||
<img alt="GitHub forks" src="https://img.shields.io/github/forks/ag-grid/ag-grid?style=for-the-badge">
|
||||
</a>
|
||||
<br><br>
|
||||
<a href="https://sonarcloud.io/dashboard?id=ag-grid-community">
|
||||
<img src="https://sonarcloud.io/api/project_badges/measure?project=ag-grid-community&metric=alert_status" alt="Quality Gate Status">
|
||||
</a>
|
||||
<a href="https://npm.io/package/ag-grid-community">
|
||||
<img src="https://img.shields.io/npms-io/maintenance-score/ag-grid-community" alt="npms.io Maintenance Score">
|
||||
</a>
|
||||
<a href="https://github.com/ag-grid/ag-grid/graphs/commit-activity">
|
||||
<img src="https://img.shields.io/github/commit-activity/m/ag-grid/ag-grid" alt="GitHub commit activity">
|
||||
</a>
|
||||
<a href="https://github.com/ag-grid/ag-grid/network/dependents">
|
||||
<img src="https://img.shields.io/librariesio/dependents/npm/ag-grid-community" alt="Dependents">
|
||||
</a>
|
||||
<br><br>
|
||||
<!-- START MAIN DESCRIPTION -->
|
||||
<p>AG Grid is a <strong>fully-featured</strong> and <strong>highly customizable</strong> JavaScript Data Grid. It delivers <strong>outstanding performance</strong>, has <strong>no third-party dependencies</strong> and comes with support for <strong><a href="https://github.com/ag-grid/ag-grid/tree/latest/packages/ag-grid-react"><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/react.svg?raw=true" height="16" width="16" alt="React Logo"> React</a></strong>, <strong><a href="https://github.com/ag-grid/ag-grid/tree/latest/packages/ag-grid-angular"><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/angular.svg?raw=true" height="16" width="16" alt="Angular Logo"> Angular</a></strong> and <strong><a href="https://github.com/ag-grid/ag-grid/tree/latest/packages/ag-grid-vue3"><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/vue.svg?raw=true" height="16" width="16" alt="Vue Logo"> Vue</a></strong>.</p>
|
||||
<!-- END MAIN DESCRIPTION -->
|
||||
<br>
|
||||
</div>
|
||||
|
||||
<picture>
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/kitchen-sink-demo-light.gif?raw=true" media="(prefers-color-scheme: light)">
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/kitchen-sink-demo-dark.gif?raw=true" media="(prefers-color-scheme: dark)">
|
||||
<img src="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/kitchen-sink-demo-light.gif?raw=true" alt="High Performance Demo">
|
||||
</picture>
|
||||
<div align="right">
|
||||
<a href="https://www.ag-grid.com/example/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github"><br><img alt="Static Badge" src="https://img.shields.io/badge/ag%E2%80%93grid.com-Live%20Demo-blue?style=for-the-badge&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KDTxnIGlkPSJTVkdSZXBvX2JnQ2FycmllciIgc3Ryb2tlLXdpZHRoPSIwIi8%2BCg08ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KDTxnIGlkPSJTVkdSZXBvX2ljb25DYXJyaWVyIj4gPHBhdGggZD0iTTE4IDIwLjc1SDZDNS4yNzA2NSAyMC43NSA0LjU3MTE4IDIwLjQ2MDMgNC4wNTU0NiAxOS45NDQ1QzMuNTM5NzMgMTkuNDI4OCAzLjI1IDE4LjcyOTMgMy4yNSAxOFY2QzMuMjUgNS4yNzA2NSAzLjUzOTczIDQuNTcxMTggNC4wNTU0NiA0LjA1NTQ2QzQuNTcxMTggMy41Mzk3MyA1LjI3MDY1IDMuMjUgNiAzLjI1SDEyQzEyLjE5ODkgMy4yNSAxMi4zODk3IDMuMzI5MDIgMTIuNTMwMyAzLjQ2OTY3QzEyLjY3MSAzLjYxMDMyIDEyLjc1IDMuODAxMDkgMTIuNzUgNEMxMi43NSA0LjE5ODkxIDEyLjY3MSA0LjM4OTY4IDEyLjUzMDMgNC41MzAzM0MxMi4zODk3IDQuNjcwOTggMTIuMTk4OSA0Ljc1IDEyIDQuNzVINkM1LjY2ODQ4IDQuNzUgNS4zNTA1NCA0Ljg4MTcgNS4xMTYxMiA1LjExNjEyQzQuODgxNyA1LjM1MDU0IDQuNzUgNS42Njg0OCA0Ljc1IDZWMThDNC43NSAxOC4zMzE1IDQuODgxNyAxOC42NDk1IDUuMTE2MTIgMTguODgzOUM1LjM1MDU0IDE5LjExODMgNS42Njg0OCAxOS4yNSA2IDE5LjI1SDE4QzE4LjMzMTUgMTkuMjUgMTguNjQ5NSAxOS4xMTgzIDE4Ljg4MzkgMTguODgzOUMxOS4xMTgzIDE4LjY0OTUgMTkuMjUgMTguMzMxNSAxOS4yNSAxOFYxMkMxOS4yNSAxMS44MDExIDE5LjMyOSAxMS42MTAzIDE5LjQ2OTcgMTEuNDY5N0MxOS42MTAzIDExLjMyOSAxOS44MDExIDExLjI1IDIwIDExLjI1QzIwLjE5ODkgMTEuMjUgMjAuMzg5NyAxMS4zMjkgMjAuNTMwMyAxMS40Njk3QzIwLjY3MSAxMS42MTAzIDIwLjc1IDExLjgwMTEgMjAuNzUgMTJWMThDMjAuNzUgMTguNzI5MyAyMC40NjAzIDE5LjQyODggMTkuOTQ0NSAxOS45NDQ1QzE5LjQyODggMjAuNDYwMyAxOC43MjkzIDIwLjc1IDE4IDIwLjc1WiIgZmlsbD0iI2ZmZmZmZiIvPiA8cGF0aCBkPSJNMjAgOC43NUMxOS44MDE5IDguNzQ3NDEgMTkuNjEyNiA4LjY2NzU2IDE5LjQ3MjUgOC41Mjc0N0MxOS4zMzI0IDguMzg3MzcgMTkuMjUyNiA4LjE5ODExIDE5LjI1IDhWNC43NUgxNkMxNS44MDExIDQuNzUgMTUuNjEwMyA0LjY3MDk4IDE1LjQ2OTcgNC41MzAzM0MxNS4zMjkgNC4zODk2OCAxNS4yNSA0LjE5ODkxIDE1LjI1IDRDMTUuMjUgMy44MDEwOSAxNS4zMjkgMy42MTAzMiAxNS40Njk3IDMuNDY5NjdDMTUuNjEwMyAzLjMyOTAyIDE1LjgwMTEgMy4yNSAxNiAzLjI1SDIwQzIwLjE5ODEgMy4yNTI1OSAyMC4zODc0IDMuMzMyNDQgMjAuNTI3NSAzLjQ3MjUzQzIwLjY2NzYgMy42MTI2MyAyMC43NDc0IDMuODAxODkgMjAuNzUgNFY4QzIwLjc0NzQgOC4xOTgxMSAyMC42Njc2IDguMzg3MzcgMjAuNTI3NSA4LjUyNzQ3QzIwLjM4NzQgOC42Njc1NiAyMC4xOTgxIDguNzQ3NDEgMjAgOC43NVoiIGZpbGw9IiNmZmZmZmYiLz4gPHBhdGggZD0iTTEzLjUgMTEuMjVDMTMuMzA3MSAxMS4yMzUyIDEzLjEyNzYgMTEuMTQ1NSAxMyAxMUMxMi44NzcgMTAuODYyNSAxMi44MDkgMTAuNjg0NSAxMi44MDkgMTAuNUMxMi44MDkgMTAuMzE1NSAxMi44NzcgMTAuMTM3NSAxMyAxMEwxOS41IDMuNUMxOS41Njg3IDMuNDI2MzEgMTkuNjUxNSAzLjM2NzIxIDE5Ljc0MzUgMy4zMjYyMkMxOS44MzU1IDMuMjg1MjMgMTkuOTM0OCAzLjI2MzE5IDIwLjAzNTUgMy4yNjE0MUMyMC4xMzYyIDMuMjU5NjMgMjAuMjM2MiAzLjI3ODE2IDIwLjMyOTYgMy4zMTU4OEMyMC40MjMgMy4zNTM2IDIwLjUwNzggMy40MDk3NCAyMC41NzkgMy40ODA5NkMyMC42NTAzIDMuNTUyMTggMjAuNzA2NCAzLjYzNzAxIDIwLjc0NDEgMy43MzA0QzIwLjc4MTggMy44MjM3OSAyMC44MDA0IDMuOTIzODIgMjAuNzk4NiA0LjAyNDUyQzIwLjc5NjggNC4xMjUyMyAyMC43NzQ4IDQuMjI0NTQgMjAuNzMzOCA0LjMxNjU0QzIwLjY5MjggNC40MDg1NCAyMC42MzM3IDQuNDkxMzQgMjAuNTYgNC41NkwxNCAxMUMxMy44NzI0IDExLjE0NTUgMTMuNjkyOSAxMS4yMzUyIDEzLjUgMTEuMjVaIiBmaWxsPSIjZmZmZmZmIi8%2BIDwvZz4KDTwvc3ZnPg%3D%3D">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
## 📖 Overview
|
||||
|
||||
<details>
|
||||
<summary><strong>Table of Contents</strong></summary>
|
||||
|
||||
- [JavaScript Data Grid | JavaScript Table]
|
||||
- [📖 Overview](#overview)
|
||||
- [Features](#features)
|
||||
- [Examples](#examples)
|
||||
- [⚡️ Quick Start](#️quick-start)
|
||||
- [Installation](#installation)
|
||||
- [Setup](#setup)
|
||||
- [Seed Projects](#seed-projects)
|
||||
- [🛠️ Customisations](#️customisations)
|
||||
- [Custom Components](#custom-components)
|
||||
- [Themes](#themes)
|
||||
- [Custom Themes](#custom-themes)
|
||||
- [🌍 Community](#community)
|
||||
- [Tools \& Extensions](#tools--extensions)
|
||||
- [Showcase](#showcase)
|
||||
- [Stargazers](#stargazers)
|
||||
- [🤝 Support](#support)
|
||||
- [Enterprise Support](#enterprise-support)
|
||||
- [Bug Reports](#bug-reports)
|
||||
- [Questions](#questions)
|
||||
- [Contributing](#contributing)
|
||||
- [⚠️ License](#️license)
|
||||
|
||||
</details>
|
||||
|
||||
AG Grid is available in two versions: Community & Enterprise.
|
||||
|
||||
- `ag-grid-community` is free, available under the MIT license, and comes with all of the core features expected from a JavaScript Data Grid, including [Sorting](https://www.ag-grid.com/javascript-data-grid/row-sorting/#sorting?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Filtering](https://www.ag-grid.com/javascript-data-grid/filtering/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Pagination](https://www.ag-grid.com/javascript-data-grid/row-pagination/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Editing](https://www.ag-grid.com/javascript-data-grid/cell-editing/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Custom Components](https://www.ag-grid.com/javascript-data-grid/component-cell-renderer/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Theming](https://www.ag-grid.com/javascript-data-grid/themes/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) and more.
|
||||
- `ag-grid-enterprise` is available under a commercial license and comes with advanced features, like [Integrated Charting](https://www.ag-grid.com/javascript-data-grid/integrated-charts/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Row Grouping](https://www.ag-grid.com/javascript-data-grid/grouping/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Aggregation](https://www.ag-grid.com/javascript-data-grid/grouping/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Pivoting](https://www.ag-grid.com/javascript-data-grid/pivoting/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Master/Detail](https://www.ag-grid.com/javascript-data-grid/master-detail/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), [Server-side Row Model](https://www.ag-grid.com/javascript-data-grid/server-side-model/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), and [Exporting](https://www.ag-grid.com/javascript-data-grid/excel-export/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) in addition to dedicated support from our Engineering team.
|
||||
|
||||
### Features
|
||||
|
||||
| Feature | AG Grid Community | AG Grid Enterprise |
|
||||
| -------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------- | ------------------ |
|
||||
| [Filtering](https://www.ag-grid.com/javascript-data-grid/filtering/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ (Advanced) |
|
||||
| [Sorting](https://www.ag-grid.com/javascript-data-grid/row-sorting/#sorting?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [Cell Editing](https://www.ag-grid.com/javascript-data-grid/cell-editing/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [CSV Export](https://www.ag-grid.com/javascript-data-grid/csv-export/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [Drag & Drop](https://www.ag-grid.com/javascript-data-grid/drag-and-drop/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [Themes and Styling](https://www.ag-grid.com/javascript-data-grid/themes/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [Selection](https://www.ag-grid.com/javascript-data-grid/row-selection/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [Accessibility](https://www.ag-grid.com/javascript-data-grid/accessibility/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [Infinite Scrolling](https://www.ag-grid.com/javascript-data-grid/infinite-scrolling/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [Pagination](https://www.ag-grid.com/javascript-data-grid/row-pagination/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [Server-Side Data](https://www.ag-grid.com/javascript-data-grid/server-side-model/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ (Advanced) |
|
||||
| [Custom Components](https://www.ag-grid.com/javascript-data-grid/component-cell-renderer/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ✅ | ✅ |
|
||||
| [Integrated Charting](https://www.ag-grid.com/javascript-data-grid/integrated-charts/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Range Selection](https://www.ag-grid.com/javascript-data-grid/range-selection/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Row Grouping and Aggregation](https://www.ag-grid.com/javascript-data-grid/grouping/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Pivoting](https://www.ag-grid.com/javascript-data-grid/pivoting/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Excel Export](https://www.ag-grid.com/javascript-data-grid/excel-export/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Clipboard Operations](https://www.ag-grid.com/javascript-data-grid/clipboard/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Master/Detail](https://www.ag-grid.com/javascript-data-grid/master-detail/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Tree Data](https://www.ag-grid.com/javascript-data-grid/tree-data/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Column Menu](https://www.ag-grid.com/javascript-data-grid/column-menu/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Context Menu](https://www.ag-grid.com/javascript-data-grid/context-menu/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Tool Panels](https://www.ag-grid.com/javascript-data-grid/tool-panel/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) | ❌ | ✅ |
|
||||
| [Support](https://ag-grid.zendesk.com/hc/en-us) | ❌ | ✅ |
|
||||
|
||||
<blockquote>
|
||||
<p>ℹ️ <b>Note:</b></p>
|
||||
<span>Visit the <a href="https://www.ag-grid.com/license-pricing/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">Pricing</a> page for a full comparison.</span>
|
||||
</blockquote>
|
||||
|
||||
### Examples
|
||||
|
||||
We've created several demos to showcase AG Grid's rich feature set across different use cases. See them in action below, or interact with them on our [Demo](https://www.ag-grid.com/example/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) page.
|
||||
|
||||
<details open>
|
||||
<summary>🏦 <b>Financial Demo</b></summary>
|
||||
<br>
|
||||
<p>Financial data example featuring live updates and sparklines:</p>
|
||||
<a href="https://www.ag-grid.com/example-finance/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">
|
||||
<picture>
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/finance-demo-light.gif?raw=true" media="(prefers-color-scheme: light)">
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/finance-demo-dark.gif?raw=true" media="(prefers-color-scheme: dark)">
|
||||
<img src="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/finance-demo-light.gif?raw=true" alt="Finance">
|
||||
</picture>
|
||||
</a>
|
||||
<br>
|
||||
<div align="right"><span><a href="https://www.ag-grid.com/example-finance/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">Live Demo</a></span> • <span><a href="https://github.com/ag-grid/ag-grid-demos/tree/main/finance">Source Code</a></span></div>
|
||||
<br>
|
||||
</details>
|
||||
<details>
|
||||
<summary>📦 <b>Inventory Demo</b></summary>
|
||||
<br>
|
||||
<p>Inventory data example to view and manage products:</p>
|
||||
<a href="https://www.ag-grid.com/example-inventory/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">
|
||||
<picture>
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/inventory-demo-light.gif?raw=true" media="(prefers-color-scheme: light)">
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/inventory-demo-dark.gif?raw=true" media="(prefers-color-scheme: dark)">
|
||||
<img src="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/inventory-demo-light.gif?raw=true" alt="Finance">
|
||||
</picture>
|
||||
</a>
|
||||
<div align="right"><span><a href="https://www.ag-grid.com/example-inventory/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">Live Demo</a></span> • <span><a href="https://github.com/ag-grid/ag-grid-demos/tree/main/inventory">Source Code</a></span></div>
|
||||
<br>
|
||||
</details>
|
||||
<details>
|
||||
|
||||
<summary>🧑💼 <b>HR Demo</b></summary>
|
||||
<br>
|
||||
<p>HR data example showing hierarchical employee data:</p>
|
||||
<a href="https://www.ag-grid.com/example-hr/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">
|
||||
<picture>
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/hr-demo-light.gif?raw=true" media="(prefers-color-scheme: light)">
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/hr-demo-dark.gif?raw=true" media="(prefers-color-scheme: dark)">
|
||||
<img src="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/hr-demo-light.gif?raw=true" alt="Finance">
|
||||
</picture>
|
||||
</a>
|
||||
<div align="right"><span><a href="https://www.ag-grid.com/example-hr/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">Live Demo</a></span> • <span><a href="https://github.com/ag-grid/ag-grid-demos/tree/main/hr">Source Code</a></span></div>
|
||||
<br>
|
||||
</details>
|
||||
|
||||
## ⚡️ Quick Start
|
||||
|
||||
<!-- START QUICK START DESCRIPTION -->
|
||||
|
||||
AG Grid is easy to set up - all you need to do is provide your data and define your column structure. Read on for vanilla JavaScript installation instructions, or refer to our framework-specific guides for<strong><a href="https://www.ag-grid.com/react-data-grid/getting-started/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github"><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/react.svg?raw=true" height="16" width="16" alt="React Logo"> React</a></strong>,<strong><a href="https://www.ag-grid.com/angular-data-grid/getting-started/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github"><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/angular.svg?raw=true" height="16" width="16" alt="Angular Logo"> Angular</a></strong> and<strong><a href="https://www.ag-grid.com/vue-data-grid/getting-started/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github"><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/vue.svg?raw=true" height="16" width="16" alt="Vue Logo"> Vue.</a></strong>
|
||||
|
||||
<!-- END QUICK START DESCRIPTION -->
|
||||
|
||||
### Installation
|
||||
|
||||
```sh
|
||||
$ npm install --save ag-grid-community
|
||||
```
|
||||
|
||||
### Setup
|
||||
|
||||
<!-- START SETUP -->
|
||||
|
||||
**1. Provide a Container**
|
||||
|
||||
<!-- Create JavaScript -->
|
||||
|
||||
Load the AG Grid library and create a container div. The div should have a height because the Data Grid will fill the size of the parent container:
|
||||
|
||||
```html
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Includes all JS & CSS for the JavaScript Data Grid -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/ag-grid-community/dist/ag-grid-community.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Your Data Grid container -->
|
||||
<div id="myGrid" style="height: 500px"></div>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
**2. Instantiating the JavaScript Data Grid**
|
||||
|
||||
Create the Data Grid inside of your container div using `createGrid`.
|
||||
|
||||
```js
|
||||
// Grid Options: Contains all of the Data Grid configurations
|
||||
const gridOptions = {};
|
||||
|
||||
// Your Javascript code to create the Data Grid
|
||||
const myGridElement = document.querySelector('#myGrid');
|
||||
agGrid.createGrid(myGridElement, gridOptions);
|
||||
```
|
||||
|
||||
**3. Define Rows and Columns**
|
||||
|
||||
```js
|
||||
// Grid Options: Contains all of the Data Grid configurations
|
||||
const gridOptions = {
|
||||
// Row Data: The data to be displayed.
|
||||
rowData: [
|
||||
{ make: 'Tesla', model: 'Model Y', price: 64950, electric: true },
|
||||
{ make: 'Ford', model: 'F-Series', price: 33850, electric: false },
|
||||
{ make: 'Toyota', model: 'Corolla', price: 29600, electric: false },
|
||||
],
|
||||
// Column Definitions: Defines the columns to be displayed.
|
||||
columnDefs: [{ field: 'make' }, { field: 'model' }, { field: 'price' }, { field: 'electric' }],
|
||||
};
|
||||
```
|
||||
|
||||
<!-- END SETUP -->
|
||||
|
||||
<blockquote>
|
||||
<p>ℹ️ <b>Note:</b></p>
|
||||
<span>For more information on building Data Grids with AG Grid, refer to our <a href="https://www.ag-grid.com/javascript-data-grid/getting-started/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=githu">Documentation</a>.</span>
|
||||
</blockquote>
|
||||
|
||||
### Seed Projects
|
||||
|
||||
We also provide [Seed Projects](https://github.com/ag-grid/ag-grid-seed) to help you get started with common configurations:
|
||||
|
||||
<table width="100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Environment</th>
|
||||
<th>Framework</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><a href="https://github.com/ag-grid/ag-grid-seed/tree/main/enterprise/packages/create-react-app">Create React App (CRA)</a></td>
|
||||
<td align="middle"><img width="22" height="22" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/react.svg?raw=true" alt="React Logo"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="https://github.com/ag-grid/ag-grid-seed/tree/main/enterprise/packages/vite-react">Vite</a></td>
|
||||
<td align="middle"><img width="22" height="22" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/react.svg?raw=true" alt="React Logo"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="https://github.com/ag-grid/ag-grid-seed/tree/main/enterprise/packages/create-next-app">Create Next App</a></td>
|
||||
<td align="middle"><img width="22" height="22" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/react.svg?raw=true" alt="React Logo"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="https://github.com/ag-grid/ag-grid-seed/tree/main/enterprise/packages/vite-typescript">Vite - TypeScript</a></td>
|
||||
<td align="middle"><img width="22" height="22" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/typescript.svg?raw=true" alt="TypeScript Logo"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="https://github.com/ag-grid/ag-grid-seed/tree/main/enterprise/packages/webpack5-typescript">Webpack 5 - TypeScript</a></td>
|
||||
<td align="middle"><img width="22" height="22" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/typescript.svg?raw=true" alt="TypeScript Logo"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="https://github.com/ag-grid/ag-grid-seed/tree/main/enterprise/packages/webpack5-javascript">Webpack 5 - JavaScript</a></td>
|
||||
<td align="middle"><img width="22" height="22" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/javascript.svg?raw=true" alt="JavaScript Logo"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="https://github.com/ag-grid/ag-grid-seed/tree/main/enterprise/packages/angular-cli">Angular CLI</a></td>
|
||||
<td align="middle"><img width="22" height="22" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/angular.svg?raw=true" alt="Angular Logo"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="https://github.com/ag-grid/ag-grid-seed/tree/main/enterprise/packages/nuxt-vue3">Nuxt</a></td>
|
||||
<td align="middle"><img width="22" height="22" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/vue.svg?raw=true" alt="Vue3 Logo"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="https://github.com/ag-grid/ag-grid-seed/tree/main/enterprise/packages/vite-vue3">Vite</a></td>
|
||||
<td align="middle"><img width="22" height="22" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/fw-logos/vue.svg?raw=true" alt="Vue3 Logo"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
## 🛠️ Customisations
|
||||
|
||||
AG Grid is fully customisable, both in terms of appearance and functionality. There are many ways in which the grid can be customised and we provide a selection of tools to help create those customisations.
|
||||
|
||||
### Custom Components
|
||||
|
||||
You can create your own Custom Components to customise the behaviour of the grid. For example, you can customise how cells are rendered, how values are edited and also create your own filters.
|
||||
|
||||
There are a number of different [Component Types](https://www.ag-grid.com/javascript-data-grid/components/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) that you can provide to the grid, including:
|
||||
|
||||
- [Cell Component](https://www.ag-grid.com/javascript-data-grid/component-cell-renderer/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): To customise the contents of a cell.
|
||||
- [Header Component](https://www.ag-grid.com/javascript-data-grid/column-headers/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): To customise the header of a column and column groups.
|
||||
- [Edit Component](https://www.ag-grid.com/javascript-data-grid/cell-editors/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): To customise the editing of a cell.
|
||||
- [Filter Component](https://www.ag-grid.com/javascript-data-grid/component-filter/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): For custom column filter that appears inside the column menu.
|
||||
- [Floating Filter](https://www.ag-grid.com/javascript-data-grid/component-floating-filter/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): For custom column floating filter that appears inside the column menu.
|
||||
- [Date Component](https://www.ag-grid.com/javascript-data-grid/filter-date/#custom-selection-component?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): To customise the date selection component in the date filter.
|
||||
- [Loading Component](https://www.ag-grid.com/javascript-data-grid/component-loading-cell-renderer/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): To customise the loading cell row when using Server Side Row Model.
|
||||
- [Overlay Component](https://www.ag-grid.com/javascript-data-grid/overlays/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): To customise loading and no rows overlay components.
|
||||
- [Status Bar Component](https://www.ag-grid.com/javascript-data-grid/status-bar/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): For custom status bar components.
|
||||
- [Tool Panel Component](https://www.ag-grid.com/javascript-data-grid/component-tool-panel/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): For custom tool panel components.
|
||||
- [Tooltip Component](https://www.ag-grid.com/javascript-data-grid/tooltips/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): For custom cell tooltip components.
|
||||
- [Menu Item Component](https://www.ag-grid.com/javascript-data-grid/component-menu-item/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github): To customise the menu items shown in the Column and Context Menus.
|
||||
|
||||
To supply a custom cell renderer and filter components to the Grid, create a direct reference to your component within the `gridOptions.columnDefs` property:
|
||||
|
||||
```js
|
||||
gridOptions = {
|
||||
columnDefs: [
|
||||
{
|
||||
field: 'country', // The column to add the component to
|
||||
cellRenderer: CountryCellRenderer, // Your custom cell component
|
||||
filter: CountryFilter, // Your custom filter component
|
||||
},
|
||||
],
|
||||
};
|
||||
```
|
||||
|
||||
### Themes
|
||||
|
||||
AG Grid has 4 [themes](https://www.ag-grid.com/javascript-data-grid/themes/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), each available in `light` & `dark` modes:
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<th>Quartz</th>
|
||||
<th>Material</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<a href="https://www.ag-grid.com/javascript-data-grid/themes/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">
|
||||
<picture>
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/quartz-theme-light.png?raw=true" media="(prefers-color-scheme: light)">
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/quartz-theme.png?raw=true" media="(prefers-color-scheme: dark)">
|
||||
<img src="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/quartz-theme-light.png?raw=true" alt="Quartz Theme">
|
||||
</picture>
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
<a href="https://www.ag-grid.com/javascript-data-grid/themes/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">
|
||||
<picture>
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/material-theme-light.png?raw=true" media="(prefers-color-scheme: light)">
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/material-theme.png?raw=true" media="(prefers-color-scheme: dark)">
|
||||
<img src="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/material-theme-light.png?raw=true" alt="Material Theme">
|
||||
</picture>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Alpine</th>
|
||||
<th>Balham</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<a href="https://www.ag-grid.com/javascript-data-grid/themes/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">
|
||||
<picture>
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/alpine-theme-light.png?raw=true" media="(prefers-color-scheme: light)">
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/alpine-theme.png?raw=true" media="(prefers-color-scheme: dark)">
|
||||
<img src="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/alpine-theme-light.png?raw=true" alt="Alpine Theme">
|
||||
</picture>
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
<a href="https://www.ag-grid.com/javascript-data-grid/themes/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github">
|
||||
<picture>
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/balham-theme-light.png?raw=true" media="(prefers-color-scheme: light)">
|
||||
<source srcset="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/balham-theme.png?raw=true" media="(prefers-color-scheme: dark)">
|
||||
<img src="https://github.com/ag-grid/ag-grid/blob/latest/readme-assets/balham-theme-light.png?raw=true" alt="Balham Theme">
|
||||
</picture>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
### Custom Themes
|
||||
|
||||
All AG Grid themes can be customised using the [Theming API](https://www.ag-grid.com/javascript-data-grid/theming/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github), or you can create a new theme from scratch with the help of our [Theme Builder](https://www.ag-grid.com/theme-builder/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) or [Figma Design System](https://www.figma.com/community/file/1360600846643230092/ag-grid-design-system).
|
||||
|
||||
## 🌍 Community
|
||||
|
||||
### Tools & Extensions
|
||||
|
||||
AG Grid has a large and active community who have created an [ecosystem of 3rd party tools, extensions and utilities](https://www.ag-grid.com/community/tools-extensions/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) to help you build your next project with AG Grid, no matter which language or framework you use:
|
||||
|
||||
<div>
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/react.svg?raw=true" align="center" width="16" height="16" alt="React Logo"> React</span>
|
||||
</a> •
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/angular.svg?raw=true" align="center" width="16" height="16" alt="Angular Logo"> Angular</span>
|
||||
</a> •
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/typescript.svg?raw=true" align="center" width="16" height="16" alt="TypeScript Logo"> TypeScript</span>
|
||||
</a> •
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/vue.svg?raw=true" align="center" width="16" height="16" alt="Vue Logo"> Vue</span>
|
||||
</a> •
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/python.svg?raw=true" align="center" width="16" height="16" alt="Python Logo"> Python</span>
|
||||
</a> •
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/svelte.svg?raw=true" align="center" width="16" height="16" alt="Svelte Logo"> Svelte</span>
|
||||
</a> •
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/solidjs.svg?raw=true" align="center" width="16" height="16" alt="SolidJS Logo"> SolidJS</span>
|
||||
</a> •
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/.net.svg?raw=true" align="center" width="16" height="16" alt=".NET Logo"> .NET</span>
|
||||
</a> •
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/rust.svg?raw=true" align="center" width="16" height="16" alt="Rust Logo"> Rust</span>
|
||||
</a> •
|
||||
<a href="https://www.ag-grid.com/community/tools-extensions/">
|
||||
<span><img src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/community/frameworks/laravel.svg?raw=true" align="center" width="16" height="16" alt="Laravel Logo"> Laravel</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
### Showcase
|
||||
|
||||
AG Grid is used by 100,000's of developers across the world, from almost every industry. Whilst most of these projects are private, we've curated a selection of open-source projects from different industries where household names use AG Grid, including **J.P.Morgan**, **MongoDB** and **NASA**. Visit our [Community Showcase](https://www.ag-grid.com/community/showcase/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) page to learn more.
|
||||
|
||||
### Stargazers
|
||||
|
||||
Founded in 2016, AG Grid has seen a steady rise in popularity and is now the market leader for Data Grids:
|
||||
|
||||
<picture>
|
||||
<source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=ag-grid/ag-grid&type=Date&theme=dark"/>
|
||||
<source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=ag-grid/ag-grid&type=Date"/>
|
||||
<img width="100%" alt="The AG Grid star history chart" src="https://api.star-history.com/svg?repos=ag-grid/ag-grid&type=Date"/>
|
||||
</picture>
|
||||
|
||||
## 🤝 Support
|
||||
|
||||
### Enterprise Support
|
||||
|
||||
AG Grid Enterprise customers have access to dedicated support via [ZenDesk](https://ag-grid.zendesk.com/hc/en-us), which is monitored by our engineering teams.
|
||||
|
||||
### Bug Reports
|
||||
|
||||
If you have found a bug, please report it in this repository's [issues](https://github.com/ag-grid/ag-grid/issues) section.
|
||||
|
||||
<img src="https://img.shields.io/github/issues-closed/ag-grid/ag-grid?style=for-the-badge&color=%233d8c40" alt="GitHub Issues" height="26">
|
||||
|
||||
### Questions
|
||||
|
||||
Look for similar problems on [StackOverflow](https://stackoverflow.com/questions/tagged/ag-grid) using the `ag-grid` tag. If nothing seems related, post a new message there. Please do not use GitHub issues to ask questions.
|
||||
|
||||
<img src="https://img.shields.io/stackexchange/stackoverflow.com/t/ag-grid?style=for-the-badge&color=%233d8c40" alt="Stack Exchange questions" height="26">
|
||||
|
||||
### Contributing
|
||||
|
||||
AG Grid is developed by a team of co-located developers in London. If you want to join the team send your application to info@ag-grid.com.
|
||||
|
||||
## ⚠️ License
|
||||
|
||||
`ag-grid-community` is licensed under the **MIT** license.
|
||||
|
||||
`ag-grid-enterprise` has a **Commercial** license.
|
||||
|
||||
See the [LICENSE file](./LICENSE.txt) for more info.
|
||||
|
||||
<div><h2><img vertical-align="middle" width="32" height="32" src="https://github.com/ag-grid/ag-grid/blob/latest/documentation/ag-grid-docs/public/images/ag-logos/svg-logos/AG-BrandMark_Light-Theme.svg?raw=true" alt="AG ChartsLogo">AG Charts</h2></div>
|
||||
|
||||
If you've made it this far, you may be interested in our latest project: [AG Charts](https://www.ag-grid.com/charts?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) - The best JavaScript Charting library in the world.
|
||||
|
||||
Initially built to power [Integrated Charts](https://www.ag-grid.com/javascript-data-grid/integrated-charts/?utm_source=ag-grid-readme&utm_medium=repository&utm_campaign=github) in AG Grid, we open-sourced this project in 2018. Having seen the steady rise in popularity since then, we have decided to invest in AG Charts with a dedicated Enterprise version (`ag-charts-enterprise`) in addition to our continued support of `ag-charts-community`.
|
||||
|
||||
<a href="https://www.ag-grid.com/charts/?utm_source=ag-charts-readme&utm_medium=repository&utm_campaign=github">
|
||||
<picture>
|
||||
<source media="(prefers-color-scheme: dark)" srcset="https://github.com/ag-grid/ag-charts/blob/2ee85f286ccc151cb5e4517f711bafd03366db3c/packages/ag-charts-website/public/images/readme-assets/gallery-dark.gif?raw=true"/>
|
||||
<source media="(prefers-color-scheme: light)" srcset="https://github.com/ag-grid/ag-charts/blob/2ee85f286ccc151cb5e4517f711bafd03366db3c/packages/ag-charts-website/public/images/readme-assets/gallery.gif?raw=true"/>
|
||||
<img width="100%" alt="Preview of AG Charts JavaScript Charting Examples" src="https://github.com/ag-grid/ag-charts/blob/2ee85f286ccc151cb5e4517f711bafd03366db3c/packages/ag-charts-website/public/images/readme-assets/gallery.gif?raw=true"/>
|
||||
</picture>
|
||||
</a>
|
||||
|
||||
<div align="right">
|
||||
<a href="https://www.ag-grid.com/charts/?utm_source=ag-charts-readme&utm_medium=repository&utm_campaign=github"><br><img alt="Static Badge" src="https://img.shields.io/badge/ag%E2%80%93charts.com-Learn%20More%20-blue?style=for-the-badge&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KDTxnIGlkPSJTVkdSZXBvX2JnQ2FycmllciIgc3Ryb2tlLXdpZHRoPSIwIi8%2BCg08ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KDTxnIGlkPSJTVkdSZXBvX2ljb25DYXJyaWVyIj4gPHBhdGggZD0iTTE4IDIwLjc1SDZDNS4yNzA2NSAyMC43NSA0LjU3MTE4IDIwLjQ2MDMgNC4wNTU0NiAxOS45NDQ1QzMuNTM5NzMgMTkuNDI4OCAzLjI1IDE4LjcyOTMgMy4yNSAxOFY2QzMuMjUgNS4yNzA2NSAzLjUzOTczIDQuNTcxMTggNC4wNTU0NiA0LjA1NTQ2QzQuNTcxMTggMy41Mzk3MyA1LjI3MDY1IDMuMjUgNiAzLjI1SDEyQzEyLjE5ODkgMy4yNSAxMi4zODk3IDMuMzI5MDIgMTIuNTMwMyAzLjQ2OTY3QzEyLjY3MSAzLjYxMDMyIDEyLjc1IDMuODAxMDkgMTIuNzUgNEMxMi43NSA0LjE5ODkxIDEyLjY3MSA0LjM4OTY4IDEyLjUzMDMgNC41MzAzM0MxMi4zODk3IDQuNjcwOTggMTIuMTk4OSA0Ljc1IDEyIDQuNzVINkM1LjY2ODQ4IDQuNzUgNS4zNTA1NCA0Ljg4MTcgNS4xMTYxMiA1LjExNjEyQzQuODgxNyA1LjM1MDU0IDQuNzUgNS42Njg0OCA0Ljc1IDZWMThDNC43NSAxOC4zMzE1IDQuODgxNyAxOC42NDk1IDUuMTE2MTIgMTguODgzOUM1LjM1MDU0IDE5LjExODMgNS42Njg0OCAxOS4yNSA2IDE5LjI1SDE4QzE4LjMzMTUgMTkuMjUgMTguNjQ5NSAxOS4xMTgzIDE4Ljg4MzkgMTguODgzOUMxOS4xMTgzIDE4LjY0OTUgMTkuMjUgMTguMzMxNSAxOS4yNSAxOFYxMkMxOS4yNSAxMS44MDExIDE5LjMyOSAxMS42MTAzIDE5LjQ2OTcgMTEuNDY5N0MxOS42MTAzIDExLjMyOSAxOS44MDExIDExLjI1IDIwIDExLjI1QzIwLjE5ODkgMTEuMjUgMjAuMzg5NyAxMS4zMjkgMjAuNTMwMyAxMS40Njk3QzIwLjY3MSAxMS42MTAzIDIwLjc1IDExLjgwMTEgMjAuNzUgMTJWMThDMjAuNzUgMTguNzI5MyAyMC40NjAzIDE5LjQyODggMTkuOTQ0NSAxOS45NDQ1QzE5LjQyODggMjAuNDYwMyAxOC43MjkzIDIwLjc1IDE4IDIwLjc1WiIgZmlsbD0iI2ZmZmZmZiIvPiA8cGF0aCBkPSJNMjAgOC43NUMxOS44MDE5IDguNzQ3NDEgMTkuNjEyNiA4LjY2NzU2IDE5LjQ3MjUgOC41Mjc0N0MxOS4zMzI0IDguMzg3MzcgMTkuMjUyNiA4LjE5ODExIDE5LjI1IDhWNC43NUgxNkMxNS44MDExIDQuNzUgMTUuNjEwMyA0LjY3MDk4IDE1LjQ2OTcgNC41MzAzM0MxNS4zMjkgNC4zODk2OCAxNS4yNSA0LjE5ODkxIDE1LjI1IDRDMTUuMjUgMy44MDEwOSAxNS4zMjkgMy42MTAzMiAxNS40Njk3IDMuNDY5NjdDMTUuNjEwMyAzLjMyOTAyIDE1LjgwMTEgMy4yNSAxNiAzLjI1SDIwQzIwLjE5ODEgMy4yNTI1OSAyMC4zODc0IDMuMzMyNDQgMjAuNTI3NSAzLjQ3MjUzQzIwLjY2NzYgMy42MTI2MyAyMC43NDc0IDMuODAxODkgMjAuNzUgNFY4QzIwLjc0NzQgOC4xOTgxMSAyMC42Njc2IDguMzg3MzcgMjAuNTI3NSA4LjUyNzQ3QzIwLjM4NzQgOC42Njc1NiAyMC4xOTgxIDguNzQ3NDEgMjAgOC43NVoiIGZpbGw9IiNmZmZmZmYiLz4gPHBhdGggZD0iTTEzLjUgMTEuMjVDMTMuMzA3MSAxMS4yMzUyIDEzLjEyNzYgMTEuMTQ1NSAxMyAxMUMxMi44NzcgMTAuODYyNSAxMi44MDkgMTAuNjg0NSAxMi44MDkgMTAuNUMxMi44MDkgMTAuMzE1NSAxMi44NzcgMTAuMTM3NSAxMyAxMEwxOS41IDMuNUMxOS41Njg3IDMuNDI2MzEgMTkuNjUxNSAzLjM2NzIxIDE5Ljc0MzUgMy4zMjYyMkMxOS44MzU1IDMuMjg1MjMgMTkuOTM0OCAzLjI2MzE5IDIwLjAzNTUgMy4yNjE0MUMyMC4xMzYyIDMuMjU5NjMgMjAuMjM2MiAzLjI3ODE2IDIwLjMyOTYgMy4zMTU4OEMyMC40MjMgMy4zNTM2IDIwLjUwNzggMy40MDk3NCAyMC41NzkgMy40ODA5NkMyMC42NTAzIDMuNTUyMTggMjAuNzA2NCAzLjYzNzAxIDIwLjc0NDEgMy43MzA0QzIwLjc4MTggMy44MjM3OSAyMC44MDA0IDMuOTIzODIgMjAuNzk4NiA0LjAyNDUyQzIwLjc5NjggNC4xMjUyMyAyMC43NzQ4IDQuMjI0NTQgMjAuNzMzOCA0LjMxNjU0QzIwLjY5MjggNC40MDg1NCAyMC42MzM3IDQuNDkxMzQgMjAuNTYgNC41NkwxNCAxMUMxMy44NzI0IDExLjE0NTUgMTMuNjkyOSAxMS4yMzUyIDEzLjUgMTEuMjVaIiBmaWxsPSIjZmZmZmZmIi8%2BIDwvZz4KDTwvc3ZnPg%3D%3D">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div align="center">
|
||||
|
||||
<hr/>
|
||||
|
||||
<strong>Follow us to keep up to date with all the latest news from AG Grid:</strong>
|
||||
|
||||
<a href="https://x.com/ag_grid"><img src="https://img.shields.io/badge/-X%20(Twitter)-black?style=for-the-badge&logo=x" alt="Twitter Badge" height="36"></a>
|
||||
<a href="https://www.linkedin.com/company/ag-grid/"><img src="https://img.shields.io/badge/-LinkedIn-blue?style=for-the-badge&logo=linkedin" alt="LinkedIn Badge" height="36"></a>
|
||||
<a href="https://www.youtube.com/c/ag-grid"><img src="https://img.shields.io/badge/-YouTube-red?style=for-the-badge&logo=youtube" alt="YouTube Badge" height="36"></a>
|
||||
<a href="https://blog.ag-grid.com"><img src="https://img.shields.io/badge/-Blog-grey?style=for-the-badge&logo=rss" alt="Blog Badge" height="36"></a>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,141 @@
|
||||
{
|
||||
"name": "ag-grid-community",
|
||||
"version": "34.1.2",
|
||||
"description": "Advanced Data Grid / Data Table supporting Javascript / Typescript / React / Angular / Vue",
|
||||
"main": "./dist/package/main.cjs.js",
|
||||
"types": "./dist/types/src/main.d.ts",
|
||||
"module": "./dist/package/main.esm.mjs",
|
||||
"exports": {
|
||||
".": {
|
||||
"import": "./dist/package/main.esm.mjs",
|
||||
"types": "./dist/types/src/main.d.ts",
|
||||
"require": "./dist/package/main.cjs.js",
|
||||
"default": "./dist/package/main.cjs.js"
|
||||
},
|
||||
"./styles/ag-grid-no-native-widgets.css": "./styles/ag-grid-no-native-widgets.css",
|
||||
"./styles/ag-grid-no-native-widgets.min.css": "./styles/ag-grid-no-native-widgets.min.css",
|
||||
"./styles/ag-grid.css": "./styles/ag-grid.css",
|
||||
"./styles/ag-grid.min.css": "./styles/ag-grid.min.css",
|
||||
"./styles/ag-theme-alpine-no-font.css": "./styles/ag-theme-alpine-no-font.css",
|
||||
"./styles/ag-theme-alpine-no-font.min.css": "./styles/ag-theme-alpine-no-font.min.css",
|
||||
"./styles/ag-theme-alpine.css": "./styles/ag-theme-alpine.css",
|
||||
"./styles/ag-theme-alpine.min.css": "./styles/ag-theme-alpine.min.css",
|
||||
"./styles/ag-theme-balham-no-font.css": "./styles/ag-theme-balham-no-font.css",
|
||||
"./styles/ag-theme-balham-no-font.min.css": "./styles/ag-theme-balham-no-font.min.css",
|
||||
"./styles/ag-theme-balham.css": "./styles/ag-theme-balham.css",
|
||||
"./styles/ag-theme-balham.min.css": "./styles/ag-theme-balham.min.css",
|
||||
"./styles/ag-theme-material-no-font.css": "./styles/ag-theme-material-no-font.css",
|
||||
"./styles/ag-theme-material-no-font.min.css": "./styles/ag-theme-material-no-font.min.css",
|
||||
"./styles/ag-theme-material.css": "./styles/ag-theme-material.css",
|
||||
"./styles/ag-theme-material.min.css": "./styles/ag-theme-material.min.css",
|
||||
"./styles/ag-theme-quartz-no-font.css": "./styles/ag-theme-quartz-no-font.css",
|
||||
"./styles/ag-theme-quartz-no-font.min.css": "./styles/ag-theme-quartz-no-font.min.css",
|
||||
"./styles/ag-theme-quartz.css": "./styles/ag-theme-quartz.css",
|
||||
"./styles/ag-theme-quartz.min.css": "./styles/ag-theme-quartz.min.css",
|
||||
"./styles/agGridAlpineFont.css": "./styles/agGridAlpineFont.css",
|
||||
"./styles/agGridAlpineFont.min.css": "./styles/agGridAlpineFont.min.css",
|
||||
"./styles/agGridBalhamFont.css": "./styles/agGridBalhamFont.css",
|
||||
"./styles/agGridBalhamFont.min.css": "./styles/agGridBalhamFont.min.css",
|
||||
"./styles/agGridClassicFont.css": "./styles/agGridClassicFont.css",
|
||||
"./styles/agGridClassicFont.min.css": "./styles/agGridClassicFont.min.css",
|
||||
"./styles/agGridMaterialFont.css": "./styles/agGridMaterialFont.css",
|
||||
"./styles/agGridMaterialFont.min.css": "./styles/agGridMaterialFont.min.css",
|
||||
"./styles/agGridQuartzFont.css": "./styles/agGridQuartzFont.css",
|
||||
"./styles/agGridQuartzFont.min.css": "./styles/agGridQuartzFont.min.css",
|
||||
"./styles": "./styles/_index.scss"
|
||||
},
|
||||
"sideEffects": [
|
||||
"./styles/ag-grid-no-native-widgets.css",
|
||||
"./styles/ag-grid-no-native-widgets.min.css",
|
||||
"./styles/ag-grid.css",
|
||||
"./styles/ag-grid.min.css",
|
||||
"./styles/ag-theme-alpine-no-font.css",
|
||||
"./styles/ag-theme-alpine-no-font.min.css",
|
||||
"./styles/ag-theme-alpine.css",
|
||||
"./styles/ag-theme-alpine.min.css",
|
||||
"./styles/ag-theme-balham-no-font.css",
|
||||
"./styles/ag-theme-balham-no-font.min.css",
|
||||
"./styles/ag-theme-balham.css",
|
||||
"./styles/ag-theme-balham.min.css",
|
||||
"./styles/ag-theme-material-no-font.css",
|
||||
"./styles/ag-theme-material-no-font.min.css",
|
||||
"./styles/ag-theme-material.css",
|
||||
"./styles/ag-theme-material.min.css",
|
||||
"./styles/ag-theme-quartz-no-font.css",
|
||||
"./styles/ag-theme-quartz-no-font.min.css",
|
||||
"./styles/ag-theme-quartz.css",
|
||||
"./styles/ag-theme-quartz.min.css",
|
||||
"./styles/agGridAlpineFont.css",
|
||||
"./styles/agGridAlpineFont.min.css",
|
||||
"./styles/agGridBalhamFont.css",
|
||||
"./styles/agGridBalhamFont.min.css",
|
||||
"./styles/agGridClassicFont.css",
|
||||
"./styles/agGridClassicFont.min.css",
|
||||
"./styles/agGridMaterialFont.css",
|
||||
"./styles/agGridMaterialFont.min.css",
|
||||
"./styles/agGridQuartzFont.css",
|
||||
"./styles/agGridQuartzFont.min.css"
|
||||
],
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/ag-grid/ag-grid.git"
|
||||
},
|
||||
"keywords": [
|
||||
"ag",
|
||||
"ag-grid",
|
||||
"datagrid",
|
||||
"data-grid",
|
||||
"data grid",
|
||||
"datatable",
|
||||
"data-table",
|
||||
"data table",
|
||||
"grid",
|
||||
"table",
|
||||
"react",
|
||||
"table",
|
||||
"angular",
|
||||
"angular data grid",
|
||||
"angular table",
|
||||
"angular-component",
|
||||
"react",
|
||||
"react data grid",
|
||||
"react table",
|
||||
"react-component",
|
||||
"reactjs",
|
||||
"vue",
|
||||
"vuejs"
|
||||
],
|
||||
"author": "Sean Landsman <sean@thelandsmans.com>",
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://github.com/ag-grid/ag-grid/issues"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions",
|
||||
"not ie >= 0",
|
||||
"not ie_mob >= 0",
|
||||
"not blackberry > 0"
|
||||
],
|
||||
"homepage": "https://www.ag-grid.com/",
|
||||
"dependencies": {
|
||||
"ag-charts-types": "12.1.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"source-map-loader": "^5.0.0",
|
||||
"ts-loader": "^9.5.1",
|
||||
"style-loader": "^3.3.4",
|
||||
"css-loader": "^6.10.0",
|
||||
"postcss-loader": "^8.1.0",
|
||||
"webpack-cli": "^5.1.4",
|
||||
"terser-webpack-plugin": "^5.3.10",
|
||||
"postcss-preset-env": "^9.5.0",
|
||||
"web-streams-polyfill": "^3.3.2",
|
||||
"blob-polyfill": "^7.0.20220408",
|
||||
"compression-streams-polyfill": "^0.1.7",
|
||||
"text-encoding-polyfill": "^0.6.7",
|
||||
"@types/jest": "^29.5.0",
|
||||
"jest": "^29.5.0",
|
||||
"jest-environment-jsdom": "^29.7.0"
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,72 @@
|
||||
|
||||
// THIS FILE IS GENERATED, DO NOT EDIT IT!
|
||||
@use "sass:string";
|
||||
$icon-font-codes: (
|
||||
aggregation: string.unquote("\"\\") + string.unquote("f101\""),
|
||||
arrows: string.unquote("\"\\") + string.unquote("f102\""),
|
||||
asc: string.unquote("\"\\") + string.unquote("f103\""),
|
||||
cancel: string.unquote("\"\\") + string.unquote("f104\""),
|
||||
chart: string.unquote("\"\\") + string.unquote("f105\""),
|
||||
checkbox-checked: string.unquote("\"\\") + string.unquote("f106\""),
|
||||
checkbox-indeterminate: string.unquote("\"\\") + string.unquote("f107\""),
|
||||
checkbox-unchecked: string.unquote("\"\\") + string.unquote("f108\""),
|
||||
color-picker: string.unquote("\"\\") + string.unquote("f109\""),
|
||||
columns: string.unquote("\"\\") + string.unquote("f10a\""),
|
||||
contracted: string.unquote("\"\\") + string.unquote("f10b\""),
|
||||
copy: string.unquote("\"\\") + string.unquote("f10c\""),
|
||||
cross: string.unquote("\"\\") + string.unquote("f10d\""),
|
||||
csv: string.unquote("\"\\") + string.unquote("f10e\""),
|
||||
cut: string.unquote("\"\\") + string.unquote("f10f\""),
|
||||
desc: string.unquote("\"\\") + string.unquote("f110\""),
|
||||
excel: string.unquote("\"\\") + string.unquote("f111\""),
|
||||
expanded: string.unquote("\"\\") + string.unquote("f112\""),
|
||||
eye-slash: string.unquote("\"\\") + string.unquote("f113\""),
|
||||
eye: string.unquote("\"\\") + string.unquote("f114\""),
|
||||
filter: string.unquote("\"\\") + string.unquote("f115\""),
|
||||
first: string.unquote("\"\\") + string.unquote("f116\""),
|
||||
grip: string.unquote("\"\\") + string.unquote("f117\""),
|
||||
group: string.unquote("\"\\") + string.unquote("f118\""),
|
||||
last: string.unquote("\"\\") + string.unquote("f119\""),
|
||||
left: string.unquote("\"\\") + string.unquote("f11a\""),
|
||||
linked: string.unquote("\"\\") + string.unquote("f11b\""),
|
||||
loading: string.unquote("\"\\") + string.unquote("f11c\""),
|
||||
maximize: string.unquote("\"\\") + string.unquote("f11d\""),
|
||||
menu: string.unquote("\"\\") + string.unquote("f11e\""),
|
||||
minimize: string.unquote("\"\\") + string.unquote("f11f\""),
|
||||
next: string.unquote("\"\\") + string.unquote("f120\""),
|
||||
none: string.unquote("\"\\") + string.unquote("f121\""),
|
||||
not-allowed: string.unquote("\"\\") + string.unquote("f122\""),
|
||||
paste: string.unquote("\"\\") + string.unquote("f123\""),
|
||||
pin: string.unquote("\"\\") + string.unquote("f124\""),
|
||||
pivot: string.unquote("\"\\") + string.unquote("f125\""),
|
||||
previous: string.unquote("\"\\") + string.unquote("f126\""),
|
||||
radio-button-off: string.unquote("\"\\") + string.unquote("f127\""),
|
||||
radio-button-on: string.unquote("\"\\") + string.unquote("f128\""),
|
||||
right: string.unquote("\"\\") + string.unquote("f129\""),
|
||||
save: string.unquote("\"\\") + string.unquote("f12a\""),
|
||||
small-down: string.unquote("\"\\") + string.unquote("f12b\""),
|
||||
small-left: string.unquote("\"\\") + string.unquote("f12c\""),
|
||||
small-right: string.unquote("\"\\") + string.unquote("f12d\""),
|
||||
small-up: string.unquote("\"\\") + string.unquote("f12e\""),
|
||||
tick: string.unquote("\"\\") + string.unquote("f12f\""),
|
||||
tree-closed: string.unquote("\"\\") + string.unquote("f130\""),
|
||||
tree-indeterminate: string.unquote("\"\\") + string.unquote("f131\""),
|
||||
tree-open: string.unquote("\"\\") + string.unquote("f132\""),
|
||||
unlinked: string.unquote("\"\\") + string.unquote("f133\""),
|
||||
up: string.unquote("\"\\") + string.unquote("f134\""),
|
||||
down: string.unquote("\"\\") + string.unquote("f135\""),
|
||||
plus: string.unquote("\"\\") + string.unquote("f136\""),
|
||||
minus: string.unquote("\"\\") + string.unquote("f137\""),
|
||||
menu-alt: string.unquote("\"\\") + string.unquote("f138\""),
|
||||
settings: string.unquote("\"\\") + string.unquote("f139\""),
|
||||
column-arrow: string.unquote("\"\\") + string.unquote("f13a\""),
|
||||
un-pin: string.unquote("\"\\") + string.unquote("f13b\""),
|
||||
pinned-bottom: string.unquote("\"\\") + string.unquote("f13e\""),
|
||||
pinned-top: string.unquote("\"\\") + string.unquote("f13f\""),
|
||||
chevron-up: string.unquote("\"\\") + string.unquote("f140\""),
|
||||
chevron-down: string.unquote("\"\\") + string.unquote("f141\""),
|
||||
chevron-left: string.unquote("\"\\") + string.unquote("f142\""),
|
||||
chevron-right: string.unquote("\"\\") + string.unquote("f143\""),
|
||||
filter-add: string.unquote("\"\\") + string.unquote("f144\""),
|
||||
edit: string.unquote("\"\\") + string.unquote("f145\""),
|
||||
)
|
||||
@@ -0,0 +1,737 @@
|
||||
//
|
||||
// This file defines the public Sass API to ag-Grid's styles.
|
||||
// https://www.ag-grid.com/javascript-data-grid/theming-v32-customisation-sass/
|
||||
//
|
||||
|
||||
@use 'sass:map';
|
||||
@use 'sass:list';
|
||||
@use 'sass:meta';
|
||||
@use 'sass:string';
|
||||
@use 'sass:color';
|
||||
@use 'sass:math';
|
||||
@use './css-content';
|
||||
@use './icon-font-codes' as *;
|
||||
|
||||
@forward './shared';
|
||||
|
||||
// Emit styles for the grid. This mixin validates the parameters passed to it,
|
||||
// converts the parameters to CSS variables, and combines all the necessary CSS
|
||||
// files for the grid and selected theme.
|
||||
@mixin grid-styles($global-params: ()) {
|
||||
$no-native-widgets: map.get($global-params, 'suppress-native-widget-styling');
|
||||
$global-params: map.remove($global-params, 'suppress-native-widget-styling');
|
||||
|
||||
$themes: -get-themes($global-params);
|
||||
|
||||
@if $no-native-widgets {
|
||||
@include -load-css-file('ag-grid-no-native-widgets.css');
|
||||
} @else {
|
||||
@include -load-css-file('ag-grid.css');
|
||||
}
|
||||
|
||||
$global-extended-theme-name: -clean-theme-name(map.get($global-params, 'extend-theme'));
|
||||
|
||||
@each $theme-name, $theme-params in $themes {
|
||||
@include -validate-params($theme-params, $theme-name);
|
||||
|
||||
@include -load-theme-css-file($theme-name);
|
||||
$extended-theme-name: -get-extended-theme-name($theme-params, $default: $global-extended-theme-name);
|
||||
@if $extended-theme-name and not -is-provided-theme($extended-theme-name) {
|
||||
@error "Invalid extend-theme: \"#{$extended-theme-name}\": only provided themes can be extended, use one of #{meta.inspect(map.keys($-theme-css-files))}";
|
||||
}
|
||||
@if $extended-theme-name and -is-provided-theme($theme-name) {
|
||||
@error "Can't use a provided theme (#{$theme-name}) and also extend a provided theme (#{$extended-theme-name}). If you want to extend #{$extended-theme-name}, provide your own custom theme name.";
|
||||
}
|
||||
@if $extended-theme-name {
|
||||
@include -load-theme-css-file($extended-theme-name);
|
||||
}
|
||||
|
||||
$font: map.get($theme-params, '--ag-icon-font-family');
|
||||
$font: map.get($-theme-fonts, $theme-name) !default;
|
||||
$font: map.get($-theme-fonts, $extended-theme-name) !default;
|
||||
@if $font {
|
||||
@include -load-css-file('#{$font}Font.css', $ignore-missing: true);
|
||||
}
|
||||
}
|
||||
|
||||
@each $theme-name, $theme-params in $themes {
|
||||
$extended-theme-name: -get-extended-theme-name($theme-params, $default: $global-extended-theme-name);
|
||||
|
||||
@if $extended-theme-name and $extended-theme-name != $theme-name {
|
||||
// alias all the styles in the extended theme to the new theme name
|
||||
.ag-theme-#{$theme-name} {
|
||||
@extend .ag-theme-#{$extended-theme-name};
|
||||
}
|
||||
}
|
||||
|
||||
// Emit CSS variable declarations for a set of params, converting (foo: bar) to `--ag-foo: bar`
|
||||
.ag-theme-#{$theme-name} {
|
||||
$color-blend-theme-name: $extended-theme-name;
|
||||
$color-blend-theme-name: $theme-name !default;
|
||||
$blend-function-name: '-theme-#{$color-blend-theme-name}-color-blends';
|
||||
@if meta.function-exists($blend-function-name) {
|
||||
$theme-color-blends: meta.get-function($blend-function-name);
|
||||
$theme-params: meta.call($theme-color-blends, $theme-params);
|
||||
}
|
||||
@if (not -is-quartz($theme-name) and not -is-quartz($extended-theme-name)) {
|
||||
$theme-params: -base-color-blends($theme-params);
|
||||
}
|
||||
|
||||
@each $name, $value in $theme-params {
|
||||
// use meta.inspect to preserve the quote style of strings
|
||||
@if map.has-key($-variable-param-types, $name) {
|
||||
#{$name}: #{meta.inspect($value)};
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// PRIVATE IMPLEMENTATION
|
||||
//
|
||||
|
||||
$-loaded-css-files: ();
|
||||
|
||||
// Fulfils the same role as meta.load-css, which we can't use due to this issue:
|
||||
// https://github.com/sass/dart-sass/issues/1627
|
||||
//
|
||||
// NOTE the above bug was fixed in Sass 1.52.4 in June 2022, this workaround should
|
||||
// be kept as long as we want to support earlier Sass versions
|
||||
@mixin -load-css-file($file, $ignore-missing: false) {
|
||||
@if not map.get($-loaded-css-files, $file) {
|
||||
$-loaded-css-files: map.set($-loaded-css-files, $file, true) !global;
|
||||
@include css-content.output-css-file($file, $ignore-missing: $ignore-missing);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin -load-theme-css-file($theme-name, $ignore-missing: false) {
|
||||
$css-file: map.get($-theme-css-files, $theme-name);
|
||||
@if $css-file {
|
||||
@include -load-css-file($css-file);
|
||||
}
|
||||
}
|
||||
|
||||
@function -clean-theme-name($name) {
|
||||
@if $name == null {
|
||||
@return null;
|
||||
}
|
||||
$name: string.to-lower-case($name);
|
||||
$remove-prefix: 'ag-theme-';
|
||||
@if string.index($name, $remove-prefix) == 1 {
|
||||
$name: string.slice($name, string.length($remove-prefix) + 1);
|
||||
}
|
||||
@return $name;
|
||||
}
|
||||
|
||||
@function -is-quartz($theme) {
|
||||
@return $theme and string.index(-clean-theme-name($theme), 'quartz') == 1;
|
||||
}
|
||||
|
||||
@function -clean-variable-name($name) {
|
||||
@if $name == null {
|
||||
@return null;
|
||||
}
|
||||
$name: string.to-lower-case($name);
|
||||
|
||||
$proposed-variable-name: '--ag-#{$name}';
|
||||
@if map.has-key($-variable-param-types, $proposed-variable-name) {
|
||||
$name: $proposed-variable-name;
|
||||
}
|
||||
|
||||
$remove-prefix: 'ag-theme-';
|
||||
@if string.index($name, $remove-prefix) == 1 {
|
||||
$name: string.slice($name, string.length($remove-prefix) + 1);
|
||||
}
|
||||
@return $name;
|
||||
}
|
||||
|
||||
@function -get-extended-theme-name($theme-params, $default) {
|
||||
$extended-theme-name: -clean-theme-name(map.get($theme-params, 'extend-theme'));
|
||||
@if $extended-theme-name {
|
||||
@return $extended-theme-name;
|
||||
}
|
||||
@return $default;
|
||||
}
|
||||
|
||||
$-theme-variables: (
|
||||
'quartz': (
|
||||
active-color: 'color',
|
||||
),
|
||||
'quartz-dark': (
|
||||
active-color: 'color',
|
||||
),
|
||||
'alpine': (
|
||||
alpine-active-color: 'color',
|
||||
),
|
||||
'alpine-dark': (
|
||||
alpine-active-color: 'color',
|
||||
),
|
||||
'balham': (
|
||||
balham-active-color: 'color',
|
||||
),
|
||||
'balham-dark': (
|
||||
balham-active-color: 'color',
|
||||
),
|
||||
'material': (
|
||||
material-primary-color: 'color',
|
||||
material-accent-color: 'color',
|
||||
),
|
||||
);
|
||||
|
||||
$-theme-css-files: (
|
||||
'quartz': 'ag-theme-quartz-no-font.css',
|
||||
'quartz-dark': 'ag-theme-quartz-no-font.css',
|
||||
'alpine': 'ag-theme-alpine-no-font.css',
|
||||
'alpine-dark': 'ag-theme-alpine-no-font.css',
|
||||
'balham': 'ag-theme-balham-no-font.css',
|
||||
'balham-dark': 'ag-theme-balham-no-font.css',
|
||||
'material': 'ag-theme-material-no-font.css',
|
||||
'material-dark': 'ag-theme-material-no-font.css',
|
||||
);
|
||||
|
||||
$-theme-fonts: (
|
||||
'quartz': 'agGridQuartz',
|
||||
'quartz-dark': 'agGridQuartz',
|
||||
'alpine': 'agGridAlpine',
|
||||
'alpine-dark': 'agGridAlpine',
|
||||
'balham': 'agGridBalham',
|
||||
'balham-dark': 'agGridBalham',
|
||||
'material': 'agGridMaterial',
|
||||
'material-dark': 'agGridMaterial',
|
||||
);
|
||||
|
||||
@function -is-provided-theme($theme-name) {
|
||||
@return map.has-key($-theme-variables, $theme-name);
|
||||
}
|
||||
|
||||
@function -get-themes($params) {
|
||||
$themes: map.get($params, 'themes');
|
||||
$themes: () !default;
|
||||
|
||||
@if meta.type-of($themes) == string {
|
||||
$themes: ($themes); // comma makes this a single element list
|
||||
}
|
||||
|
||||
// treat ("alpine", "balham") as (alpine: (), "balham": ())
|
||||
@if meta.type-of($themes) == list {
|
||||
$themes-list: $themes;
|
||||
$themes: ();
|
||||
@each $theme in $themes-list {
|
||||
$themes: map.set($themes, $theme, ());
|
||||
}
|
||||
}
|
||||
|
||||
@if map.has-key($params, 'theme') {
|
||||
$theme: map.get($params, 'theme');
|
||||
@if meta.type-of($theme) == list {
|
||||
@error "Expected theme to be a string, got a list (if you intend to use multiple themes, use the plural `themes` parameter)";
|
||||
} @else if meta.type-of($theme) != string {
|
||||
@error "Expected theme to be a string, got #{meta.inspect($theme)})";
|
||||
}
|
||||
$themes: map.set($themes, $theme, ());
|
||||
}
|
||||
|
||||
@if list.length($themes) == 0 {
|
||||
$themes: (
|
||||
quartz: (),
|
||||
);
|
||||
}
|
||||
|
||||
$params: map.remove($params, 'theme', 'themes');
|
||||
|
||||
$cleaned: ();
|
||||
@each $name, $extra-params in $themes {
|
||||
$theme-params: internal-preprocess-params(map.merge($params, $extra-params));
|
||||
$cleaned: map.set($cleaned, -clean-theme-name($name), $theme-params);
|
||||
}
|
||||
@return $cleaned;
|
||||
}
|
||||
|
||||
// Return a version of $params with colour blending applied
|
||||
@function -base-color-blends($params) {
|
||||
// Simple defaults. We need to define the defaults for any parameters
|
||||
// that are used in blending below
|
||||
$params: -param-default($params, --ag-foreground-color, #000);
|
||||
$params: -param-default($params, --ag-background-color, #fff);
|
||||
$params: -param-default($params, --ag-range-selection-border-color, --ag-foreground-color);
|
||||
|
||||
// Blended defaults.
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.5);
|
||||
$params: -param-default($params, --ag-modal-overlay-background-color, --ag-background-color, $alpha: 0.66);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-range-selection-background-color,
|
||||
--ag-range-selection-border-color,
|
||||
$alpha: 0.2
|
||||
);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-range-selection-background-color-2,
|
||||
--ag-range-selection-background-color,
|
||||
$self-overlay: 2
|
||||
);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-range-selection-background-color-3,
|
||||
--ag-range-selection-background-color,
|
||||
$self-overlay: 3
|
||||
);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-range-selection-background-color-4,
|
||||
--ag-range-selection-background-color,
|
||||
$self-overlay: 4
|
||||
);
|
||||
$params: -param-default($params, --ag-border-color, --ag-foreground-color, $alpha: 0.25);
|
||||
$params: -param-default($params, --ag-header-column-separator-color, --ag-border-color, $alpha: 0.5);
|
||||
$params: -param-default($params, --ag-header-column-resize-handle-color, --ag-border-color, $alpha: 0.5);
|
||||
$params: -param-default($params, --ag-input-disabled-border-color, --ag-input-border-color, $alpha: 0.3);
|
||||
@return $params;
|
||||
}
|
||||
|
||||
@function -theme-alpine-color-blends($params) {
|
||||
// Simple defaults. We need to define the defaults for any parameters
|
||||
// that are used in blending either below or in the base color blends
|
||||
$params: -param-default($params, --ag-background-color, #fff);
|
||||
$params: -param-default($params, --ag-foreground-color, #181d1f);
|
||||
$params: -param-default($params, --ag-subheader-background-color, #fff);
|
||||
$params: -param-default($params, --ag-alpine-active-color, #2196f3);
|
||||
$params: -param-default($params, --ag-range-selection-border-color, --ag-alpine-active-color);
|
||||
|
||||
// Blended defaults
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-subheader-toolbar-background-color,
|
||||
--ag-subheader-background-color,
|
||||
$alpha: 0.5
|
||||
);
|
||||
$params: -param-default($params, --ag-selected-row-background-color, --ag-alpine-active-color, $alpha: 0.1);
|
||||
$params: -param-default($params, --ag-row-hover-color, --ag-alpine-active-color, $alpha: 0.1);
|
||||
$params: -param-default($params, --ag-column-hover-color, --ag-alpine-active-color, $alpha: 0.1);
|
||||
$params: -param-default($params, --ag-chip-background-color, --ag-foreground-color, $alpha: 0.07);
|
||||
$params: -param-default($params, --ag-input-disabled-background-color, --ag-border-color, $alpha: 0.15);
|
||||
$params: -param-default($params, --ag-input-disabled-border-color, --ag-border-color, $alpha: 0.3);
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.5);
|
||||
$params: -param-default($params, --ag-input-focus-border-color, --ag-alpine-active-color, $alpha: 0.4);
|
||||
@return $params;
|
||||
}
|
||||
|
||||
@function -theme-alpine-dark-color-blends($params) {
|
||||
$params: -param-default($params, --ag-background-color, #181d1f);
|
||||
$params: -param-default($params, --ag-foreground-color, #fff);
|
||||
$params: -param-default($params, --ag-subheader-background-color, #000);
|
||||
|
||||
@return -theme-alpine-color-blends($params);
|
||||
}
|
||||
|
||||
@function -theme-balham-color-blends($params) {
|
||||
// Simple defaults. We need to define the defaults for any parameters
|
||||
// that are used in blending either below or in the base color blends
|
||||
$params: -param-default($params, --ag-background-color, #fff);
|
||||
$params: -param-default($params, --ag-foreground-color, #000);
|
||||
$params: -param-default($params, --ag-border-color, #bdc3c7);
|
||||
$params: -param-default($params, --ag-subheader-background-color, #e2e9eb);
|
||||
$params: -param-default($params, --ag-balham-active-color, #0091ea);
|
||||
$params: -param-default($params, --ag-range-selection-border-color, --ag-balham-active-color);
|
||||
|
||||
// Blended defaults
|
||||
$params: -param-default($params, --ag-secondary-foreground-color, --ag-foreground-color, $alpha: 0.54);
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.38);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-subheader-toolbar-background-color,
|
||||
--ag-subheader-background-color,
|
||||
$alpha: 0.5
|
||||
);
|
||||
$params: -param-default($params, --ag-row-border-color, --ag-border-color, $alpha: 0.58);
|
||||
$params: -param-default($params, --ag-chip-background-color, --ag-foreground-color, $alpha: 0.1);
|
||||
$params: -param-default($params, --ag-selected-row-background-color, --ag-balham-active-color, $alpha: 0.28);
|
||||
$params: -param-default($params, --ag-header-column-separator-color, --ag-border-color, $alpha: 0.5);
|
||||
@return $params;
|
||||
}
|
||||
|
||||
@function -theme-balham-dark-color-blends($params) {
|
||||
$params: -param-default($params, --ag-background-color, #181d1f);
|
||||
$params: -param-default($params, --ag-foreground-color, #fff);
|
||||
$params: -param-default($params, --ag-border-color, #424242);
|
||||
$params: -param-default($params, --ag-subheader-background-color, #000);
|
||||
$params: -param-default($params, --ag-balham-active-color, #00b0ff);
|
||||
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.38);
|
||||
$params: -param-default($params, --ag-header-foreground-color, --ag-foreground-color, $alpha: 0.64);
|
||||
|
||||
@return -theme-balham-color-blends($params);
|
||||
}
|
||||
|
||||
@function -theme-material-color-blends($params) {
|
||||
// Simple defaults. We need to define the defaults for any parameters
|
||||
// that are used in blending either below or in the base color blends
|
||||
$params: -param-default($params, --ag-background-color, #fff);
|
||||
$params: -param-default($params, --ag-foreground-color, rgba(0, 0, 0, 0.87));
|
||||
$params: -param-default($params, --ag-subheader-background-color, #eee);
|
||||
$params: -param-default($params, --ag-material-primary-color, #3f51b5);
|
||||
$params: -param-default($params, --ag-range-selection-border-color, --ag-material-primary-color);
|
||||
$params: -param-default($params, --ag-range-selection-background-color, rgba(122, 134, 203, 0.1));
|
||||
$params: -param-default($params, --ag-border-color, #e2e2e2);
|
||||
|
||||
// Blended defaults
|
||||
$params: -param-default($params, --ag-secondary-foreground-color, --ag-foreground-color, $alpha: 0.54);
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.38);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-subheader-toolbar-background-color,
|
||||
--ag-subheader-background-color,
|
||||
$alpha: 0.5
|
||||
);
|
||||
@return $params;
|
||||
}
|
||||
|
||||
// Apply a default value to a parameter
|
||||
// $params: -param-default($params, x, #f08) - default x to a specific color value
|
||||
// $params: -param-default($params, x, y) - default x to the value of y (if y is set)
|
||||
// $params: -param-default($params, x, y, $alpha: 0.5) - default x to the value of y made 50% transparent
|
||||
@function -param-default($params, $target, $source, $alpha: null, $self-overlay: null) {
|
||||
@if string.index($target, '--ag-') != 1 {
|
||||
@error "Internal error: $target to -param-default should start --ag-";
|
||||
}
|
||||
$value: null;
|
||||
@if meta.type-of($source) == 'color' {
|
||||
$value: $source;
|
||||
} @else {
|
||||
@if string.index($source, '--ag-') != 1 {
|
||||
@error "Internal error: $source to -param-default should start --ag-";
|
||||
}
|
||||
$value: map.get($params, $source);
|
||||
}
|
||||
@if map.has-key($params, $target) or $value == null {
|
||||
@return $params;
|
||||
}
|
||||
@if $alpha != null {
|
||||
$value: color.change($value, $alpha: color.alpha($value) * $alpha);
|
||||
}
|
||||
@if $self-overlay != null {
|
||||
// this formula produces the same opacity value as overlaying the color on top
|
||||
// of itself $self-overlay times
|
||||
$value: color.change($value, $alpha: 1-(math.pow(1 - color.alpha($value), $self-overlay)));
|
||||
}
|
||||
@return map.set($params, $target, $value);
|
||||
}
|
||||
|
||||
$-param-type-descriptions: (
|
||||
'color': 'a CSS color (e.g. `red` or `#fff`)',
|
||||
'length': 'a CSS length (e.g. `0`, `4px` or `50%`)',
|
||||
'border-style': 'a CSS border style (e.g. `dotted` or `solid`)',
|
||||
'duration': 'a number with time duration units (e.g. `3s` or `250ms`)',
|
||||
'border-style-and-size':
|
||||
'either `none`, or a CSS border-style and size (e.g. `solid 1px`), or a boolean (true -> `solid 1px` and false -> `none`)',
|
||||
'border-style-and-color': 'a CSS border-style and color (e.g. `solid red`)',
|
||||
'display': 'A CSS display value (`block` to show, `none` to hide - `true` and `false` are also accepted)',
|
||||
'any': 'any value',
|
||||
);
|
||||
|
||||
// params that are copied to --ag-param-name variables
|
||||
$-variable-param-types: (
|
||||
--ag-foreground-color: 'color',
|
||||
--ag-data-color: 'color',
|
||||
--ag-secondary-foreground-color: 'color',
|
||||
--ag-header-foreground-color: 'color',
|
||||
--ag-disabled-foreground-color: 'color',
|
||||
--ag-background-color: 'color',
|
||||
--ag-header-background-color: 'color',
|
||||
--ag-tooltip-background-color: 'color',
|
||||
--ag-tooltip-error-background-color: 'color',
|
||||
--ag-tooltip-error-text-color: 'color',
|
||||
--ag-tooltip-error-border-color: 'color',
|
||||
--ag-subheader-background-color: 'color',
|
||||
--ag-subheader-toolbar-background-color: 'color',
|
||||
--ag-control-panel-background-color: 'color',
|
||||
--ag-side-button-selected-background-color: 'color',
|
||||
--ag-selected-row-background-color: 'color',
|
||||
--ag-odd-row-background-color: 'color',
|
||||
--ag-modal-overlay-background-color: 'color',
|
||||
--ag-row-hover-color: 'color',
|
||||
--ag-column-hover-color: 'color',
|
||||
--ag-range-selection-border-color: 'color',
|
||||
--ag-range-selection-border-style: 'border-style',
|
||||
--ag-range-selection-background-color: 'color',
|
||||
--ag-range-selection-background-color-2: 'color',
|
||||
--ag-range-selection-background-color-3: 'color',
|
||||
--ag-range-selection-background-color-4: 'color',
|
||||
--ag-range-selection-highlight-color: 'color',
|
||||
--ag-selected-tab-underline-color: 'color',
|
||||
--ag-selected-tab-underline-width: 'length',
|
||||
--ag-selected-tab-underline-transition-speed: 'duration',
|
||||
--ag-range-selection-chart-category-background-color: 'color',
|
||||
--ag-range-selection-chart-background-color: 'color',
|
||||
--ag-header-cell-hover-background-color: 'color',
|
||||
--ag-header-cell-moving-background-color: 'color',
|
||||
--ag-value-change-value-highlight-background-color: 'color',
|
||||
--ag-value-change-delta-up-color: 'color',
|
||||
--ag-value-change-delta-down-color: 'color',
|
||||
--ag-chip-background-color: 'color',
|
||||
--ag-borders: 'border-style-and-size',
|
||||
--ag-border-color: 'color',
|
||||
--ag-borders-critical: 'border-style-and-size',
|
||||
--ag-borders-secondary: 'border-style-and-size',
|
||||
--ag-secondary-border-color: 'color',
|
||||
--ag-row-loading-skeleton-effect-color: 'color',
|
||||
|
||||
--ag-row-border-style: 'border-style',
|
||||
--ag-row-border-width: 'length',
|
||||
--ag-row-border-color: 'color',
|
||||
|
||||
--ag-cell-horizontal-border: 'border-style-and-color',
|
||||
--ag-borders-input: 'border-style-and-size',
|
||||
--ag-input-border-color: 'color',
|
||||
--ag-borders-input-invalid: 'border-style-and-size',
|
||||
--ag-input-border-color-invalid: 'color',
|
||||
--ag-full-row-invalid-background-color: 'color',
|
||||
--ag-borders-side-button: 'border-style-and-size',
|
||||
--ag-border-radius: 'length',
|
||||
--ag-header-column-separator-display: 'display',
|
||||
--ag-header-column-separator-height: 'length',
|
||||
--ag-header-column-separator-width: 'length',
|
||||
--ag-header-column-separator-color: 'color',
|
||||
--ag-header-column-resize-handle-display: 'display',
|
||||
--ag-header-column-resize-handle-height: 'length',
|
||||
--ag-header-column-resize-handle-width: 'length',
|
||||
--ag-header-column-resize-handle-color: 'color',
|
||||
--ag-invalid-color: 'color',
|
||||
--ag-input-disabled-border-color: 'color',
|
||||
--ag-input-disabled-background-color: 'color',
|
||||
--ag-checkbox-background-color: 'color',
|
||||
--ag-checkbox-border-radius: 'length',
|
||||
--ag-checkbox-checked-color: 'color',
|
||||
--ag-checkbox-unchecked-color: 'color',
|
||||
--ag-checkbox-indeterminate-color: 'color',
|
||||
--ag-toggle-button-off-border-color: 'color',
|
||||
--ag-toggle-button-off-background-color: 'color',
|
||||
--ag-toggle-button-on-border-color: 'color',
|
||||
--ag-toggle-button-on-background-color: 'color',
|
||||
--ag-toggle-button-switch-background-color: 'color',
|
||||
--ag-toggle-button-switch-border-color: 'color',
|
||||
--ag-toggle-button-border-width: 'length',
|
||||
--ag-toggle-button-height: 'length',
|
||||
--ag-toggle-button-width: 'length',
|
||||
--ag-input-focus-box-shadow: 'any',
|
||||
--ag-input-error-focus-box-shadow: 'any',
|
||||
--ag-input-focus-border-color: 'color',
|
||||
--ag-minichart-selected-chart-color: 'color',
|
||||
--ag-minichart-selected-page-color: 'color',
|
||||
--ag-grid-size: 'length',
|
||||
--ag-icon-size: 'length',
|
||||
--ag-widget-container-horizontal-padding: 'length',
|
||||
--ag-widget-container-vertical-padding: 'length',
|
||||
--ag-widget-horizontal-spacing: 'length',
|
||||
--ag-widget-vertical-spacing: 'length',
|
||||
--ag-cell-horizontal-padding: 'length',
|
||||
--ag-cell-widget-spacing: 'length',
|
||||
--ag-row-height: 'length',
|
||||
--ag-header-height: 'length',
|
||||
--ag-list-item-height: 'length',
|
||||
--ag-column-select-indent-size: 'length',
|
||||
--ag-set-filter-indent-size: 'length',
|
||||
--ag-advanced-filter-builder-indent-size: 'length',
|
||||
--ag-row-group-indent-size: 'length',
|
||||
--ag-filter-tool-panel-group-indent: 'length',
|
||||
--ag-tab-min-width: 'length',
|
||||
--ag-menu-min-width: 'length',
|
||||
--ag-side-bar-panel-width: 'length',
|
||||
--ag-font-family: 'any',
|
||||
--ag-font-size: 'length',
|
||||
--ag-card-radius: 'length',
|
||||
--ag-card-shadow: 'any',
|
||||
--ag-popup-shadow: 'any',
|
||||
--ag-active-color: 'color',
|
||||
--ag-alpine-active-color: 'color',
|
||||
--ag-balham-active-color: 'color',
|
||||
--ag-material-primary-color: 'color',
|
||||
--ag-material-accent-color: 'color',
|
||||
--ag-icon-font-family: 'any',
|
||||
);
|
||||
|
||||
@each $icon-name in map.keys($icon-font-codes) {
|
||||
$-variable-param-types: map.set($-variable-param-types, '--ag-icon-font-code-#{$icon-name}', 'any');
|
||||
}
|
||||
|
||||
// params that are not copied to CSS variables
|
||||
$-non-variable-param-types: (
|
||||
suppress-native-widget-styling: 'bool',
|
||||
extend-theme: 'string',
|
||||
);
|
||||
|
||||
// Apply Sass API sugar over CSS variable API
|
||||
@function internal-preprocess-params($params) {
|
||||
$processed: ();
|
||||
@each $name, $value in $params {
|
||||
$name: -clean-variable-name($name);
|
||||
$type: map.get($-variable-param-types, $name);
|
||||
// Allow `null` for colours
|
||||
@if $type == 'color' and $value == null {
|
||||
$value: transparent;
|
||||
}
|
||||
// Allow booleans for borders params
|
||||
@if string.index($name, 'borders') and $value == true {
|
||||
$value: solid 1px;
|
||||
}
|
||||
@if string.index($name, 'borders') and $value == false {
|
||||
$value: none;
|
||||
}
|
||||
// Allow booleans for display params
|
||||
@if $type == 'display' and not $value {
|
||||
$value: none;
|
||||
}
|
||||
@if $type == 'display' and $value == true {
|
||||
$value: block;
|
||||
}
|
||||
$processed: map.set($processed, $name, $value);
|
||||
}
|
||||
@return $processed;
|
||||
}
|
||||
|
||||
@mixin -validate-params($params, $theme: null) {
|
||||
$error: internal-get-params-error($params, $theme);
|
||||
@if $error {
|
||||
@error $error;
|
||||
}
|
||||
}
|
||||
|
||||
@function internal-get-params-error($params, $theme: null) {
|
||||
$theme-variables: ();
|
||||
@if $theme and map.has-key($-theme-variables, $theme) {
|
||||
$theme-variables: map.get($-theme-variables, $theme);
|
||||
}
|
||||
|
||||
$param-types: map.merge($-variable-param-types, $theme-variables);
|
||||
$errors: ();
|
||||
@each $name, $value in $params {
|
||||
@if $name == 'suppress-native-widget-styling' {
|
||||
$errors: list.append(
|
||||
$errors,
|
||||
'suppress-native-widget-styling can not be specified at the theme level, only at the top level'
|
||||
);
|
||||
}
|
||||
|
||||
@if -is-runtime-expression($value) {
|
||||
// You can pass variable expressions as values and we'll just trust
|
||||
// that it's an appropriate value because we can't check at compile time
|
||||
} @else {
|
||||
$expected-type: map.get($param-types, $name);
|
||||
@if $expected-type {
|
||||
$is-valid: -validate-value($value, $expected-type);
|
||||
|
||||
@if not $is-valid {
|
||||
$expected: map.get($-param-type-descriptions, $expected-type);
|
||||
$expected: $expected-type !default;
|
||||
$errors: list.append(
|
||||
$errors,
|
||||
'Invalid parameter `#{$name}: #{meta.inspect($value)}` (expected #{$expected})'
|
||||
);
|
||||
}
|
||||
} @else if not map.has-key($-non-variable-param-types, $name) {
|
||||
$errors: list.append($errors, "Unrecognised parameter '#{$name}'");
|
||||
}
|
||||
}
|
||||
}
|
||||
@if list.length($errors) > 0 {
|
||||
$message: '';
|
||||
@each $error in $errors {
|
||||
@if $message == '' {
|
||||
$message: $error;
|
||||
} @else {
|
||||
$message: '#{$message}; #{$error}';
|
||||
}
|
||||
}
|
||||
@if list.length($errors) > 1 {
|
||||
$message: '#{list.length($errors)} errors in #{$theme} parameters: #{$message}';
|
||||
} @else {
|
||||
$message: 'Error in #{$theme} parameters: #{$message}';
|
||||
}
|
||||
@return $message;
|
||||
}
|
||||
@return null;
|
||||
}
|
||||
|
||||
@function -validate-value($value, $expected-type) {
|
||||
$validator-name: '-validate-#{$expected-type}';
|
||||
$validator: meta.get-function($validator-name);
|
||||
@if not $validator {
|
||||
@error "Internal error: no validator function #{$validator-name}";
|
||||
}
|
||||
@return meta.call($validator, $value);
|
||||
}
|
||||
|
||||
@function -is-runtime-expression($value) {
|
||||
$value: string.to-lower-case(meta.inspect($value));
|
||||
@return string.index($value, 'var(') != null or string.index($value, 'calc(') != null;
|
||||
}
|
||||
|
||||
@function -validate-color($value) {
|
||||
@return meta.type-of($value) == 'color';
|
||||
}
|
||||
|
||||
@function -validate-length($value) {
|
||||
@return meta.type-of($value) == 'number' and (unit($value) != '' or $value == 0);
|
||||
}
|
||||
|
||||
$border-styles: (none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset, initial);
|
||||
@function -validate-border-style($value) {
|
||||
$value-preserve-quotes: meta.inspect($value);
|
||||
@return list.index($border-styles, $value-preserve-quotes) != null;
|
||||
}
|
||||
|
||||
@function -validate-duration($value) {
|
||||
@return meta.type-of($value) == 'number' and (unit($value) == 's' or unit($value) == 'ms' or $value == 0);
|
||||
}
|
||||
|
||||
@function -validate-display($value) {
|
||||
@return $value == block or $value == none;
|
||||
}
|
||||
|
||||
@function -validate-border-style-and-size($value) {
|
||||
@return -validate-two-in-any-order($value, 'border-style', 'length');
|
||||
}
|
||||
|
||||
@function -validate-border-style-and-color($value) {
|
||||
@return -validate-two-in-any-order($value, 'border-style', 'color');
|
||||
}
|
||||
|
||||
@function -validate-bool($value) {
|
||||
@return meta.type-of($value) == 'bool';
|
||||
}
|
||||
|
||||
@function -validate-string($value) {
|
||||
@return meta.type-of($value) == 'string';
|
||||
}
|
||||
|
||||
@function -validate-any($value) {
|
||||
@return true;
|
||||
}
|
||||
|
||||
@function -validate-two-in-any-order($value, $type-a, $type-b) {
|
||||
@if meta.type-of($value) == 'string' and $value == 'none' {
|
||||
@return true;
|
||||
}
|
||||
|
||||
@if meta.type-of($value) != 'list' or list.length($value) != 2 {
|
||||
@return false;
|
||||
}
|
||||
|
||||
$value-1: list.nth($value, 1);
|
||||
$value-2: list.nth($value, 2);
|
||||
@return (
|
||||
(-validate-value($value-1, $type-a) and -validate-value($value-2, $type-b)) or
|
||||
(-validate-value($value-2, $type-a) and -validate-value($value-1, $type-b))
|
||||
);
|
||||
}
|
||||
|
||||
// check that we defined all the validator functions
|
||||
@each $variable-name, $type in $-variable-param-types {
|
||||
@if not map.has-key($-param-type-descriptions, $type) {
|
||||
@error "Internal error: missing type description for #{$type} (used on #{$variable-name})";
|
||||
}
|
||||
@if not meta.function-exists('-validate-#{$type}') {
|
||||
@error "Internal error: missing validator function for #{$type} (used on #{$variable-name})";
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
// mixins shared between the our themes and the public API
|
||||
|
||||
// Apply styles to all text fields. Usage:
|
||||
// @include ag.text-input {
|
||||
// border: solid dashed red;
|
||||
// }
|
||||
@mixin text-input {
|
||||
input[class^='ag-']:not([type]),
|
||||
input[class^='ag-'][type='text'],
|
||||
input[class^='ag-'][type='number'],
|
||||
input[class^='ag-'][type='tel'],
|
||||
input[class^='ag-'][type='date'],
|
||||
input[class^='ag-'][type='datetime-local'],
|
||||
textarea[class^='ag-'] {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
+19
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,617 @@
|
||||
.ag-theme-alpine,
|
||||
.ag-theme-alpine-dark,
|
||||
.ag-theme-alpine-auto-dark {
|
||||
--ag-alpine-active-color: #2196f3;
|
||||
--ag-selected-row-background-color: rgba(33, 150, 243, 0.3);
|
||||
--ag-row-hover-color: rgba(33, 150, 243, 0.1);
|
||||
--ag-column-hover-color: rgba(33, 150, 243, 0.1);
|
||||
--ag-input-focus-border-color: rgba(33, 150, 243, 0.4);
|
||||
--ag-range-selection-background-color: rgba(33, 150, 243, 0.2);
|
||||
--ag-range-selection-background-color-2: rgba(33, 150, 243, 0.36);
|
||||
--ag-range-selection-background-color-3: rgba(33, 150, 243, 0.49);
|
||||
--ag-range-selection-background-color-4: rgba(33, 150, 243, 0.59);
|
||||
--ag-row-numbers-selected-color: color-mix(in srgb, transparent, var(--ag-alpine-active-color) 50%);
|
||||
--ag-background-color: #fff;
|
||||
--ag-foreground-color: #181d1f;
|
||||
--ag-border-color: #babfc7;
|
||||
--ag-secondary-border-color: #dde2eb;
|
||||
--ag-header-background-color: #f8f8f8;
|
||||
--ag-tooltip-background-color: #f8f8f8;
|
||||
--ag-odd-row-background-color: #fcfcfc;
|
||||
--ag-control-panel-background-color: #f8f8f8;
|
||||
--ag-subheader-background-color: #fff;
|
||||
--ag-invalid-color: #e02525;
|
||||
--ag-checkbox-unchecked-color: #999;
|
||||
--ag-advanced-filter-join-pill-color: #f08e8d;
|
||||
--ag-advanced-filter-column-pill-color: #a6e194;
|
||||
--ag-advanced-filter-option-pill-color: #f3c08b;
|
||||
--ag-advanced-filter-value-pill-color: #85c0e4;
|
||||
--ag-find-match-color: var(--ag-foreground-color);
|
||||
--ag-find-match-background-color: #ffff00;
|
||||
--ag-find-active-match-color: var(--ag-foreground-color);
|
||||
--ag-find-active-match-background-color: #ffa500;
|
||||
--ag-checkbox-background-color: var(--ag-background-color);
|
||||
--ag-checkbox-checked-color: var(--ag-alpine-active-color);
|
||||
--ag-range-selection-border-color: var(--ag-alpine-active-color);
|
||||
--ag-secondary-foreground-color: var(--ag-foreground-color);
|
||||
--ag-input-border-color: var(--ag-border-color);
|
||||
--ag-input-border-color-invalid: var(--ag-invalid-color);
|
||||
--ag-input-focus-box-shadow: 0 0 2px 0.1rem var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 2px 0.1rem var(--ag-invalid-color);
|
||||
--ag-panel-background-color: var(--ag-header-background-color);
|
||||
--ag-menu-background-color: var(--ag-header-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-background-color: var(--ag-alpine-active-color);
|
||||
--ag-disabled-foreground-color: rgba(24, 29, 31, 0.5);
|
||||
--ag-chip-background-color: rgba(24, 29, 31, 0.07);
|
||||
--ag-input-disabled-border-color: rgba(186, 191, 199, 0.3);
|
||||
--ag-input-disabled-background-color: rgba(186, 191, 199, 0.15);
|
||||
--ag-borders: solid 1px;
|
||||
--ag-border-radius: 3px;
|
||||
--ag-borders-side-button: none;
|
||||
--ag-side-button-selected-background-color: transparent;
|
||||
--ag-header-column-resize-handle-display: block;
|
||||
--ag-header-column-resize-handle-width: 2px;
|
||||
--ag-header-column-resize-handle-height: 30%;
|
||||
--ag-grid-size: 6px;
|
||||
--ag-icon-size: 16px;
|
||||
--ag-row-height: calc(var(--ag-grid-size) * 7);
|
||||
--ag-header-height: calc(var(--ag-grid-size) * 8);
|
||||
--ag-list-item-height: calc(var(--ag-grid-size) * 4);
|
||||
--ag-column-select-indent-size: var(--ag-icon-size);
|
||||
--ag-set-filter-indent-size: var(--ag-icon-size);
|
||||
--ag-advanced-filter-builder-indent-size: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
--ag-cell-horizontal-padding: calc(var(--ag-grid-size) * 3);
|
||||
--ag-cell-widget-spacing: calc(var(--ag-grid-size) * 2);
|
||||
--ag-widget-container-vertical-padding: calc(var(--ag-grid-size) * 2);
|
||||
--ag-widget-container-horizontal-padding: calc(var(--ag-grid-size) * 2);
|
||||
--ag-widget-vertical-spacing: calc(var(--ag-grid-size) * 1.5);
|
||||
--ag-toggle-button-height: 18px;
|
||||
--ag-toggle-button-width: 28px;
|
||||
--ag-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell,
|
||||
"Helvetica Neue", sans-serif;
|
||||
--ag-font-size: 13px;
|
||||
--ag-icon-font-family: agGridAlpine;
|
||||
--ag-selected-tab-underline-color: var(--ag-alpine-active-color);
|
||||
--ag-selected-tab-underline-width: 2px;
|
||||
--ag-selected-tab-underline-transition-speed: 0.3s;
|
||||
--ag-tab-min-width: 240px;
|
||||
--ag-card-shadow: 0 1px 4px 1px rgba(186, 191, 199, 0.4);
|
||||
--ag-popup-shadow: var(--ag-card-shadow);
|
||||
--ag-side-bar-panel-width: 250px;
|
||||
}
|
||||
|
||||
.ag-theme-alpine-dark {
|
||||
--ag-background-color: #181d1f;
|
||||
--ag-foreground-color: #fff;
|
||||
--ag-border-color: #68686e;
|
||||
--ag-secondary-border-color: rgba(88, 86, 82, 0.5);
|
||||
--ag-modal-overlay-background-color: rgba(24, 29, 31, 0.66);
|
||||
--ag-header-background-color: #222628;
|
||||
--ag-tooltip-background-color: #222628;
|
||||
--ag-odd-row-background-color: #222628;
|
||||
--ag-control-panel-background-color: #222628;
|
||||
--ag-subheader-background-color: #000;
|
||||
--ag-input-disabled-background-color: #282c2f;
|
||||
--ag-input-focus-box-shadow: 0 0 2px 0.5px rgba(255, 255, 255, 0.5), 0 0 4px 3px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 2px 0.5px rgba(255, 255, 255, 0.5),
|
||||
0 0 4px 3px color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-card-shadow: 0 1px 20px 1px black;
|
||||
--ag-disabled-foreground-color: rgba(255, 255, 255, 0.5);
|
||||
--ag-chip-background-color: rgba(255, 255, 255, 0.07);
|
||||
--ag-input-disabled-border-color: rgba(104, 104, 110, 0.3);
|
||||
--ag-input-disabled-background-color: rgba(104, 104, 110, 0.07);
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37;
|
||||
--ag-advanced-filter-column-pill-color: #355f2d;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168;
|
||||
--ag-advanced-filter-value-pill-color: #374c86;
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-foreground-color);
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.ag-theme-alpine-auto-dark {
|
||||
--ag-background-color: #181d1f;
|
||||
--ag-foreground-color: #fff;
|
||||
--ag-border-color: #68686e;
|
||||
--ag-secondary-border-color: rgba(88, 86, 82, 0.5);
|
||||
--ag-modal-overlay-background-color: rgba(24, 29, 31, 0.66);
|
||||
--ag-header-background-color: #222628;
|
||||
--ag-tooltip-background-color: #222628;
|
||||
--ag-odd-row-background-color: #222628;
|
||||
--ag-control-panel-background-color: #222628;
|
||||
--ag-subheader-background-color: #000;
|
||||
--ag-input-disabled-background-color: #282c2f;
|
||||
--ag-input-focus-box-shadow: 0 0 2px 0.5px rgba(255, 255, 255, 0.5), 0 0 4px 3px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 2px 0.5px rgba(255, 255, 255, 0.5),
|
||||
0 0 4px 3px color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-card-shadow: 0 1px 20px 1px black;
|
||||
--ag-disabled-foreground-color: rgba(255, 255, 255, 0.5);
|
||||
--ag-chip-background-color: rgba(255, 255, 255, 0.07);
|
||||
--ag-input-disabled-border-color: rgba(104, 104, 110, 0.3);
|
||||
--ag-input-disabled-background-color: rgba(104, 104, 110, 0.07);
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37;
|
||||
--ag-advanced-filter-column-pill-color: #355f2d;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168;
|
||||
--ag-advanced-filter-value-pill-color: #374c86;
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-foreground-color);
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
}
|
||||
.ag-theme-alpine .ag-filter-toolpanel-header,
|
||||
.ag-theme-alpine .ag-filter-toolpanel-search,
|
||||
.ag-theme-alpine .ag-status-bar,
|
||||
.ag-theme-alpine .ag-header-row,
|
||||
.ag-theme-alpine .ag-row-number-cell,
|
||||
.ag-theme-alpine .ag-panel-title-bar-title,
|
||||
.ag-theme-alpine .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-alpine .ag-filter-card-title,
|
||||
.ag-theme-alpine-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-alpine-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-alpine-dark .ag-status-bar,
|
||||
.ag-theme-alpine-dark .ag-header-row,
|
||||
.ag-theme-alpine-dark .ag-row-number-cell,
|
||||
.ag-theme-alpine-dark .ag-panel-title-bar-title,
|
||||
.ag-theme-alpine-dark .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-filter-card-title,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-alpine-auto-dark .ag-status-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-header-row,
|
||||
.ag-theme-alpine-auto-dark .ag-row-number-cell,
|
||||
.ag-theme-alpine-auto-dark .ag-panel-title-bar-title,
|
||||
.ag-theme-alpine-auto-dark .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-card-title {
|
||||
font-weight: 700;
|
||||
color: var(--ag-header-foreground-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-row,
|
||||
.ag-theme-alpine-dark .ag-row,
|
||||
.ag-theme-alpine-auto-dark .ag-row {
|
||||
font-size: calc(var(--ag-font-size) + 1px);
|
||||
}
|
||||
.ag-theme-alpine input[class^=ag-]:not([type]),
|
||||
.ag-theme-alpine input[class^=ag-][type=text],
|
||||
.ag-theme-alpine input[class^=ag-][type=number],
|
||||
.ag-theme-alpine input[class^=ag-][type=tel],
|
||||
.ag-theme-alpine input[class^=ag-][type=date],
|
||||
.ag-theme-alpine input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-alpine textarea[class^=ag-],
|
||||
.ag-theme-alpine-dark input[class^=ag-]:not([type]),
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=text],
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=number],
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=tel],
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=date],
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-alpine-dark textarea[class^=ag-],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-]:not([type]),
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=text],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=number],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=tel],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=date],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-alpine-auto-dark textarea[class^=ag-] {
|
||||
min-height: calc(var(--ag-grid-size) * 4);
|
||||
border-radius: var(--ag-border-radius);
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr input[class^=ag-]:not([type]), .ag-theme-alpine .ag-ltr input[class^=ag-][type=text], .ag-theme-alpine .ag-ltr input[class^=ag-][type=number], .ag-theme-alpine .ag-ltr input[class^=ag-][type=tel], .ag-theme-alpine .ag-ltr input[class^=ag-][type=date], .ag-theme-alpine .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-alpine .ag-ltr textarea[class^=ag-], .ag-theme-alpine-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-alpine-dark .ag-ltr textarea[class^=ag-], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-alpine-auto-dark .ag-ltr textarea[class^=ag-] {
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl input[class^=ag-]:not([type]), .ag-theme-alpine .ag-rtl input[class^=ag-][type=text], .ag-theme-alpine .ag-rtl input[class^=ag-][type=number], .ag-theme-alpine .ag-rtl input[class^=ag-][type=tel], .ag-theme-alpine .ag-rtl input[class^=ag-][type=date], .ag-theme-alpine .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-alpine .ag-rtl textarea[class^=ag-], .ag-theme-alpine-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-alpine-dark .ag-rtl textarea[class^=ag-], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-alpine-auto-dark .ag-rtl textarea[class^=ag-] {
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-tab,
|
||||
.ag-theme-alpine-dark .ag-tab,
|
||||
.ag-theme-alpine-auto-dark .ag-tab {
|
||||
padding: calc(var(--ag-grid-size) * 1.5);
|
||||
transition: color 0.4s;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.ag-theme-alpine .ag-tab-selected,
|
||||
.ag-theme-alpine-dark .ag-tab-selected,
|
||||
.ag-theme-alpine-auto-dark .ag-tab-selected {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-menu,
|
||||
.ag-theme-alpine-dark .ag-menu,
|
||||
.ag-theme-alpine-auto-dark .ag-menu {
|
||||
background-color: var(--ag-control-panel-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-panel-content-wrapper .ag-column-select,
|
||||
.ag-theme-alpine-dark .ag-panel-content-wrapper .ag-column-select,
|
||||
.ag-theme-alpine-auto-dark .ag-panel-content-wrapper .ag-column-select {
|
||||
background-color: var(--ag-control-panel-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-menu-header,
|
||||
.ag-theme-alpine-dark .ag-menu-header,
|
||||
.ag-theme-alpine-auto-dark .ag-menu-header {
|
||||
background-color: var(--ag-control-panel-background-color);
|
||||
padding-top: 1px;
|
||||
}
|
||||
.ag-theme-alpine .ag-tabs-header,
|
||||
.ag-theme-alpine-dark .ag-tabs-header,
|
||||
.ag-theme-alpine-auto-dark .ag-tabs-header {
|
||||
border-bottom: var(--ag-borders) var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-charts-settings-group-title-bar,
|
||||
.ag-theme-alpine .ag-charts-data-group-title-bar,
|
||||
.ag-theme-alpine .ag-charts-format-top-level-group-title-bar,
|
||||
.ag-theme-alpine .ag-charts-advanced-settings-top-level-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-settings-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-data-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-format-top-level-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-advanced-settings-top-level-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-settings-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-data-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-top-level-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-advanced-settings-top-level-group-title-bar {
|
||||
padding: var(--ag-grid-size) calc(var(--ag-grid-size) * 2);
|
||||
line-height: calc(var(--ag-icon-size) + var(--ag-grid-size) - 2px);
|
||||
}
|
||||
.ag-theme-alpine .ag-chart-mini-thumbnail,
|
||||
.ag-theme-alpine-dark .ag-chart-mini-thumbnail,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-mini-thumbnail {
|
||||
background-color: var(--ag-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-chart-settings-nav-bar,
|
||||
.ag-theme-alpine-dark .ag-chart-settings-nav-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-settings-nav-bar {
|
||||
border-top: var(--ag-borders-secondary) var(--ag-secondary-border-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr .ag-group-title-bar-icon, .ag-theme-alpine-dark .ag-ltr .ag-group-title-bar-icon, .ag-theme-alpine-auto-dark .ag-ltr .ag-group-title-bar-icon {
|
||||
margin-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-group-title-bar-icon, .ag-theme-alpine-dark .ag-rtl .ag-group-title-bar-icon, .ag-theme-alpine-auto-dark .ag-rtl .ag-group-title-bar-icon {
|
||||
margin-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-charts-format-top-level-group-toolbar,
|
||||
.ag-theme-alpine .ag-charts-advanced-settings-top-level-group-toolbar,
|
||||
.ag-theme-alpine-dark .ag-charts-format-top-level-group-toolbar,
|
||||
.ag-theme-alpine-dark .ag-charts-advanced-settings-top-level-group-toolbar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-top-level-group-toolbar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-advanced-settings-top-level-group-toolbar {
|
||||
margin-top: var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine .ag-ltr .ag-charts-advanced-settings-top-level-group-toolbar, .ag-theme-alpine-dark .ag-ltr .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine-dark .ag-ltr .ag-charts-advanced-settings-top-level-group-toolbar, .ag-theme-alpine-auto-dark .ag-ltr .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine-auto-dark .ag-ltr .ag-charts-advanced-settings-top-level-group-toolbar {
|
||||
padding-left: calc(var(--ag-icon-size) * 0.5 + var(--ag-grid-size) * 2);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine .ag-rtl .ag-charts-advanced-settings-top-level-group-toolbar, .ag-theme-alpine-dark .ag-rtl .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine-dark .ag-rtl .ag-charts-advanced-settings-top-level-group-toolbar, .ag-theme-alpine-auto-dark .ag-rtl .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine-auto-dark .ag-rtl .ag-charts-advanced-settings-top-level-group-toolbar {
|
||||
padding-right: calc(var(--ag-icon-size) * 0.5 + var(--ag-grid-size) * 2);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-charts-format-sub-level-group,
|
||||
.ag-theme-alpine-dark .ag-charts-format-sub-level-group,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-sub-level-group {
|
||||
border-left: dashed 1px;
|
||||
border-left-color: var(--ag-border-color);
|
||||
padding-left: var(--ag-grid-size);
|
||||
margin-bottom: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-alpine .ag-charts-format-sub-level-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-format-sub-level-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-sub-level-group-title-bar {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
background: none;
|
||||
font-weight: 700;
|
||||
}
|
||||
.ag-theme-alpine .ag-charts-format-sub-level-group-container,
|
||||
.ag-theme-alpine-dark .ag-charts-format-sub-level-group-container,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-sub-level-group-container {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.ag-theme-alpine .ag-charts-format-sub-level-group-item:last-child,
|
||||
.ag-theme-alpine-dark .ag-charts-format-sub-level-group-item:last-child,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-sub-level-group-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.ag-theme-alpine.ag-dnd-ghost,
|
||||
.ag-theme-alpine-dark.ag-dnd-ghost,
|
||||
.ag-theme-alpine-auto-dark.ag-dnd-ghost {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 700;
|
||||
}
|
||||
.ag-theme-alpine .ag-side-buttons,
|
||||
.ag-theme-alpine-dark .ag-side-buttons,
|
||||
.ag-theme-alpine-auto-dark .ag-side-buttons {
|
||||
width: calc(var(--ag-grid-size) * 5);
|
||||
}
|
||||
.ag-theme-alpine .ag-standard-button,
|
||||
.ag-theme-alpine-dark .ag-standard-button,
|
||||
.ag-theme-alpine-auto-dark .ag-standard-button {
|
||||
font-family: inherit;
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
border-radius: var(--ag-border-radius);
|
||||
border: 1px solid;
|
||||
border-color: var(--ag-alpine-active-color);
|
||||
color: var(--ag-alpine-active-color);
|
||||
background-color: var(--ag-background-color);
|
||||
font-weight: 600;
|
||||
padding: var(--ag-grid-size) calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-alpine .ag-standard-button:hover,
|
||||
.ag-theme-alpine-dark .ag-standard-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-standard-button:hover {
|
||||
border-color: var(--ag-alpine-active-color);
|
||||
background-color: var(--ag-row-hover-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-standard-button:active,
|
||||
.ag-theme-alpine-dark .ag-standard-button:active,
|
||||
.ag-theme-alpine-auto-dark .ag-standard-button:active {
|
||||
border-color: var(--ag-alpine-active-color);
|
||||
background-color: var(--ag-alpine-active-color);
|
||||
color: var(--ag-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-standard-button:disabled,
|
||||
.ag-theme-alpine-dark .ag-standard-button:disabled,
|
||||
.ag-theme-alpine-auto-dark .ag-standard-button:disabled {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
background-color: var(--ag-input-disabled-background-color);
|
||||
border-color: var(--ag-input-disabled-border-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-vertical,
|
||||
.ag-theme-alpine-dark .ag-column-drop-vertical,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-vertical {
|
||||
min-height: 75px;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-vertical-title-bar,
|
||||
.ag-theme-alpine-dark .ag-column-drop-vertical-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-vertical-title-bar {
|
||||
padding: calc(var(--ag-grid-size) * 2);
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-alpine-dark .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-vertical-empty-message {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: dashed 1px;
|
||||
border-color: var(--ag-border-color);
|
||||
margin: calc(var(--ag-grid-size) * 2);
|
||||
padding: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-empty-message,
|
||||
.ag-theme-alpine-dark .ag-column-drop-empty-message,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-empty-message {
|
||||
color: var(--ag-foreground-color);
|
||||
opacity: 0.75;
|
||||
}
|
||||
.ag-theme-alpine .ag-pill-select .ag-column-drop,
|
||||
.ag-theme-alpine-dark .ag-pill-select .ag-column-drop,
|
||||
.ag-theme-alpine-auto-dark .ag-pill-select .ag-column-drop {
|
||||
min-height: unset;
|
||||
}
|
||||
.ag-theme-alpine .ag-status-bar,
|
||||
.ag-theme-alpine-dark .ag-status-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-status-bar {
|
||||
font-weight: normal;
|
||||
}
|
||||
.ag-theme-alpine .ag-status-name-value-value,
|
||||
.ag-theme-alpine-dark .ag-status-name-value-value,
|
||||
.ag-theme-alpine-auto-dark .ag-status-name-value-value {
|
||||
font-weight: 700;
|
||||
}
|
||||
.ag-theme-alpine .ag-paging-number,
|
||||
.ag-theme-alpine .ag-paging-row-summary-panel-number,
|
||||
.ag-theme-alpine-dark .ag-paging-number,
|
||||
.ag-theme-alpine-dark .ag-paging-row-summary-panel-number,
|
||||
.ag-theme-alpine-auto-dark .ag-paging-number,
|
||||
.ag-theme-alpine-auto-dark .ag-paging-row-summary-panel-number {
|
||||
font-weight: 700;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-cell-button,
|
||||
.ag-theme-alpine-dark .ag-column-drop-cell-button,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-cell-button {
|
||||
opacity: 0.5;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-cell-button:hover,
|
||||
.ag-theme-alpine-dark .ag-column-drop-cell-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-cell-button:hover {
|
||||
opacity: 0.75;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-alpine .ag-column-select-column-readonly .ag-icon-grip,
|
||||
.ag-theme-alpine-dark .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-alpine-dark .ag-column-select-column-readonly .ag-icon-grip,
|
||||
.ag-theme-alpine-auto-dark .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-alpine-auto-dark .ag-column-select-column-readonly .ag-icon-grip {
|
||||
opacity: 0.35;
|
||||
}
|
||||
.ag-theme-alpine .ag-header-cell-menu-button:hover,
|
||||
.ag-theme-alpine .ag-header-cell-filter-button:hover,
|
||||
.ag-theme-alpine .ag-side-button-button:hover,
|
||||
.ag-theme-alpine .ag-tab:hover,
|
||||
.ag-theme-alpine .ag-panel-title-bar-button:hover,
|
||||
.ag-theme-alpine .ag-header-expand-icon:hover,
|
||||
.ag-theme-alpine .ag-column-group-icons:hover,
|
||||
.ag-theme-alpine .ag-set-filter-group-icons:hover,
|
||||
.ag-theme-alpine .ag-group-expanded .ag-icon:hover,
|
||||
.ag-theme-alpine .ag-group-contracted .ag-icon:hover,
|
||||
.ag-theme-alpine .ag-chart-settings-prev:hover,
|
||||
.ag-theme-alpine .ag-chart-settings-next:hover,
|
||||
.ag-theme-alpine .ag-group-title-bar-icon:hover,
|
||||
.ag-theme-alpine .ag-column-select-header-icon:hover,
|
||||
.ag-theme-alpine .ag-floating-filter-button-button:hover,
|
||||
.ag-theme-alpine .ag-filter-toolpanel-expand:hover,
|
||||
.ag-theme-alpine .ag-chart-menu-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-header-cell-menu-button:hover,
|
||||
.ag-theme-alpine-dark .ag-header-cell-filter-button:hover,
|
||||
.ag-theme-alpine-dark .ag-side-button-button:hover,
|
||||
.ag-theme-alpine-dark .ag-tab:hover,
|
||||
.ag-theme-alpine-dark .ag-panel-title-bar-button:hover,
|
||||
.ag-theme-alpine-dark .ag-header-expand-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-column-group-icons:hover,
|
||||
.ag-theme-alpine-dark .ag-set-filter-group-icons:hover,
|
||||
.ag-theme-alpine-dark .ag-group-expanded .ag-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-group-contracted .ag-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-chart-settings-prev:hover,
|
||||
.ag-theme-alpine-dark .ag-chart-settings-next:hover,
|
||||
.ag-theme-alpine-dark .ag-group-title-bar-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-column-select-header-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-floating-filter-button-button:hover,
|
||||
.ag-theme-alpine-dark .ag-filter-toolpanel-expand:hover,
|
||||
.ag-theme-alpine-dark .ag-chart-menu-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-header-cell-menu-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-header-cell-filter-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-side-button-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-tab:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-panel-title-bar-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-header-expand-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-column-group-icons:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-set-filter-group-icons:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-group-expanded .ag-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-group-contracted .ag-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-settings-prev:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-settings-next:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-group-title-bar-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-column-select-header-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-floating-filter-button-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-toolpanel-expand:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-menu-icon:hover {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-header-cell-menu-button:hover .ag-icon,
|
||||
.ag-theme-alpine .ag-header-cell-filter-button:hover .ag-icon,
|
||||
.ag-theme-alpine .ag-side-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine .ag-panel-title-bar-button:hover .ag-icon,
|
||||
.ag-theme-alpine .ag-floating-filter-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-header-cell-menu-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-header-cell-filter-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-side-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-panel-title-bar-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-floating-filter-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-header-cell-menu-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-header-cell-filter-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-side-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-panel-title-bar-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-floating-filter-button-button:hover .ag-icon {
|
||||
color: inherit;
|
||||
}
|
||||
.ag-theme-alpine .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-alpine-dark .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-active .ag-icon-filter {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-chart-settings-card-item.ag-not-selected:hover,
|
||||
.ag-theme-alpine-dark .ag-chart-settings-card-item.ag-not-selected:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-settings-card-item.ag-not-selected:hover {
|
||||
opacity: 0.35;
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr .ag-panel-title-bar-button, .ag-theme-alpine-dark .ag-ltr .ag-panel-title-bar-button, .ag-theme-alpine-auto-dark .ag-ltr .ag-panel-title-bar-button {
|
||||
margin-left: calc(var(--ag-grid-size) * 2);
|
||||
margin-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-panel-title-bar-button, .ag-theme-alpine-dark .ag-rtl .ag-panel-title-bar-button, .ag-theme-alpine-auto-dark .ag-rtl .ag-panel-title-bar-button {
|
||||
margin-right: calc(var(--ag-grid-size) * 2);
|
||||
margin-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-ltr .ag-filter-toolpanel-group-container, .ag-theme-alpine-dark .ag-ltr .ag-filter-toolpanel-group-container, .ag-theme-alpine-auto-dark .ag-ltr .ag-filter-toolpanel-group-container {
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-filter-toolpanel-group-container, .ag-theme-alpine-dark .ag-rtl .ag-filter-toolpanel-group-container, .ag-theme-alpine-auto-dark .ag-rtl .ag-filter-toolpanel-group-container {
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-filter-toolpanel-instance-filter,
|
||||
.ag-theme-alpine-dark .ag-filter-toolpanel-instance-filter,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-toolpanel-instance-filter {
|
||||
border: none;
|
||||
background-color: var(--ag-control-panel-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr .ag-filter-toolpanel-instance-filter, .ag-theme-alpine-dark .ag-ltr .ag-filter-toolpanel-instance-filter, .ag-theme-alpine-auto-dark .ag-ltr .ag-filter-toolpanel-instance-filter {
|
||||
border-left: dashed 1px;
|
||||
border-left-color: var(--ag-border-color);
|
||||
margin-left: calc(var(--ag-icon-size) * 0.5);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-filter-toolpanel-instance-filter, .ag-theme-alpine-dark .ag-rtl .ag-filter-toolpanel-instance-filter, .ag-theme-alpine-auto-dark .ag-rtl .ag-filter-toolpanel-instance-filter {
|
||||
border-right: dashed 1px;
|
||||
border-right-color: var(--ag-border-color);
|
||||
margin-right: calc(var(--ag-icon-size) * 0.5);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-set-filter-list,
|
||||
.ag-theme-alpine-dark .ag-set-filter-list,
|
||||
.ag-theme-alpine-auto-dark .ag-set-filter-list {
|
||||
padding-top: calc(var(--ag-grid-size) * 0.5);
|
||||
padding-bottom: calc(var(--ag-grid-size) * 0.5);
|
||||
}
|
||||
.ag-theme-alpine .ag-filter-add-button .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-filter-add-button .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-add-button .ag-icon {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-alpine .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-alpine .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-alpine .ag-layout-print .ag-center-cols-container,
|
||||
.ag-theme-alpine-dark .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-alpine-dark .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-alpine-dark .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-alpine-dark .ag-layout-print .ag-center-cols-container,
|
||||
.ag-theme-alpine-auto-dark .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-alpine-auto-dark .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-alpine-auto-dark .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-alpine-auto-dark .ag-layout-print .ag-center-cols-container {
|
||||
min-height: 150px;
|
||||
}
|
||||
.ag-theme-alpine .ag-date-time-list-page-entry-is-current,
|
||||
.ag-theme-alpine-dark .ag-date-time-list-page-entry-is-current,
|
||||
.ag-theme-alpine-auto-dark .ag-date-time-list-page-entry-is-current {
|
||||
background-color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-advanced-filter-builder-button,
|
||||
.ag-theme-alpine-dark .ag-advanced-filter-builder-button,
|
||||
.ag-theme-alpine-auto-dark .ag-advanced-filter-builder-button {
|
||||
padding: var(--ag-grid-size);
|
||||
font-weight: 600;
|
||||
}
|
||||
.ag-theme-alpine .ag-list-item-hovered::after,
|
||||
.ag-theme-alpine-dark .ag-list-item-hovered::after,
|
||||
.ag-theme-alpine-auto-dark .ag-list-item-hovered::after {
|
||||
background-color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-alpine-dark .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-pill .ag-pill-button:hover {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-header-highlight-before::after,
|
||||
.ag-theme-alpine .ag-header-highlight-after::after,
|
||||
.ag-theme-alpine-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-alpine-dark .ag-header-highlight-after::after,
|
||||
.ag-theme-alpine-auto-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-alpine-auto-dark .ag-header-highlight-after::after {
|
||||
background-color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-alpine .ag-disabled .ag-icon,
|
||||
.ag-theme-alpine .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-alpine [disabled] .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-alpine-dark [disabled] .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-alpine-auto-dark [disabled] .ag-icon {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,400 @@
|
||||
.ag-theme-balham,
|
||||
.ag-theme-balham-dark,
|
||||
.ag-theme-balham-auto-dark {
|
||||
--ag-balham-active-color: #0091ea;
|
||||
--ag-foreground-color: #000;
|
||||
--ag-background-color: #fff;
|
||||
--ag-header-background-color: #f5f7f7;
|
||||
--ag-tooltip-background-color: #cbd0d3;
|
||||
--ag-subheader-background-color: #e2e9eb;
|
||||
--ag-control-panel-background-color: #f5f7f7;
|
||||
--ag-border-color: #bdc3c7;
|
||||
--ag-odd-row-background-color: #fcfdfe;
|
||||
--ag-row-hover-color: #ecf0f1;
|
||||
--ag-column-hover-color: #ecf0f1;
|
||||
--ag-input-border-color: #95a5a6;
|
||||
--ag-invalid-color: #e02525;
|
||||
--ag-input-disabled-background-color: #ebebeb;
|
||||
--ag-checkbox-unchecked-color: #7f8c8d;
|
||||
--ag-input-focus-border-color: #719ece;
|
||||
--ag-advanced-filter-join-pill-color: #f08e8d;
|
||||
--ag-advanced-filter-column-pill-color: #a6e194;
|
||||
--ag-advanced-filter-option-pill-color: #f3c08b;
|
||||
--ag-advanced-filter-value-pill-color: #85c0e4;
|
||||
--ag-find-match-color: var(--ag-foreground-color);
|
||||
--ag-find-match-background-color: #ffff00;
|
||||
--ag-find-active-match-color: var(--ag-foreground-color);
|
||||
--ag-find-active-match-background-color: #ffa500;
|
||||
--ag-input-focus-box-shadow: 0 0 2px 1px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 2px 1px var(--ag-invalid-color);
|
||||
--ag-range-selection-border-color: var(--ag-balham-active-color);
|
||||
--ag-checkbox-checked-color: var(--ag-balham-active-color);
|
||||
--ag-checkbox-background-color: var(--ag-background-color);
|
||||
--ag-panel-background-color: var(--ag-header-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-background-color: var(--ag-balham-active-color);
|
||||
--ag-secondary-foreground-color: rgba(0, 0, 0, 0.54);
|
||||
--ag-disabled-foreground-color: rgba(0, 0, 0, 0.38);
|
||||
--ag-subheader-toolbar-background-color: rgba(226, 233, 235, 0.5);
|
||||
--ag-row-border-color: rgba(189, 195, 199, 0.58);
|
||||
--ag-chip-background-color: rgba(0, 0, 0, 0.1);
|
||||
--ag-range-selection-background-color: rgba(0, 145, 234, 0.2);
|
||||
--ag-range-selection-background-color-2: rgba(0, 145, 234, 0.36);
|
||||
--ag-range-selection-background-color-3: rgba(0, 145, 234, 0.49);
|
||||
--ag-range-selection-background-color-4: rgba(0, 145, 234, 0.59);
|
||||
--ag-selected-row-background-color: rgba(0, 145, 234, 0.28);
|
||||
--ag-header-column-separator-color: rgba(189, 195, 199, 0.5);
|
||||
--ag-input-disabled-border-color: rgba(149, 165, 166, 0.3);
|
||||
--ag-row-numbers-selected-color: color-mix(in srgb, transparent, var(--ag-balham-active-color) 50%);
|
||||
--ag-header-column-separator-display: block;
|
||||
--ag-header-column-separator-height: 50%;
|
||||
--ag-grid-size: 4px;
|
||||
--ag-icon-size: 16px;
|
||||
--ag-row-height: calc(var(--ag-grid-size) * 7);
|
||||
--ag-header-height: calc(var(--ag-grid-size) * 8);
|
||||
--ag-list-item-height: calc(var(--ag-grid-size) * 6);
|
||||
--ag-row-group-indent-size: calc(var(--ag-grid-size) * 3 + var(--ag-icon-size));
|
||||
--ag-cell-horizontal-padding: calc(var(--ag-grid-size) * 3);
|
||||
--ag-input-height: calc(var(--ag-grid-size) * 4);
|
||||
--ag-chart-menu-panel-width: 240px;
|
||||
--ag-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell,
|
||||
"Helvetica Neue", sans-serif;
|
||||
--ag-font-size: 12px;
|
||||
--ag-icon-font-family: agGridBalham;
|
||||
--ag-border-radius: 2px;
|
||||
--ag-checkbox-border-radius: 3px;
|
||||
--ag-card-shadow: none;
|
||||
}
|
||||
|
||||
.ag-theme-balham-dark {
|
||||
--ag-balham-active-color: #00b0ff;
|
||||
--ag-foreground-color: #f5f5f5;
|
||||
--ag-background-color: #2d3436;
|
||||
--ag-header-background-color: #1c1c1c;
|
||||
--ag-tooltip-background-color: #1c1f20;
|
||||
--ag-subheader-background-color: #111;
|
||||
--ag-control-panel-background-color: #202020;
|
||||
--ag-border-color: #424242;
|
||||
--ag-odd-row-background-color: #262c2e;
|
||||
--ag-row-hover-color: #3d4749;
|
||||
--ag-column-hover-color: #3d4749;
|
||||
--ag-input-border-color: #f0f0f0;
|
||||
--ag-input-disabled-background-color: rgba(48, 46, 46, 0.3);
|
||||
--ag-modal-overlay-background-color: rgba(45, 52, 54, 0.66);
|
||||
--ag-checkbox-unchecked-color: #ecf0f1;
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37;
|
||||
--ag-advanced-filter-column-pill-color: #355f2d;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168;
|
||||
--ag-advanced-filter-value-pill-color: #374c86;
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-foreground-color);
|
||||
--ag-secondary-foreground-color: var(--ag-foreground-color);
|
||||
--ag-disabled-foreground-color: rgba(245, 245, 245, 0.38);
|
||||
--ag-subheader-toolbar-background-color: rgba(17, 17, 17, 0.5);
|
||||
--ag-row-border-color: #5c5c5c;
|
||||
--ag-chip-background-color: rgba(245, 245, 245, 0.08);
|
||||
--ag-range-selection-background-color: rgba(0, 176, 255, 0.2);
|
||||
--ag-range-selection-background-color-2: rgba(0, 176, 255, 0.36);
|
||||
--ag-range-selection-background-color-3: rgba(0, 176, 255, 0.49);
|
||||
--ag-range-selection-background-color-4: rgba(0, 176, 255, 0.59);
|
||||
--ag-selected-row-background-color: rgba(0, 176, 255, 0.28);
|
||||
--ag-header-column-separator-color: rgba(66, 66, 66, 0.5);
|
||||
--ag-input-disabled-border-color: rgba(240, 240, 240, 0.3);
|
||||
--ag-header-foreground-color: rgba(245, 245, 245, 0.64);
|
||||
--ag-toggle-button-off-background-color: transparent;
|
||||
--ag-toggle-button-off-border-color: var(--ag-foreground-color);
|
||||
--ag-range-selection-chart-category-background-color: rgba(26, 177, 74, 0.5);
|
||||
--ag-range-selection-chart-background-color: rgba(45, 166, 255, 0.5);
|
||||
--ag-input-focus-box-shadow: 0 0 4px 1.5px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 4px 1.5px
|
||||
color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.ag-theme-balham-auto-dark {
|
||||
--ag-balham-active-color: #00b0ff;
|
||||
--ag-foreground-color: #f5f5f5;
|
||||
--ag-background-color: #2d3436;
|
||||
--ag-header-background-color: #1c1c1c;
|
||||
--ag-tooltip-background-color: #1c1f20;
|
||||
--ag-subheader-background-color: #111;
|
||||
--ag-control-panel-background-color: #202020;
|
||||
--ag-border-color: #424242;
|
||||
--ag-odd-row-background-color: #262c2e;
|
||||
--ag-row-hover-color: #3d4749;
|
||||
--ag-column-hover-color: #3d4749;
|
||||
--ag-input-border-color: #f0f0f0;
|
||||
--ag-input-disabled-background-color: rgba(48, 46, 46, 0.3);
|
||||
--ag-modal-overlay-background-color: rgba(45, 52, 54, 0.66);
|
||||
--ag-checkbox-unchecked-color: #ecf0f1;
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37;
|
||||
--ag-advanced-filter-column-pill-color: #355f2d;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168;
|
||||
--ag-advanced-filter-value-pill-color: #374c86;
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-foreground-color);
|
||||
--ag-secondary-foreground-color: var(--ag-foreground-color);
|
||||
--ag-disabled-foreground-color: rgba(245, 245, 245, 0.38);
|
||||
--ag-subheader-toolbar-background-color: rgba(17, 17, 17, 0.5);
|
||||
--ag-row-border-color: #5c5c5c;
|
||||
--ag-chip-background-color: rgba(245, 245, 245, 0.08);
|
||||
--ag-range-selection-background-color: rgba(0, 176, 255, 0.2);
|
||||
--ag-range-selection-background-color-2: rgba(0, 176, 255, 0.36);
|
||||
--ag-range-selection-background-color-3: rgba(0, 176, 255, 0.49);
|
||||
--ag-range-selection-background-color-4: rgba(0, 176, 255, 0.59);
|
||||
--ag-selected-row-background-color: rgba(0, 176, 255, 0.28);
|
||||
--ag-header-column-separator-color: rgba(66, 66, 66, 0.5);
|
||||
--ag-input-disabled-border-color: rgba(240, 240, 240, 0.3);
|
||||
--ag-header-foreground-color: rgba(245, 245, 245, 0.64);
|
||||
--ag-toggle-button-off-background-color: transparent;
|
||||
--ag-toggle-button-off-border-color: var(--ag-foreground-color);
|
||||
--ag-range-selection-chart-category-background-color: rgba(26, 177, 74, 0.5);
|
||||
--ag-range-selection-chart-background-color: rgba(45, 166, 255, 0.5);
|
||||
--ag-input-focus-box-shadow: 0 0 4px 1.5px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 4px 1.5px
|
||||
color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
}
|
||||
.ag-theme-balham .ag-filter-toolpanel-header,
|
||||
.ag-theme-balham .ag-filter-toolpanel-search,
|
||||
.ag-theme-balham .ag-status-bar,
|
||||
.ag-theme-balham .ag-header-row,
|
||||
.ag-theme-balham .ag-row-number-cell,
|
||||
.ag-theme-balham .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-balham-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-balham-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-balham-dark .ag-status-bar,
|
||||
.ag-theme-balham-dark .ag-header-row,
|
||||
.ag-theme-balham-dark .ag-row-number-cell,
|
||||
.ag-theme-balham-dark .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-balham-auto-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-balham-auto-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-balham-auto-dark .ag-status-bar,
|
||||
.ag-theme-balham-auto-dark .ag-header-row,
|
||||
.ag-theme-balham-auto-dark .ag-row-number-cell,
|
||||
.ag-theme-balham-auto-dark .ag-multi-filter-group-title-bar {
|
||||
font-weight: 600;
|
||||
color: var(--ag-header-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-ltr input[class^=ag-]:not([type]), .ag-theme-balham .ag-ltr input[class^=ag-][type=text], .ag-theme-balham .ag-ltr input[class^=ag-][type=number], .ag-theme-balham .ag-ltr input[class^=ag-][type=tel], .ag-theme-balham .ag-ltr input[class^=ag-][type=date], .ag-theme-balham .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-balham .ag-ltr textarea[class^=ag-], .ag-theme-balham-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-balham-dark .ag-ltr textarea[class^=ag-], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-balham-auto-dark .ag-ltr textarea[class^=ag-] {
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-balham .ag-rtl input[class^=ag-]:not([type]), .ag-theme-balham .ag-rtl input[class^=ag-][type=text], .ag-theme-balham .ag-rtl input[class^=ag-][type=number], .ag-theme-balham .ag-rtl input[class^=ag-][type=tel], .ag-theme-balham .ag-rtl input[class^=ag-][type=date], .ag-theme-balham .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-balham .ag-rtl textarea[class^=ag-], .ag-theme-balham-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-balham-dark .ag-rtl textarea[class^=ag-], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-balham-auto-dark .ag-rtl textarea[class^=ag-] {
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-balham .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-balham .ag-status-bar,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-balham-dark .ag-status-bar,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-balham-auto-dark .ag-status-bar {
|
||||
font-weight: 600;
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-balham.ag-dnd-ghost,
|
||||
.ag-theme-balham-dark.ag-dnd-ghost,
|
||||
.ag-theme-balham-auto-dark.ag-dnd-ghost {
|
||||
font-size: var(--ag-font-size);
|
||||
font-weight: 600;
|
||||
}
|
||||
.ag-theme-balham .ag-tab,
|
||||
.ag-theme-balham-dark .ag-tab,
|
||||
.ag-theme-balham-auto-dark .ag-tab {
|
||||
border: 1px solid transparent;
|
||||
padding: var(--ag-grid-size) calc(var(--ag-grid-size) * 2);
|
||||
margin: var(--ag-grid-size);
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
.ag-theme-balham .ag-tab-selected,
|
||||
.ag-theme-balham-dark .ag-tab-selected,
|
||||
.ag-theme-balham-auto-dark .ag-tab-selected {
|
||||
background-color: var(--ag-background-color);
|
||||
border-color: var(--ag-border-color);
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
.ag-theme-balham .ag-tabs-header,
|
||||
.ag-theme-balham-dark .ag-tabs-header,
|
||||
.ag-theme-balham-auto-dark .ag-tabs-header {
|
||||
border-bottom: 1px solid var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-cell,
|
||||
.ag-theme-balham-dark .ag-column-drop-cell,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-cell {
|
||||
height: calc(var(--ag-grid-size) * 6);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical-title,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-title,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-title {
|
||||
color: var(--ag-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical-cell,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-cell,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-cell {
|
||||
margin-left: calc(var(--ag-grid-size) * 2);
|
||||
margin-right: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical-cell-text,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-cell-text,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-cell-text {
|
||||
margin-left: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical-icon,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-icon,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-icon {
|
||||
color: var(--ag-secondary-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-ltr .ag-column-drop-vertical-empty-message, .ag-theme-balham-dark .ag-ltr .ag-column-drop-vertical-empty-message, .ag-theme-balham-auto-dark .ag-ltr .ag-column-drop-vertical-empty-message {
|
||||
padding-left: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-balham .ag-rtl .ag-column-drop-vertical-empty-message, .ag-theme-balham-dark .ag-rtl .ag-column-drop-vertical-empty-message, .ag-theme-balham-auto-dark .ag-rtl .ag-column-drop-vertical-empty-message {
|
||||
padding-right: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-balham .ag-column-drop-horizontal,
|
||||
.ag-theme-balham-dark .ag-column-drop-horizontal,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-horizontal {
|
||||
height: var(--ag-header-height);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-empty,
|
||||
.ag-theme-balham-dark .ag-column-drop-empty,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-empty {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-horizontal-cell-text,
|
||||
.ag-theme-balham-dark .ag-column-drop-horizontal-cell-text,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-horizontal-cell-text {
|
||||
margin-left: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical {
|
||||
padding-top: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-balham .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-balham .ag-column-select-column-readonly .ag-icon-grip,
|
||||
.ag-theme-balham-dark .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-balham-dark .ag-column-select-column-readonly .ag-icon-grip,
|
||||
.ag-theme-balham-auto-dark .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-balham-auto-dark .ag-column-select-column-readonly .ag-icon-grip {
|
||||
opacity: 0.35;
|
||||
}
|
||||
.ag-theme-balham .ag-menu-header,
|
||||
.ag-theme-balham-dark .ag-menu-header,
|
||||
.ag-theme-balham-auto-dark .ag-menu-header {
|
||||
background-color: var(--ag-header-background-color);
|
||||
}
|
||||
.ag-theme-balham .ag-overlay-loading-center,
|
||||
.ag-theme-balham-dark .ag-overlay-loading-center,
|
||||
.ag-theme-balham-auto-dark .ag-overlay-loading-center {
|
||||
background-color: var(--ag-background-color);
|
||||
border: 1px solid var(--ag-border-color);
|
||||
color: var(--ag-foreground-color);
|
||||
padding: calc(var(--ag-grid-size) * 4);
|
||||
}
|
||||
.ag-theme-balham .ag-tooltip,
|
||||
.ag-theme-balham-dark .ag-tooltip,
|
||||
.ag-theme-balham-auto-dark .ag-tooltip {
|
||||
border: none;
|
||||
}
|
||||
.ag-theme-balham .ag-panel-title-bar-button-icon,
|
||||
.ag-theme-balham-dark .ag-panel-title-bar-button-icon,
|
||||
.ag-theme-balham-auto-dark .ag-panel-title-bar-button-icon {
|
||||
font-size: calc(var(--ag-icon-size) + var(--ag-grid-size));
|
||||
}
|
||||
.ag-theme-balham .ag-panel,
|
||||
.ag-theme-balham-dark .ag-panel,
|
||||
.ag-theme-balham-auto-dark .ag-panel {
|
||||
background-color: var(--ag-header-background-color);
|
||||
}
|
||||
.ag-theme-balham .ag-chart-data-section,
|
||||
.ag-theme-balham .ag-chart-format-section,
|
||||
.ag-theme-balham .ag-chart-advanced-settings-section,
|
||||
.ag-theme-balham-dark .ag-chart-data-section,
|
||||
.ag-theme-balham-dark .ag-chart-format-section,
|
||||
.ag-theme-balham-dark .ag-chart-advanced-settings-section,
|
||||
.ag-theme-balham-auto-dark .ag-chart-data-section,
|
||||
.ag-theme-balham-auto-dark .ag-chart-format-section,
|
||||
.ag-theme-balham-auto-dark .ag-chart-advanced-settings-section {
|
||||
padding-bottom: calc(var(--ag-grid-size) * 0.5);
|
||||
}
|
||||
.ag-theme-balham .ag-group-toolbar,
|
||||
.ag-theme-balham-dark .ag-group-toolbar,
|
||||
.ag-theme-balham-auto-dark .ag-group-toolbar {
|
||||
background-color: var(--ag-subheader-toolbar-background-color);
|
||||
}
|
||||
.ag-theme-balham .ag-chart-tab,
|
||||
.ag-theme-balham-dark .ag-chart-tab,
|
||||
.ag-theme-balham-auto-dark .ag-chart-tab {
|
||||
padding-top: calc(var(--ag-grid-size) * 0.5);
|
||||
}
|
||||
.ag-theme-balham .ag-charts-format-sub-level-group-item,
|
||||
.ag-theme-balham-dark .ag-charts-format-sub-level-group-item,
|
||||
.ag-theme-balham-auto-dark .ag-charts-format-sub-level-group-item {
|
||||
margin-bottom: calc(var(--ag-grid-size) * 1.5);
|
||||
}
|
||||
.ag-theme-balham .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-balham-dark .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-balham-auto-dark .ag-filter-active .ag-icon-filter {
|
||||
color: var(--ag-balham-active-color);
|
||||
}
|
||||
.ag-theme-balham .ag-color-input input[class^=ag-][type=text].ag-input-field-input,
|
||||
.ag-theme-balham-dark .ag-color-input input[class^=ag-][type=text].ag-input-field-input,
|
||||
.ag-theme-balham-auto-dark .ag-color-input input[class^=ag-][type=text].ag-input-field-input {
|
||||
min-height: calc(var(--ag-icon-size) + 4px);
|
||||
}
|
||||
.ag-theme-balham .ag-list-item-hovered::after,
|
||||
.ag-theme-balham-dark .ag-list-item-hovered::after,
|
||||
.ag-theme-balham-auto-dark .ag-list-item-hovered::after {
|
||||
background-color: var(--ag-balham-active-color);
|
||||
}
|
||||
.ag-theme-balham .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-balham-dark .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-balham-auto-dark .ag-pill .ag-pill-button:hover {
|
||||
color: var(--ag-balham-active-color);
|
||||
}
|
||||
.ag-theme-balham .ag-header-highlight-before::after,
|
||||
.ag-theme-balham .ag-header-highlight-after::after,
|
||||
.ag-theme-balham-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-balham-dark .ag-header-highlight-after::after,
|
||||
.ag-theme-balham-auto-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-balham-auto-dark .ag-header-highlight-after::after {
|
||||
background-color: var(--ag-balham-active-color);
|
||||
}
|
||||
.ag-theme-balham .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-balham .ag-disabled .ag-icon,
|
||||
.ag-theme-balham .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-balham [disabled] .ag-icon,
|
||||
.ag-theme-balham-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-balham-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-balham-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-balham-dark [disabled] .ag-icon,
|
||||
.ag-theme-balham-auto-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-balham-auto-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-balham-auto-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-balham-auto-dark [disabled] .ag-icon {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-filter-panel .ag-standard-button.ag-filter-panel-buttons-apply-button:disabled,
|
||||
.ag-theme-balham-dark .ag-filter-panel .ag-standard-button.ag-filter-panel-buttons-apply-button:disabled,
|
||||
.ag-theme-balham-auto-dark .ag-filter-panel .ag-standard-button.ag-filter-panel-buttons-apply-button:disabled {
|
||||
color: unset;
|
||||
background-color: unset;
|
||||
}
|
||||
.ag-theme-balham .ag-filter-card-title,
|
||||
.ag-theme-balham-dark .ag-filter-card-title,
|
||||
.ag-theme-balham-auto-dark .ag-filter-card-title {
|
||||
font-weight: 600;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,614 @@
|
||||
.ag-theme-material,
|
||||
.ag-theme-material-dark,
|
||||
.ag-theme-material-auto-dark {
|
||||
--ag-material-primary-color: #3f51b5;
|
||||
--ag-material-accent-color: #ff4081;
|
||||
--ag-foreground-color: rgba(0, 0, 0, 0.87);
|
||||
--ag-secondary-foreground-color: rgba(0, 0, 0, 0.54);
|
||||
--ag-disabled-foreground-color: rgba(0, 0, 0, 0.38);
|
||||
--ag-background-color: #fff;
|
||||
--ag-header-background-color: #fff;
|
||||
--ag-tooltip-background-color: #fff;
|
||||
--ag-subheader-background-color: #eee;
|
||||
--ag-subheader-toolbar-background-color: rgba(238, 238, 238, 0.5);
|
||||
--ag-header-cell-hover-background-color: #f2f2f2;
|
||||
--ag-chip-background-color: #e2e2e2;
|
||||
--ag-range-selection-background-color: rgba(122, 134, 203, 0.1);
|
||||
--ag-range-selection-background-color-2: rgba(122, 134, 203, 0.19);
|
||||
--ag-range-selection-background-color-3: rgba(122, 134, 203, 0.27);
|
||||
--ag-range-selection-background-color-4: rgba(122, 134, 203, 0.34);
|
||||
--ag-row-numbers-selected-color: color-mix(in srgb, transparent, var(--ag-material-accent-color) 50%);
|
||||
--ag-range-selection-highlight-color: #fce4ec;
|
||||
--ag-row-hover-color: #fafafa;
|
||||
--ag-column-hover-color: #fafafa;
|
||||
--ag-control-panel-background-color: #fafafa;
|
||||
--ag-selected-row-background-color: rgba(33, 150, 243, 0.3);
|
||||
--ag-checkbox-unchecked-color: #333;
|
||||
--ag-value-change-value-highlight-background-color: #00acc1;
|
||||
--ag-side-button-selected-background-color: transparent;
|
||||
--ag-advanced-filter-join-pill-color: #f08e8d;
|
||||
--ag-advanced-filter-column-pill-color: #a6e194;
|
||||
--ag-advanced-filter-option-pill-color: #f3c08b;
|
||||
--ag-advanced-filter-value-pill-color: #85c0e4;
|
||||
--ag-find-match-color: var(--ag-foreground-color);
|
||||
--ag-find-match-background-color: #ffff00;
|
||||
--ag-find-active-match-color: var(--ag-foreground-color);
|
||||
--ag-find-active-match-background-color: #ffa500;
|
||||
--ag-filter-panel-apply-button-color: var(--ag-material-primary-color);
|
||||
--ag-filter-panel-apply-button-background-color: transparent;
|
||||
--ag-range-selection-border-color: var(--ag-material-primary-color);
|
||||
--ag-checkbox-checked-color: var(--ag-material-accent-color);
|
||||
--ag-borders: none;
|
||||
--ag-borders-critical: solid 1px;
|
||||
--ag-border-color: #e2e2e2;
|
||||
--ag-grid-size: 8px;
|
||||
--ag-icon-size: 18px;
|
||||
--ag-header-height: calc(var(--ag-grid-size) * 7);
|
||||
--ag-row-height: calc(var(--ag-grid-size) * 6);
|
||||
--ag-cell-horizontal-padding: calc(var(--ag-grid-size) * 3);
|
||||
--ag-list-item-height: calc(var(--ag-grid-size) * 4);
|
||||
--ag-row-group-indent-size: calc(var(--ag-grid-size) * 3 + var(--ag-icon-size));
|
||||
--ag-filter-tool-panel-sub-level-row-height: calc(var(--ag-grid-size) * 4);
|
||||
--ag-checkbox-border-radius: 2px;
|
||||
--ag-toggle-button-switch-border-width: 2px;
|
||||
--ag-toggle-button-height: var(--ag-icon-size);
|
||||
--ag-widget-container-horizontal-padding: calc(var(--ag-grid-size) * 1.5);
|
||||
--ag-widget-container-vertical-padding: calc(var(--ag-grid-size) * 2);
|
||||
--ag-widget-vertical-spacing: calc(var(--ag-grid-size) * 1.75);
|
||||
--ag-font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen-Sans, Ubuntu, Cantarell,
|
||||
"Helvetica Neue", sans-serif;
|
||||
--ag-font-size: 13px;
|
||||
--ag-icon-font-family: agGridMaterial;
|
||||
--ag-selected-tab-underline-color: var(--ag-material-primary-color);
|
||||
--ag-selected-tab-underline-width: 2px;
|
||||
--ag-input-focus-border-color: var(--ag-material-primary-color);
|
||||
--ag-input-focus-box-shadow: 0 0 0 5px rgba(32, 33, 36, 0.122);
|
||||
--ag-input-error-focus-box-shadow: 0 0 0 5px
|
||||
color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-card-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
|
||||
0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
||||
--ag-card-radius: 2px;
|
||||
--ag-invalid-color: #e02525;
|
||||
}
|
||||
|
||||
.ag-theme-material-dark {
|
||||
--ag-material-primary-color: #3f51b5;
|
||||
--ag-material-accent-color: #bb86fcff;
|
||||
--ag-range-selection-border-color: var(--ag-material-accent-color);
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-background-color: #121212ff;
|
||||
--ag-foreground-color: #ffffffff;
|
||||
--ag-data-color: #f5f5f5ff;
|
||||
--ag-header-cell-hover-background-color: #000000ff;
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37ff;
|
||||
--ag-advanced-filter-column-pill-color: #355f2dff;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168ff;
|
||||
--ag-advanced-filter-value-pill-color: #374c86ff;
|
||||
--ag-input-disabled-border-color: #3a434eff;
|
||||
--ag-input-disabled-background-color: #68686e12;
|
||||
--ag-selected-row-background-color: #bb86fc33;
|
||||
--ag-row-hover-color: #bb86fc33;
|
||||
--ag-column-hover-color: #f5f5f50d;
|
||||
--ag-range-selection-background-color: #bb86fc1a;
|
||||
--ag-range-selection-background-color-2: #bb86fc30;
|
||||
--ag-range-selection-background-color-3: #bb86fc45;
|
||||
--ag-range-selection-background-color-4: #bb86fc57;
|
||||
--ag-border-color: #383838ff;
|
||||
--ag-secondary-border-color: #383838ff;
|
||||
--ag-header-background-color: #121212ff;
|
||||
--ag-tooltip-background-color: #212b38ff;
|
||||
--ag-odd-row-background-color: #121212ff;
|
||||
--ag-control-panel-background-color: #2c2c2cff;
|
||||
--ag-subheader-background-color: #ffffff0d;
|
||||
--ag-subheader-toolbar-background-color: #2c2c2cff;
|
||||
--ag-invalid-color: #e02525ff;
|
||||
--ag-checkbox-unchecked-color: #797e87ff;
|
||||
--ag-checkbox-background-color: #121212ff;
|
||||
--ag-secondary-foreground-color: #f5f5f5ff;
|
||||
--ag-input-border-color: #383838ff;
|
||||
--ag-input-border-color-invalid: #e02525ff;
|
||||
--ag-disabled-foreground-color: #f5f5f580;
|
||||
--ag-chip-background-color: #22262812;
|
||||
--ag-side-button-selected-background-color: #2c2c2cff;
|
||||
--ag-selected-tab-underline-color: #3f51b5ff;
|
||||
--ag-modal-overlay-background-color: #121212a8;
|
||||
--ag-value-change-delta-up-color: #43a047a8;
|
||||
--ag-value-change-delta-down-color: #e53935ff;
|
||||
--ag-menu-background-color: #2c2c2cff;
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.ag-theme-material-auto-dark {
|
||||
--ag-material-primary-color: #3f51b5;
|
||||
--ag-material-accent-color: #bb86fcff;
|
||||
--ag-range-selection-border-color: var(--ag-material-accent-color);
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-background-color: #121212ff;
|
||||
--ag-foreground-color: #ffffffff;
|
||||
--ag-data-color: #f5f5f5ff;
|
||||
--ag-header-cell-hover-background-color: #000000ff;
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37ff;
|
||||
--ag-advanced-filter-column-pill-color: #355f2dff;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168ff;
|
||||
--ag-advanced-filter-value-pill-color: #374c86ff;
|
||||
--ag-input-disabled-border-color: #3a434eff;
|
||||
--ag-input-disabled-background-color: #68686e12;
|
||||
--ag-selected-row-background-color: #bb86fc33;
|
||||
--ag-row-hover-color: #bb86fc33;
|
||||
--ag-column-hover-color: #f5f5f50d;
|
||||
--ag-range-selection-background-color: #bb86fc1a;
|
||||
--ag-range-selection-background-color-2: #bb86fc30;
|
||||
--ag-range-selection-background-color-3: #bb86fc45;
|
||||
--ag-range-selection-background-color-4: #bb86fc57;
|
||||
--ag-border-color: #383838ff;
|
||||
--ag-secondary-border-color: #383838ff;
|
||||
--ag-header-background-color: #121212ff;
|
||||
--ag-tooltip-background-color: #212b38ff;
|
||||
--ag-odd-row-background-color: #121212ff;
|
||||
--ag-control-panel-background-color: #2c2c2cff;
|
||||
--ag-subheader-background-color: #ffffff0d;
|
||||
--ag-subheader-toolbar-background-color: #2c2c2cff;
|
||||
--ag-invalid-color: #e02525ff;
|
||||
--ag-checkbox-unchecked-color: #797e87ff;
|
||||
--ag-checkbox-background-color: #121212ff;
|
||||
--ag-secondary-foreground-color: #f5f5f5ff;
|
||||
--ag-input-border-color: #383838ff;
|
||||
--ag-input-border-color-invalid: #e02525ff;
|
||||
--ag-disabled-foreground-color: #f5f5f580;
|
||||
--ag-chip-background-color: #22262812;
|
||||
--ag-side-button-selected-background-color: #2c2c2cff;
|
||||
--ag-selected-tab-underline-color: #3f51b5ff;
|
||||
--ag-modal-overlay-background-color: #121212a8;
|
||||
--ag-value-change-delta-up-color: #43a047a8;
|
||||
--ag-value-change-delta-down-color: #e53935ff;
|
||||
--ag-menu-background-color: #2c2c2cff;
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
}
|
||||
.ag-theme-material .ag-filter-toolpanel-header,
|
||||
.ag-theme-material .ag-filter-toolpanel-search,
|
||||
.ag-theme-material .ag-status-bar,
|
||||
.ag-theme-material .ag-header-row,
|
||||
.ag-theme-material .ag-row-number-cell,
|
||||
.ag-theme-material .ag-panel-title-bar-title,
|
||||
.ag-theme-material .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-material-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-material-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-material-dark .ag-status-bar,
|
||||
.ag-theme-material-dark .ag-header-row,
|
||||
.ag-theme-material-dark .ag-row-number-cell,
|
||||
.ag-theme-material-dark .ag-panel-title-bar-title,
|
||||
.ag-theme-material-dark .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-material-auto-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-material-auto-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-material-auto-dark .ag-status-bar,
|
||||
.ag-theme-material-auto-dark .ag-header-row,
|
||||
.ag-theme-material-auto-dark .ag-row-number-cell,
|
||||
.ag-theme-material-auto-dark .ag-panel-title-bar-title,
|
||||
.ag-theme-material-auto-dark .ag-multi-filter-group-title-bar {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 600;
|
||||
color: var(--ag-header-foreground-color);
|
||||
}
|
||||
.ag-theme-material .ag-tab,
|
||||
.ag-theme-material-dark .ag-tab,
|
||||
.ag-theme-material-auto-dark .ag-tab {
|
||||
height: calc(var(--ag-grid-size) * 4.5);
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.ag-theme-material .ag-tabs-header,
|
||||
.ag-theme-material .ag-column-drop-horizontal,
|
||||
.ag-theme-material-dark .ag-tabs-header,
|
||||
.ag-theme-material-dark .ag-column-drop-horizontal,
|
||||
.ag-theme-material-auto-dark .ag-tabs-header,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-horizontal {
|
||||
background-color: var(--ag-subheader-background-color);
|
||||
}
|
||||
.ag-theme-material .ag-tabs-body,
|
||||
.ag-theme-material-dark .ag-tabs-body,
|
||||
.ag-theme-material-auto-dark .ag-tabs-body {
|
||||
padding: calc(var(--ag-grid-size) * 0.5) 0;
|
||||
}
|
||||
.ag-theme-material .ag-tabs-body .ag-menu-list,
|
||||
.ag-theme-material-dark .ag-tabs-body .ag-menu-list,
|
||||
.ag-theme-material-auto-dark .ag-tabs-body .ag-menu-list {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.ag-theme-material .ag-header-cell,
|
||||
.ag-theme-material .ag-header-group-cell,
|
||||
.ag-theme-material-dark .ag-header-cell,
|
||||
.ag-theme-material-dark .ag-header-group-cell,
|
||||
.ag-theme-material-auto-dark .ag-header-cell,
|
||||
.ag-theme-material-auto-dark .ag-header-group-cell {
|
||||
transition: background-color 0.5s;
|
||||
}
|
||||
.ag-theme-material .ag-row-last:not(.ag-row-first) .ag-cell-inline-editing,
|
||||
.ag-theme-material-dark .ag-row-last:not(.ag-row-first) .ag-cell-inline-editing,
|
||||
.ag-theme-material-auto-dark .ag-row-last:not(.ag-row-first) .ag-cell-inline-editing {
|
||||
bottom: 0;
|
||||
}
|
||||
.ag-theme-material .ag-cell-inline-editing,
|
||||
.ag-theme-material-dark .ag-cell-inline-editing,
|
||||
.ag-theme-material-auto-dark .ag-cell-inline-editing {
|
||||
padding: var(--ag-grid-size);
|
||||
height: calc(var(--ag-row-height) + var(--ag-grid-size) * 3);
|
||||
border-color: var(--ag-border-color) !important;
|
||||
}
|
||||
.ag-theme-material .ag-has-focus .ag-cell-inline-editing,
|
||||
.ag-theme-material-dark .ag-has-focus .ag-cell-inline-editing,
|
||||
.ag-theme-material-auto-dark .ag-has-focus .ag-cell-inline-editing {
|
||||
border-color: var(--ag-input-focus-border-color) !important;
|
||||
}
|
||||
.ag-theme-material .ag-column-drop-vertical,
|
||||
.ag-theme-material-dark .ag-column-drop-vertical,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-vertical {
|
||||
border-bottom: solid 1px;
|
||||
border-bottom-color: var(--ag-border-color);
|
||||
padding-top: var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-material .ag-column-drop-vertical.ag-last-column-drop,
|
||||
.ag-theme-material-dark .ag-column-drop-vertical.ag-last-column-drop,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-vertical.ag-last-column-drop {
|
||||
border-bottom: none;
|
||||
}
|
||||
.ag-theme-material .ag-column-drop-vertical-cell,
|
||||
.ag-theme-material-dark .ag-column-drop-vertical-cell,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-vertical-cell {
|
||||
margin-left: 0;
|
||||
}
|
||||
.ag-theme-material .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-material-dark .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-vertical-empty-message {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 600;
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-material .ag-ltr .ag-column-drop-vertical-empty-message, .ag-theme-material-dark .ag-ltr .ag-column-drop-vertical-empty-message, .ag-theme-material-auto-dark .ag-ltr .ag-column-drop-vertical-empty-message {
|
||||
padding-left: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-material .ag-rtl .ag-column-drop-vertical-empty-message, .ag-theme-material-dark .ag-rtl .ag-column-drop-vertical-empty-message, .ag-theme-material-auto-dark .ag-rtl .ag-column-drop-vertical-empty-message {
|
||||
padding-right: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-material .ag-status-bar,
|
||||
.ag-theme-material-dark .ag-status-bar,
|
||||
.ag-theme-material-auto-dark .ag-status-bar {
|
||||
border: solid 1px;
|
||||
border-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material .ag-column-panel-column-select,
|
||||
.ag-theme-material-dark .ag-column-panel-column-select,
|
||||
.ag-theme-material-auto-dark .ag-column-panel-column-select {
|
||||
border-top: solid 1px;
|
||||
border-top-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material .ag-column-select,
|
||||
.ag-theme-material .ag-column-select-header,
|
||||
.ag-theme-material-dark .ag-column-select,
|
||||
.ag-theme-material-dark .ag-column-select-header,
|
||||
.ag-theme-material-auto-dark .ag-column-select,
|
||||
.ag-theme-material-auto-dark .ag-column-select-header {
|
||||
border-bottom: solid 1px;
|
||||
border-bottom-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material .ag-column-select-header,
|
||||
.ag-theme-material-dark .ag-column-select-header,
|
||||
.ag-theme-material-auto-dark .ag-column-select-header {
|
||||
height: var(--ag-header-height);
|
||||
}
|
||||
.ag-theme-material .ag-group-title-bar,
|
||||
.ag-theme-material-dark .ag-group-title-bar,
|
||||
.ag-theme-material-auto-dark .ag-group-title-bar {
|
||||
padding: calc(var(--ag-grid-size) * 0.75) var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-material .ag-charts-format-sub-level-group-title-bar,
|
||||
.ag-theme-material-dark .ag-charts-format-sub-level-group-title-bar,
|
||||
.ag-theme-material-auto-dark .ag-charts-format-sub-level-group-title-bar {
|
||||
padding: calc(var(--ag-grid-size) * 0.5) var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-material .ag-chart-data-section,
|
||||
.ag-theme-material .ag-chart-format-section,
|
||||
.ag-theme-material .ag-chart-advanced-settings-section,
|
||||
.ag-theme-material-dark .ag-chart-data-section,
|
||||
.ag-theme-material-dark .ag-chart-format-section,
|
||||
.ag-theme-material-dark .ag-chart-advanced-settings-section,
|
||||
.ag-theme-material-auto-dark .ag-chart-data-section,
|
||||
.ag-theme-material-auto-dark .ag-chart-format-section,
|
||||
.ag-theme-material-auto-dark .ag-chart-advanced-settings-section {
|
||||
padding-bottom: calc(var(--ag-grid-size) * 0.5);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]),
|
||||
.ag-theme-material input[class^=ag-][type=text],
|
||||
.ag-theme-material input[class^=ag-][type=number],
|
||||
.ag-theme-material input[class^=ag-][type=tel],
|
||||
.ag-theme-material input[class^=ag-][type=date],
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-material textarea[class^=ag-],
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]),
|
||||
.ag-theme-material-dark input[class^=ag-][type=text],
|
||||
.ag-theme-material-dark input[class^=ag-][type=number],
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel],
|
||||
.ag-theme-material-dark input[class^=ag-][type=date],
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-material-dark textarea[class^=ag-],
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text],
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number],
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel],
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date],
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-] {
|
||||
background: transparent;
|
||||
color: var(--ag-foreground-color);
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
padding-bottom: var(--ag-grid-size);
|
||||
border-width: 0;
|
||||
border-radius: 0;
|
||||
border-bottom: 2px solid;
|
||||
border-bottom-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]):not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=text]:not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=number]:not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=tel]:not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=date]:not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]:not(textarea),
|
||||
.ag-theme-material textarea[class^=ag-]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]):not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]:not(textarea),
|
||||
.ag-theme-material-dark textarea[class^=ag-]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]):not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]:not(textarea),
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]:not(textarea) {
|
||||
height: calc(var(--ag-grid-size) * 5);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]):focus,
|
||||
.ag-theme-material input[class^=ag-][type=text]:focus,
|
||||
.ag-theme-material input[class^=ag-][type=number]:focus,
|
||||
.ag-theme-material input[class^=ag-][type=tel]:focus,
|
||||
.ag-theme-material input[class^=ag-][type=date]:focus,
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]:focus,
|
||||
.ag-theme-material textarea[class^=ag-]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]):focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]:focus,
|
||||
.ag-theme-material-dark textarea[class^=ag-]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]):focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]:focus,
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]:focus {
|
||||
border-bottom: 2px solid;
|
||||
border-bottom-color: var(--ag-material-primary-color);
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type])::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=text]::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=number]::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=tel]::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=date]::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]::placeholder,
|
||||
.ag-theme-material textarea[class^=ag-]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type])::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]::placeholder,
|
||||
.ag-theme-material-dark textarea[class^=ag-]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type])::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]::placeholder,
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]::placeholder {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]):disabled,
|
||||
.ag-theme-material input[class^=ag-][type=text]:disabled,
|
||||
.ag-theme-material input[class^=ag-][type=number]:disabled,
|
||||
.ag-theme-material input[class^=ag-][type=tel]:disabled,
|
||||
.ag-theme-material input[class^=ag-][type=date]:disabled,
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]:disabled,
|
||||
.ag-theme-material textarea[class^=ag-]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]):disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]:disabled,
|
||||
.ag-theme-material-dark textarea[class^=ag-]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]):disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]:disabled,
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]:disabled {
|
||||
border-bottom: 1px solid;
|
||||
border-bottom-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]):invalid,
|
||||
.ag-theme-material input[class^=ag-][type=text]:invalid,
|
||||
.ag-theme-material input[class^=ag-][type=number]:invalid,
|
||||
.ag-theme-material input[class^=ag-][type=tel]:invalid,
|
||||
.ag-theme-material input[class^=ag-][type=date]:invalid,
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]:invalid,
|
||||
.ag-theme-material textarea[class^=ag-]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]):invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]:invalid,
|
||||
.ag-theme-material-dark textarea[class^=ag-]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]):invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]:invalid,
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]:invalid {
|
||||
border-width: 0;
|
||||
border-bottom: 1px solid;
|
||||
border-bottom-color: var(--ag-invalid-color);
|
||||
color: var(--ag-invalid-color);
|
||||
}
|
||||
.ag-theme-material .ag-standard-button,
|
||||
.ag-theme-material-dark .ag-standard-button,
|
||||
.ag-theme-material-auto-dark .ag-standard-button {
|
||||
appearance: none;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
color: var(--ag-material-primary-color);
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.ag-theme-material .ag-standard-button:disabled,
|
||||
.ag-theme-material-dark .ag-standard-button:disabled,
|
||||
.ag-theme-material-auto-dark .ag-standard-button:disabled {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
background-color: var(--ag-input-disabled-background-color);
|
||||
border-color: var(--ag-input-disabled-border-color);
|
||||
}
|
||||
.ag-theme-material.ag-dnd-ghost,
|
||||
.ag-theme-material-dark.ag-dnd-ghost,
|
||||
.ag-theme-material-auto-dark.ag-dnd-ghost {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 600;
|
||||
}
|
||||
.ag-theme-material .ag-filter-toolpanel-header,
|
||||
.ag-theme-material-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-material-auto-dark .ag-filter-toolpanel-header {
|
||||
height: calc(var(--ag-grid-size) * 4);
|
||||
}
|
||||
.ag-theme-material .ag-filter-toolpanel-group-level-0-header,
|
||||
.ag-theme-material-dark .ag-filter-toolpanel-group-level-0-header,
|
||||
.ag-theme-material-auto-dark .ag-filter-toolpanel-group-level-0-header {
|
||||
height: calc(var(--ag-grid-size) * 7);
|
||||
}
|
||||
.ag-theme-material .ag-filter-card-title,
|
||||
.ag-theme-material-dark .ag-filter-card-title,
|
||||
.ag-theme-material-auto-dark .ag-filter-card-title {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 600;
|
||||
}
|
||||
.ag-theme-material .ag-filter-panel .ag-standard-button,
|
||||
.ag-theme-material-dark .ag-filter-panel .ag-standard-button,
|
||||
.ag-theme-material-auto-dark .ag-filter-panel .ag-standard-button {
|
||||
padding: var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-material .ag-filter-add-button,
|
||||
.ag-theme-material-dark .ag-filter-add-button,
|
||||
.ag-theme-material-auto-dark .ag-filter-add-button {
|
||||
border-bottom: 2px solid var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-filter-add-button .ag-icon,
|
||||
.ag-theme-material-dark .ag-filter-add-button .ag-icon,
|
||||
.ag-theme-material-auto-dark .ag-filter-add-button .ag-icon {
|
||||
color: var(--ag-material-active-color);
|
||||
}
|
||||
.ag-theme-material .ag-ltr .ag-filter-apply-panel-button, .ag-theme-material .ag-ltr .ag-advanced-filter-apply-button, .ag-theme-material .ag-ltr .ag-advanced-filter-builder-button, .ag-theme-material-dark .ag-ltr .ag-filter-apply-panel-button, .ag-theme-material-dark .ag-ltr .ag-advanced-filter-apply-button, .ag-theme-material-dark .ag-ltr .ag-advanced-filter-builder-button, .ag-theme-material-auto-dark .ag-ltr .ag-filter-apply-panel-button, .ag-theme-material-auto-dark .ag-ltr .ag-advanced-filter-apply-button, .ag-theme-material-auto-dark .ag-ltr .ag-advanced-filter-builder-button {
|
||||
margin-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-material .ag-rtl .ag-filter-apply-panel-button, .ag-theme-material .ag-rtl .ag-advanced-filter-apply-button, .ag-theme-material .ag-rtl .ag-advanced-filter-builder-button, .ag-theme-material-dark .ag-rtl .ag-filter-apply-panel-button, .ag-theme-material-dark .ag-rtl .ag-advanced-filter-apply-button, .ag-theme-material-dark .ag-rtl .ag-advanced-filter-builder-button, .ag-theme-material-auto-dark .ag-rtl .ag-filter-apply-panel-button, .ag-theme-material-auto-dark .ag-rtl .ag-advanced-filter-apply-button, .ag-theme-material-auto-dark .ag-rtl .ag-advanced-filter-builder-button {
|
||||
margin-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-material .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-material .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-material .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-material .ag-layout-print .ag-center-cols-container,
|
||||
.ag-theme-material-dark .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-material-dark .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-material-dark .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-material-dark .ag-layout-print .ag-center-cols-container,
|
||||
.ag-theme-material-auto-dark .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-material-auto-dark .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-material-auto-dark .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-material-auto-dark .ag-layout-print .ag-center-cols-container {
|
||||
min-height: 150px;
|
||||
}
|
||||
.ag-theme-material .ag-picker-field-wrapper:focus-within,
|
||||
.ag-theme-material-dark .ag-picker-field-wrapper:focus-within,
|
||||
.ag-theme-material-auto-dark .ag-picker-field-wrapper:focus-within {
|
||||
box-shadow: 0 0 0 1px var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-rich-select-list,
|
||||
.ag-theme-material-dark .ag-rich-select-list,
|
||||
.ag-theme-material-auto-dark .ag-rich-select-list {
|
||||
box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;
|
||||
}
|
||||
.ag-theme-material .ag-advanced-filter-builder-button-label,
|
||||
.ag-theme-material-dark .ag-advanced-filter-builder-button-label,
|
||||
.ag-theme-material-auto-dark .ag-advanced-filter-builder-button-label {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.ag-theme-material .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-material-dark .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-material-auto-dark .ag-filter-active .ag-icon-filter {
|
||||
color: var(--ag-material-accent-color);
|
||||
}
|
||||
.ag-theme-material .ag-list-item-hovered::after,
|
||||
.ag-theme-material-dark .ag-list-item-hovered::after,
|
||||
.ag-theme-material-auto-dark .ag-list-item-hovered::after {
|
||||
background-color: var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-material-dark .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-material-auto-dark .ag-pill .ag-pill-button:hover {
|
||||
color: var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-header-highlight-before::after,
|
||||
.ag-theme-material .ag-header-highlight-after::after,
|
||||
.ag-theme-material-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-material-dark .ag-header-highlight-after::after,
|
||||
.ag-theme-material-auto-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-material-auto-dark .ag-header-highlight-after::after {
|
||||
background-color: var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-material .ag-disabled .ag-icon,
|
||||
.ag-theme-material .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-material [disabled] .ag-icon,
|
||||
.ag-theme-material-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-material-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-material-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-material-dark [disabled] .ag-icon,
|
||||
.ag-theme-material-auto-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-material-auto-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-material-auto-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-material-auto-dark [disabled] .ag-icon {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
+4
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,30 @@
|
||||
{
|
||||
"$schema": "https://json.schemastore.org/swcrc",
|
||||
"jsc": {
|
||||
"target": "es2017",
|
||||
"parser": {
|
||||
"syntax": "typescript",
|
||||
"decorators": true,
|
||||
"dynamicImport": true
|
||||
},
|
||||
"transform": {
|
||||
"decoratorMetadata": true,
|
||||
"legacyDecorator": true
|
||||
},
|
||||
"keepClassNames": true,
|
||||
"externalHelpers": true,
|
||||
"loose": true
|
||||
},
|
||||
"module": {
|
||||
"type": "es6"
|
||||
},
|
||||
"sourceMaps": "inline",
|
||||
"exclude": [
|
||||
"jest.config.ts",
|
||||
".*\\.spec.tsx?$",
|
||||
".*\\.test.tsx?$",
|
||||
"./src/jest-setup.ts$",
|
||||
"./**/jest-setup.ts$",
|
||||
".*.js$"
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,72 @@
|
||||
# Contributing to AG Grid Enterprise
|
||||
|
||||
AG Grid Enterprise is copyright commercial software. If you provide a PR, you must also state that you agree to the following:
|
||||
|
||||
# Retention of Intellectual Property Rights for AG Grid Enterprise component
|
||||
|
||||
1.DEFINITIONS
|
||||
|
||||
“the Software” means the AG Grid Enterprise software as location the the repository
|
||||
https://github.com/ag-grid/ag-grid-enterprise.
|
||||
|
||||
“Software Rights” means all intellectual property rights inherent in or relating to the Software,
|
||||
which include, but are not limited to, all copyright, patent rights, all rights in relation to registered
|
||||
and unregistered trademarks (including service marks) and confidential information (including trade secrets
|
||||
and know-how)
|
||||
|
||||
2.RETENTION OF INTELLECTUAL PROPERTY RIGHTS
|
||||
|
||||
AG GRID LTD reserve ownership of all software rights for the software. Upon contributing to the software
|
||||
you agree to grant AG GRID LTD all software rights free of charge. You acknowledge that all software rights
|
||||
will belong to AG GRID LTD and will not seek payment. AG GRID LTD reserve the right to do with the software
|
||||
what it wishes. AG GRID LTD is under no obligation as to what it does with the contributed software.
|
||||
|
||||
- [Question or Problem?](#question)
|
||||
- [Issues and Bugs](#issue)
|
||||
- [Feature Requests](#feature)
|
||||
- [Submission Guidelines](#submit)
|
||||
- [Coding Rules](#rules)
|
||||
- [Commit Message Guidelines](#commit)
|
||||
- [Signing the CLA](#cla)
|
||||
|
||||
## <a name="question"></a> Got a Question or Problem?
|
||||
|
||||
Please, do not open issues for general support questions as we want to keep GitHub issues for bug reports and feature requests. You've got much better chances of getting your question answered on [StackOverflow](https://stackoverflow.com/questions/tagged/ag-grid) where the questions should be tagged with tag `ag-grid`.
|
||||
|
||||
If you're using the Enterprise version of AG Grid (ag-grid-enterprise), then you should use our [Support Portal](https://ag-grid.zendesk.com/) - you'll get a much quicker response there. Please contact accounts@ag-grid.com for access.
|
||||
|
||||
To save your and our time we will be systematically closing all the issues that are requests for general support (for AG Grid Community) and redirecting people to StackOverflow.
|
||||
|
||||
## <a name="issue"></a> Found a Bug?
|
||||
|
||||
If you find a bug in the source code, you can help us by
|
||||
[submitting an issue](#submit-issue) to our [GitHub Repository][github].
|
||||
|
||||
## <a name="feature"></a> Missing a Feature?
|
||||
|
||||
You can _request_ a new feature by [submitting an issue](#submit-issue) to our GitHub
|
||||
Repository.
|
||||
|
||||
## <a name="submit"></a> Submission Guidelines
|
||||
|
||||
### <a name="submit-issue"></a> Submitting an Issue
|
||||
|
||||
Before you submit an issue, please search the issue tracker, maybe an issue for your problem already exists and the discussion might inform you of workarounds readily available.
|
||||
|
||||
We want to fix all the issues as soon as possible, but before fixing a bug we need to reproduce and confirm it. In order to reproduce bugs we will systematically ask you to provide a minimal reproduction scenario using http://plnkr.co. Having a live, reproducible scenario gives us wealth of important information without going back & forth to you with additional questions like:
|
||||
|
||||
- version of AG Grid Enterprise used
|
||||
- 3rd-party libraries and their versions
|
||||
- and most importantly - a use-case that fails
|
||||
|
||||
A minimal reproduce scenario using http://plnkr.co/ allows us to quickly confirm a bug (or point out coding problem) as well as confirm that we are fixing the right problem. If plunker is not a suitable way to demonstrate the problem (for example for issues related to our npm packaging), please create a standalone git repository demonstrating the problem.
|
||||
|
||||
We will be insisting on a minimal reproduce scenario in order to save maintainers time and ultimately be able to fix more bugs. Interestingly, from our experience users often find coding problems themselves while preparing a minimal plunk. We understand that sometimes it might be hard to extract essentials bits of code from a larger code-base but we really need to isolate the problem before we can fix it.
|
||||
|
||||
You can file new issues by filling out our [new issue form](https://github.com/ag-grid/ag-grid-enterprise/issues/new).
|
||||
|
||||
[github]: https://github.com/ag-grid/ag-grid-enterprise
|
||||
[jsfiddle]: http://jsfiddle.net
|
||||
[plunker]: http://plnkr.co/edit
|
||||
[runnable]: http://runnable.com
|
||||
[stackoverflow]: http://stackoverflow.com/questions/tagged/ag-grid
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,22 @@
|
||||
# AG Grid Enterprise
|
||||
|
||||
This project contains AG Grid Enterprise features.
|
||||
|
||||
See [www.ag-grid.com](http://www.ag-grid.com) for an overview and full documentation.
|
||||
|
||||
# Frameworks Supported
|
||||
|
||||
Framework specific Getting Started guides:
|
||||
|
||||
[Angular](https://www.ag-grid.com/angular-data-grid/getting-started/) | [Javascript](https://www.ag-grid.com/javascript-grid/getting-started/) | [React](https://www.ag-grid.com/react-data-grid/getting-started/) | [TypeScript](https://www.ag-grid.com/javascript-grid/building-typescript/) | [VueJS](https://www.ag-grid.com/vue-data-grid/getting-started/)
|
||||
|
||||
This is not free software, this software is covered by copyright and to use you need a commercial license.
|
||||
|
||||
See the [LICENSE file](./LICENSE.html) for more info.
|
||||
|
||||
# Issue Reporting
|
||||
|
||||
If you are an Enterprise customer (or are evaluating AG Grid Enterprise) and wish to report a Bug or raise a new Feature Request please do so on our [Support Portal](https://ag-grid.zendesk.com/).
|
||||
|
||||
To Sign Up:
|
||||
Send an email to accounts@ag-grid.com with your license key
|
||||
@@ -0,0 +1 @@
|
||||
Support and Maintenance document is now merged into the licence document. Please see the licence.
|
||||
@@ -0,0 +1,139 @@
|
||||
{
|
||||
"name": "ag-grid-enterprise",
|
||||
"version": "34.1.2",
|
||||
"description": "Advanced Data Grid / Data Table supporting Javascript / Typescript / React / Angular / Vue",
|
||||
"main": "./dist/package/main.cjs.js",
|
||||
"types": "./dist/types/src/main.d.ts",
|
||||
"module": "./dist/package/main.esm.mjs",
|
||||
"exports": {
|
||||
".": {
|
||||
"import": "./dist/package/main.esm.mjs",
|
||||
"types": "./dist/types/src/main.d.ts",
|
||||
"require": "./dist/package/main.cjs.js",
|
||||
"default": "./dist/package/main.cjs.js"
|
||||
},
|
||||
"./styles/ag-grid-no-native-widgets.css": "./styles/ag-grid-no-native-widgets.css",
|
||||
"./styles/ag-grid-no-native-widgets.min.css": "./styles/ag-grid-no-native-widgets.min.css",
|
||||
"./styles/ag-grid.css": "./styles/ag-grid.css",
|
||||
"./styles/ag-grid.min.css": "./styles/ag-grid.min.css",
|
||||
"./styles/ag-theme-alpine-no-font.css": "./styles/ag-theme-alpine-no-font.css",
|
||||
"./styles/ag-theme-alpine-no-font.min.css": "./styles/ag-theme-alpine-no-font.min.css",
|
||||
"./styles/ag-theme-alpine.css": "./styles/ag-theme-alpine.css",
|
||||
"./styles/ag-theme-alpine.min.css": "./styles/ag-theme-alpine.min.css",
|
||||
"./styles/ag-theme-balham-no-font.css": "./styles/ag-theme-balham-no-font.css",
|
||||
"./styles/ag-theme-balham-no-font.min.css": "./styles/ag-theme-balham-no-font.min.css",
|
||||
"./styles/ag-theme-balham.css": "./styles/ag-theme-balham.css",
|
||||
"./styles/ag-theme-balham.min.css": "./styles/ag-theme-balham.min.css",
|
||||
"./styles/ag-theme-material-no-font.css": "./styles/ag-theme-material-no-font.css",
|
||||
"./styles/ag-theme-material-no-font.min.css": "./styles/ag-theme-material-no-font.min.css",
|
||||
"./styles/ag-theme-material.css": "./styles/ag-theme-material.css",
|
||||
"./styles/ag-theme-material.min.css": "./styles/ag-theme-material.min.css",
|
||||
"./styles/ag-theme-quartz-no-font.css": "./styles/ag-theme-quartz-no-font.css",
|
||||
"./styles/ag-theme-quartz-no-font.min.css": "./styles/ag-theme-quartz-no-font.min.css",
|
||||
"./styles/ag-theme-quartz.css": "./styles/ag-theme-quartz.css",
|
||||
"./styles/ag-theme-quartz.min.css": "./styles/ag-theme-quartz.min.css",
|
||||
"./styles/agGridAlpineFont.css": "./styles/agGridAlpineFont.css",
|
||||
"./styles/agGridAlpineFont.min.css": "./styles/agGridAlpineFont.min.css",
|
||||
"./styles/agGridBalhamFont.css": "./styles/agGridBalhamFont.css",
|
||||
"./styles/agGridBalhamFont.min.css": "./styles/agGridBalhamFont.min.css",
|
||||
"./styles/agGridClassicFont.css": "./styles/agGridClassicFont.css",
|
||||
"./styles/agGridClassicFont.min.css": "./styles/agGridClassicFont.min.css",
|
||||
"./styles/agGridMaterialFont.css": "./styles/agGridMaterialFont.css",
|
||||
"./styles/agGridMaterialFont.min.css": "./styles/agGridMaterialFont.min.css",
|
||||
"./styles/agGridQuartzFont.css": "./styles/agGridQuartzFont.css",
|
||||
"./styles/agGridQuartzFont.min.css": "./styles/agGridQuartzFont.min.css",
|
||||
"./styles": "./styles/_index.scss"
|
||||
},
|
||||
"sideEffects": [
|
||||
"./styles/ag-grid-no-native-widgets.css",
|
||||
"./styles/ag-grid-no-native-widgets.min.css",
|
||||
"./styles/ag-grid.css",
|
||||
"./styles/ag-grid.min.css",
|
||||
"./styles/ag-theme-alpine-no-font.css",
|
||||
"./styles/ag-theme-alpine-no-font.min.css",
|
||||
"./styles/ag-theme-alpine.css",
|
||||
"./styles/ag-theme-alpine.min.css",
|
||||
"./styles/ag-theme-balham-no-font.css",
|
||||
"./styles/ag-theme-balham-no-font.min.css",
|
||||
"./styles/ag-theme-balham.css",
|
||||
"./styles/ag-theme-balham.min.css",
|
||||
"./styles/ag-theme-material-no-font.css",
|
||||
"./styles/ag-theme-material-no-font.min.css",
|
||||
"./styles/ag-theme-material.css",
|
||||
"./styles/ag-theme-material.min.css",
|
||||
"./styles/ag-theme-quartz-no-font.css",
|
||||
"./styles/ag-theme-quartz-no-font.min.css",
|
||||
"./styles/ag-theme-quartz.css",
|
||||
"./styles/ag-theme-quartz.min.css",
|
||||
"./styles/agGridAlpineFont.css",
|
||||
"./styles/agGridAlpineFont.min.css",
|
||||
"./styles/agGridBalhamFont.css",
|
||||
"./styles/agGridBalhamFont.min.css",
|
||||
"./styles/agGridClassicFont.css",
|
||||
"./styles/agGridClassicFont.min.css",
|
||||
"./styles/agGridMaterialFont.css",
|
||||
"./styles/agGridMaterialFont.min.css",
|
||||
"./styles/agGridQuartzFont.css",
|
||||
"./styles/agGridQuartzFont.min.css"
|
||||
],
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/ag-grid/ag-grid.git"
|
||||
},
|
||||
"keywords": [
|
||||
"ag",
|
||||
"ag-grid",
|
||||
"datagrid",
|
||||
"data-grid",
|
||||
"datatable",
|
||||
"data-table",
|
||||
"grid",
|
||||
"table",
|
||||
"react",
|
||||
"table",
|
||||
"angular",
|
||||
"angular-component",
|
||||
"react",
|
||||
"react-component",
|
||||
"reactjs",
|
||||
"vue",
|
||||
"vuejs"
|
||||
],
|
||||
"author": "Sean Landsman <sean@thelandsmans.com>",
|
||||
"license": "Commercial",
|
||||
"bugs": {
|
||||
"url": "https://github.com/ag-grid/ag-grid/issues"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions",
|
||||
"not ie >= 0",
|
||||
"not ie_mob >= 0",
|
||||
"not blackberry > 0"
|
||||
],
|
||||
"homepage": "https://www.ag-grid.com/",
|
||||
"dependencies": {
|
||||
"ag-grid-community": "34.1.2"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"ag-charts-community": "12.1.2",
|
||||
"ag-charts-enterprise": "12.1.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"source-map-loader": "^5.0.0",
|
||||
"ag-charts-community": "12.1.2",
|
||||
"ag-charts-enterprise": "12.1.2",
|
||||
"ts-loader": "^9.5.1",
|
||||
"style-loader": "^3.3.4",
|
||||
"css-loader": "^6.10.0",
|
||||
"postcss-loader": "^8.1.0",
|
||||
"webpack-cli": "^5.1.4",
|
||||
"terser-webpack-plugin": "^5.3.10",
|
||||
"postcss-preset-env": "^9.5.0",
|
||||
"@types/jest": "^29.5.0",
|
||||
"jest": "^29.5.0",
|
||||
"jest-environment-jsdom": "^29.7.0",
|
||||
"jest-canvas-mock": "2.5.1",
|
||||
"canvas": "^2.10.2"
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,72 @@
|
||||
|
||||
// THIS FILE IS GENERATED, DO NOT EDIT IT!
|
||||
@use "sass:string";
|
||||
$icon-font-codes: (
|
||||
aggregation: string.unquote("\"\\") + string.unquote("f101\""),
|
||||
arrows: string.unquote("\"\\") + string.unquote("f102\""),
|
||||
asc: string.unquote("\"\\") + string.unquote("f103\""),
|
||||
cancel: string.unquote("\"\\") + string.unquote("f104\""),
|
||||
chart: string.unquote("\"\\") + string.unquote("f105\""),
|
||||
checkbox-checked: string.unquote("\"\\") + string.unquote("f106\""),
|
||||
checkbox-indeterminate: string.unquote("\"\\") + string.unquote("f107\""),
|
||||
checkbox-unchecked: string.unquote("\"\\") + string.unquote("f108\""),
|
||||
color-picker: string.unquote("\"\\") + string.unquote("f109\""),
|
||||
columns: string.unquote("\"\\") + string.unquote("f10a\""),
|
||||
contracted: string.unquote("\"\\") + string.unquote("f10b\""),
|
||||
copy: string.unquote("\"\\") + string.unquote("f10c\""),
|
||||
cross: string.unquote("\"\\") + string.unquote("f10d\""),
|
||||
csv: string.unquote("\"\\") + string.unquote("f10e\""),
|
||||
cut: string.unquote("\"\\") + string.unquote("f10f\""),
|
||||
desc: string.unquote("\"\\") + string.unquote("f110\""),
|
||||
excel: string.unquote("\"\\") + string.unquote("f111\""),
|
||||
expanded: string.unquote("\"\\") + string.unquote("f112\""),
|
||||
eye-slash: string.unquote("\"\\") + string.unquote("f113\""),
|
||||
eye: string.unquote("\"\\") + string.unquote("f114\""),
|
||||
filter: string.unquote("\"\\") + string.unquote("f115\""),
|
||||
first: string.unquote("\"\\") + string.unquote("f116\""),
|
||||
grip: string.unquote("\"\\") + string.unquote("f117\""),
|
||||
group: string.unquote("\"\\") + string.unquote("f118\""),
|
||||
last: string.unquote("\"\\") + string.unquote("f119\""),
|
||||
left: string.unquote("\"\\") + string.unquote("f11a\""),
|
||||
linked: string.unquote("\"\\") + string.unquote("f11b\""),
|
||||
loading: string.unquote("\"\\") + string.unquote("f11c\""),
|
||||
maximize: string.unquote("\"\\") + string.unquote("f11d\""),
|
||||
menu: string.unquote("\"\\") + string.unquote("f11e\""),
|
||||
minimize: string.unquote("\"\\") + string.unquote("f11f\""),
|
||||
next: string.unquote("\"\\") + string.unquote("f120\""),
|
||||
none: string.unquote("\"\\") + string.unquote("f121\""),
|
||||
not-allowed: string.unquote("\"\\") + string.unquote("f122\""),
|
||||
paste: string.unquote("\"\\") + string.unquote("f123\""),
|
||||
pin: string.unquote("\"\\") + string.unquote("f124\""),
|
||||
pivot: string.unquote("\"\\") + string.unquote("f125\""),
|
||||
previous: string.unquote("\"\\") + string.unquote("f126\""),
|
||||
radio-button-off: string.unquote("\"\\") + string.unquote("f127\""),
|
||||
radio-button-on: string.unquote("\"\\") + string.unquote("f128\""),
|
||||
right: string.unquote("\"\\") + string.unquote("f129\""),
|
||||
save: string.unquote("\"\\") + string.unquote("f12a\""),
|
||||
small-down: string.unquote("\"\\") + string.unquote("f12b\""),
|
||||
small-left: string.unquote("\"\\") + string.unquote("f12c\""),
|
||||
small-right: string.unquote("\"\\") + string.unquote("f12d\""),
|
||||
small-up: string.unquote("\"\\") + string.unquote("f12e\""),
|
||||
tick: string.unquote("\"\\") + string.unquote("f12f\""),
|
||||
tree-closed: string.unquote("\"\\") + string.unquote("f130\""),
|
||||
tree-indeterminate: string.unquote("\"\\") + string.unquote("f131\""),
|
||||
tree-open: string.unquote("\"\\") + string.unquote("f132\""),
|
||||
unlinked: string.unquote("\"\\") + string.unquote("f133\""),
|
||||
up: string.unquote("\"\\") + string.unquote("f134\""),
|
||||
down: string.unquote("\"\\") + string.unquote("f135\""),
|
||||
plus: string.unquote("\"\\") + string.unquote("f136\""),
|
||||
minus: string.unquote("\"\\") + string.unquote("f137\""),
|
||||
menu-alt: string.unquote("\"\\") + string.unquote("f138\""),
|
||||
settings: string.unquote("\"\\") + string.unquote("f139\""),
|
||||
column-arrow: string.unquote("\"\\") + string.unquote("f13a\""),
|
||||
un-pin: string.unquote("\"\\") + string.unquote("f13b\""),
|
||||
pinned-bottom: string.unquote("\"\\") + string.unquote("f13e\""),
|
||||
pinned-top: string.unquote("\"\\") + string.unquote("f13f\""),
|
||||
chevron-up: string.unquote("\"\\") + string.unquote("f140\""),
|
||||
chevron-down: string.unquote("\"\\") + string.unquote("f141\""),
|
||||
chevron-left: string.unquote("\"\\") + string.unquote("f142\""),
|
||||
chevron-right: string.unquote("\"\\") + string.unquote("f143\""),
|
||||
filter-add: string.unquote("\"\\") + string.unquote("f144\""),
|
||||
edit: string.unquote("\"\\") + string.unquote("f145\""),
|
||||
)
|
||||
@@ -0,0 +1,737 @@
|
||||
//
|
||||
// This file defines the public Sass API to ag-Grid's styles.
|
||||
// https://www.ag-grid.com/javascript-data-grid/theming-v32-customisation-sass/
|
||||
//
|
||||
|
||||
@use 'sass:map';
|
||||
@use 'sass:list';
|
||||
@use 'sass:meta';
|
||||
@use 'sass:string';
|
||||
@use 'sass:color';
|
||||
@use 'sass:math';
|
||||
@use './css-content';
|
||||
@use './icon-font-codes' as *;
|
||||
|
||||
@forward './shared';
|
||||
|
||||
// Emit styles for the grid. This mixin validates the parameters passed to it,
|
||||
// converts the parameters to CSS variables, and combines all the necessary CSS
|
||||
// files for the grid and selected theme.
|
||||
@mixin grid-styles($global-params: ()) {
|
||||
$no-native-widgets: map.get($global-params, 'suppress-native-widget-styling');
|
||||
$global-params: map.remove($global-params, 'suppress-native-widget-styling');
|
||||
|
||||
$themes: -get-themes($global-params);
|
||||
|
||||
@if $no-native-widgets {
|
||||
@include -load-css-file('ag-grid-no-native-widgets.css');
|
||||
} @else {
|
||||
@include -load-css-file('ag-grid.css');
|
||||
}
|
||||
|
||||
$global-extended-theme-name: -clean-theme-name(map.get($global-params, 'extend-theme'));
|
||||
|
||||
@each $theme-name, $theme-params in $themes {
|
||||
@include -validate-params($theme-params, $theme-name);
|
||||
|
||||
@include -load-theme-css-file($theme-name);
|
||||
$extended-theme-name: -get-extended-theme-name($theme-params, $default: $global-extended-theme-name);
|
||||
@if $extended-theme-name and not -is-provided-theme($extended-theme-name) {
|
||||
@error "Invalid extend-theme: \"#{$extended-theme-name}\": only provided themes can be extended, use one of #{meta.inspect(map.keys($-theme-css-files))}";
|
||||
}
|
||||
@if $extended-theme-name and -is-provided-theme($theme-name) {
|
||||
@error "Can't use a provided theme (#{$theme-name}) and also extend a provided theme (#{$extended-theme-name}). If you want to extend #{$extended-theme-name}, provide your own custom theme name.";
|
||||
}
|
||||
@if $extended-theme-name {
|
||||
@include -load-theme-css-file($extended-theme-name);
|
||||
}
|
||||
|
||||
$font: map.get($theme-params, '--ag-icon-font-family');
|
||||
$font: map.get($-theme-fonts, $theme-name) !default;
|
||||
$font: map.get($-theme-fonts, $extended-theme-name) !default;
|
||||
@if $font {
|
||||
@include -load-css-file('#{$font}Font.css', $ignore-missing: true);
|
||||
}
|
||||
}
|
||||
|
||||
@each $theme-name, $theme-params in $themes {
|
||||
$extended-theme-name: -get-extended-theme-name($theme-params, $default: $global-extended-theme-name);
|
||||
|
||||
@if $extended-theme-name and $extended-theme-name != $theme-name {
|
||||
// alias all the styles in the extended theme to the new theme name
|
||||
.ag-theme-#{$theme-name} {
|
||||
@extend .ag-theme-#{$extended-theme-name};
|
||||
}
|
||||
}
|
||||
|
||||
// Emit CSS variable declarations for a set of params, converting (foo: bar) to `--ag-foo: bar`
|
||||
.ag-theme-#{$theme-name} {
|
||||
$color-blend-theme-name: $extended-theme-name;
|
||||
$color-blend-theme-name: $theme-name !default;
|
||||
$blend-function-name: '-theme-#{$color-blend-theme-name}-color-blends';
|
||||
@if meta.function-exists($blend-function-name) {
|
||||
$theme-color-blends: meta.get-function($blend-function-name);
|
||||
$theme-params: meta.call($theme-color-blends, $theme-params);
|
||||
}
|
||||
@if (not -is-quartz($theme-name) and not -is-quartz($extended-theme-name)) {
|
||||
$theme-params: -base-color-blends($theme-params);
|
||||
}
|
||||
|
||||
@each $name, $value in $theme-params {
|
||||
// use meta.inspect to preserve the quote style of strings
|
||||
@if map.has-key($-variable-param-types, $name) {
|
||||
#{$name}: #{meta.inspect($value)};
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// PRIVATE IMPLEMENTATION
|
||||
//
|
||||
|
||||
$-loaded-css-files: ();
|
||||
|
||||
// Fulfils the same role as meta.load-css, which we can't use due to this issue:
|
||||
// https://github.com/sass/dart-sass/issues/1627
|
||||
//
|
||||
// NOTE the above bug was fixed in Sass 1.52.4 in June 2022, this workaround should
|
||||
// be kept as long as we want to support earlier Sass versions
|
||||
@mixin -load-css-file($file, $ignore-missing: false) {
|
||||
@if not map.get($-loaded-css-files, $file) {
|
||||
$-loaded-css-files: map.set($-loaded-css-files, $file, true) !global;
|
||||
@include css-content.output-css-file($file, $ignore-missing: $ignore-missing);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin -load-theme-css-file($theme-name, $ignore-missing: false) {
|
||||
$css-file: map.get($-theme-css-files, $theme-name);
|
||||
@if $css-file {
|
||||
@include -load-css-file($css-file);
|
||||
}
|
||||
}
|
||||
|
||||
@function -clean-theme-name($name) {
|
||||
@if $name == null {
|
||||
@return null;
|
||||
}
|
||||
$name: string.to-lower-case($name);
|
||||
$remove-prefix: 'ag-theme-';
|
||||
@if string.index($name, $remove-prefix) == 1 {
|
||||
$name: string.slice($name, string.length($remove-prefix) + 1);
|
||||
}
|
||||
@return $name;
|
||||
}
|
||||
|
||||
@function -is-quartz($theme) {
|
||||
@return $theme and string.index(-clean-theme-name($theme), 'quartz') == 1;
|
||||
}
|
||||
|
||||
@function -clean-variable-name($name) {
|
||||
@if $name == null {
|
||||
@return null;
|
||||
}
|
||||
$name: string.to-lower-case($name);
|
||||
|
||||
$proposed-variable-name: '--ag-#{$name}';
|
||||
@if map.has-key($-variable-param-types, $proposed-variable-name) {
|
||||
$name: $proposed-variable-name;
|
||||
}
|
||||
|
||||
$remove-prefix: 'ag-theme-';
|
||||
@if string.index($name, $remove-prefix) == 1 {
|
||||
$name: string.slice($name, string.length($remove-prefix) + 1);
|
||||
}
|
||||
@return $name;
|
||||
}
|
||||
|
||||
@function -get-extended-theme-name($theme-params, $default) {
|
||||
$extended-theme-name: -clean-theme-name(map.get($theme-params, 'extend-theme'));
|
||||
@if $extended-theme-name {
|
||||
@return $extended-theme-name;
|
||||
}
|
||||
@return $default;
|
||||
}
|
||||
|
||||
$-theme-variables: (
|
||||
'quartz': (
|
||||
active-color: 'color',
|
||||
),
|
||||
'quartz-dark': (
|
||||
active-color: 'color',
|
||||
),
|
||||
'alpine': (
|
||||
alpine-active-color: 'color',
|
||||
),
|
||||
'alpine-dark': (
|
||||
alpine-active-color: 'color',
|
||||
),
|
||||
'balham': (
|
||||
balham-active-color: 'color',
|
||||
),
|
||||
'balham-dark': (
|
||||
balham-active-color: 'color',
|
||||
),
|
||||
'material': (
|
||||
material-primary-color: 'color',
|
||||
material-accent-color: 'color',
|
||||
),
|
||||
);
|
||||
|
||||
$-theme-css-files: (
|
||||
'quartz': 'ag-theme-quartz-no-font.css',
|
||||
'quartz-dark': 'ag-theme-quartz-no-font.css',
|
||||
'alpine': 'ag-theme-alpine-no-font.css',
|
||||
'alpine-dark': 'ag-theme-alpine-no-font.css',
|
||||
'balham': 'ag-theme-balham-no-font.css',
|
||||
'balham-dark': 'ag-theme-balham-no-font.css',
|
||||
'material': 'ag-theme-material-no-font.css',
|
||||
'material-dark': 'ag-theme-material-no-font.css',
|
||||
);
|
||||
|
||||
$-theme-fonts: (
|
||||
'quartz': 'agGridQuartz',
|
||||
'quartz-dark': 'agGridQuartz',
|
||||
'alpine': 'agGridAlpine',
|
||||
'alpine-dark': 'agGridAlpine',
|
||||
'balham': 'agGridBalham',
|
||||
'balham-dark': 'agGridBalham',
|
||||
'material': 'agGridMaterial',
|
||||
'material-dark': 'agGridMaterial',
|
||||
);
|
||||
|
||||
@function -is-provided-theme($theme-name) {
|
||||
@return map.has-key($-theme-variables, $theme-name);
|
||||
}
|
||||
|
||||
@function -get-themes($params) {
|
||||
$themes: map.get($params, 'themes');
|
||||
$themes: () !default;
|
||||
|
||||
@if meta.type-of($themes) == string {
|
||||
$themes: ($themes); // comma makes this a single element list
|
||||
}
|
||||
|
||||
// treat ("alpine", "balham") as (alpine: (), "balham": ())
|
||||
@if meta.type-of($themes) == list {
|
||||
$themes-list: $themes;
|
||||
$themes: ();
|
||||
@each $theme in $themes-list {
|
||||
$themes: map.set($themes, $theme, ());
|
||||
}
|
||||
}
|
||||
|
||||
@if map.has-key($params, 'theme') {
|
||||
$theme: map.get($params, 'theme');
|
||||
@if meta.type-of($theme) == list {
|
||||
@error "Expected theme to be a string, got a list (if you intend to use multiple themes, use the plural `themes` parameter)";
|
||||
} @else if meta.type-of($theme) != string {
|
||||
@error "Expected theme to be a string, got #{meta.inspect($theme)})";
|
||||
}
|
||||
$themes: map.set($themes, $theme, ());
|
||||
}
|
||||
|
||||
@if list.length($themes) == 0 {
|
||||
$themes: (
|
||||
quartz: (),
|
||||
);
|
||||
}
|
||||
|
||||
$params: map.remove($params, 'theme', 'themes');
|
||||
|
||||
$cleaned: ();
|
||||
@each $name, $extra-params in $themes {
|
||||
$theme-params: internal-preprocess-params(map.merge($params, $extra-params));
|
||||
$cleaned: map.set($cleaned, -clean-theme-name($name), $theme-params);
|
||||
}
|
||||
@return $cleaned;
|
||||
}
|
||||
|
||||
// Return a version of $params with colour blending applied
|
||||
@function -base-color-blends($params) {
|
||||
// Simple defaults. We need to define the defaults for any parameters
|
||||
// that are used in blending below
|
||||
$params: -param-default($params, --ag-foreground-color, #000);
|
||||
$params: -param-default($params, --ag-background-color, #fff);
|
||||
$params: -param-default($params, --ag-range-selection-border-color, --ag-foreground-color);
|
||||
|
||||
// Blended defaults.
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.5);
|
||||
$params: -param-default($params, --ag-modal-overlay-background-color, --ag-background-color, $alpha: 0.66);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-range-selection-background-color,
|
||||
--ag-range-selection-border-color,
|
||||
$alpha: 0.2
|
||||
);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-range-selection-background-color-2,
|
||||
--ag-range-selection-background-color,
|
||||
$self-overlay: 2
|
||||
);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-range-selection-background-color-3,
|
||||
--ag-range-selection-background-color,
|
||||
$self-overlay: 3
|
||||
);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-range-selection-background-color-4,
|
||||
--ag-range-selection-background-color,
|
||||
$self-overlay: 4
|
||||
);
|
||||
$params: -param-default($params, --ag-border-color, --ag-foreground-color, $alpha: 0.25);
|
||||
$params: -param-default($params, --ag-header-column-separator-color, --ag-border-color, $alpha: 0.5);
|
||||
$params: -param-default($params, --ag-header-column-resize-handle-color, --ag-border-color, $alpha: 0.5);
|
||||
$params: -param-default($params, --ag-input-disabled-border-color, --ag-input-border-color, $alpha: 0.3);
|
||||
@return $params;
|
||||
}
|
||||
|
||||
@function -theme-alpine-color-blends($params) {
|
||||
// Simple defaults. We need to define the defaults for any parameters
|
||||
// that are used in blending either below or in the base color blends
|
||||
$params: -param-default($params, --ag-background-color, #fff);
|
||||
$params: -param-default($params, --ag-foreground-color, #181d1f);
|
||||
$params: -param-default($params, --ag-subheader-background-color, #fff);
|
||||
$params: -param-default($params, --ag-alpine-active-color, #2196f3);
|
||||
$params: -param-default($params, --ag-range-selection-border-color, --ag-alpine-active-color);
|
||||
|
||||
// Blended defaults
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-subheader-toolbar-background-color,
|
||||
--ag-subheader-background-color,
|
||||
$alpha: 0.5
|
||||
);
|
||||
$params: -param-default($params, --ag-selected-row-background-color, --ag-alpine-active-color, $alpha: 0.1);
|
||||
$params: -param-default($params, --ag-row-hover-color, --ag-alpine-active-color, $alpha: 0.1);
|
||||
$params: -param-default($params, --ag-column-hover-color, --ag-alpine-active-color, $alpha: 0.1);
|
||||
$params: -param-default($params, --ag-chip-background-color, --ag-foreground-color, $alpha: 0.07);
|
||||
$params: -param-default($params, --ag-input-disabled-background-color, --ag-border-color, $alpha: 0.15);
|
||||
$params: -param-default($params, --ag-input-disabled-border-color, --ag-border-color, $alpha: 0.3);
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.5);
|
||||
$params: -param-default($params, --ag-input-focus-border-color, --ag-alpine-active-color, $alpha: 0.4);
|
||||
@return $params;
|
||||
}
|
||||
|
||||
@function -theme-alpine-dark-color-blends($params) {
|
||||
$params: -param-default($params, --ag-background-color, #181d1f);
|
||||
$params: -param-default($params, --ag-foreground-color, #fff);
|
||||
$params: -param-default($params, --ag-subheader-background-color, #000);
|
||||
|
||||
@return -theme-alpine-color-blends($params);
|
||||
}
|
||||
|
||||
@function -theme-balham-color-blends($params) {
|
||||
// Simple defaults. We need to define the defaults for any parameters
|
||||
// that are used in blending either below or in the base color blends
|
||||
$params: -param-default($params, --ag-background-color, #fff);
|
||||
$params: -param-default($params, --ag-foreground-color, #000);
|
||||
$params: -param-default($params, --ag-border-color, #bdc3c7);
|
||||
$params: -param-default($params, --ag-subheader-background-color, #e2e9eb);
|
||||
$params: -param-default($params, --ag-balham-active-color, #0091ea);
|
||||
$params: -param-default($params, --ag-range-selection-border-color, --ag-balham-active-color);
|
||||
|
||||
// Blended defaults
|
||||
$params: -param-default($params, --ag-secondary-foreground-color, --ag-foreground-color, $alpha: 0.54);
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.38);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-subheader-toolbar-background-color,
|
||||
--ag-subheader-background-color,
|
||||
$alpha: 0.5
|
||||
);
|
||||
$params: -param-default($params, --ag-row-border-color, --ag-border-color, $alpha: 0.58);
|
||||
$params: -param-default($params, --ag-chip-background-color, --ag-foreground-color, $alpha: 0.1);
|
||||
$params: -param-default($params, --ag-selected-row-background-color, --ag-balham-active-color, $alpha: 0.28);
|
||||
$params: -param-default($params, --ag-header-column-separator-color, --ag-border-color, $alpha: 0.5);
|
||||
@return $params;
|
||||
}
|
||||
|
||||
@function -theme-balham-dark-color-blends($params) {
|
||||
$params: -param-default($params, --ag-background-color, #181d1f);
|
||||
$params: -param-default($params, --ag-foreground-color, #fff);
|
||||
$params: -param-default($params, --ag-border-color, #424242);
|
||||
$params: -param-default($params, --ag-subheader-background-color, #000);
|
||||
$params: -param-default($params, --ag-balham-active-color, #00b0ff);
|
||||
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.38);
|
||||
$params: -param-default($params, --ag-header-foreground-color, --ag-foreground-color, $alpha: 0.64);
|
||||
|
||||
@return -theme-balham-color-blends($params);
|
||||
}
|
||||
|
||||
@function -theme-material-color-blends($params) {
|
||||
// Simple defaults. We need to define the defaults for any parameters
|
||||
// that are used in blending either below or in the base color blends
|
||||
$params: -param-default($params, --ag-background-color, #fff);
|
||||
$params: -param-default($params, --ag-foreground-color, rgba(0, 0, 0, 0.87));
|
||||
$params: -param-default($params, --ag-subheader-background-color, #eee);
|
||||
$params: -param-default($params, --ag-material-primary-color, #3f51b5);
|
||||
$params: -param-default($params, --ag-range-selection-border-color, --ag-material-primary-color);
|
||||
$params: -param-default($params, --ag-range-selection-background-color, rgba(122, 134, 203, 0.1));
|
||||
$params: -param-default($params, --ag-border-color, #e2e2e2);
|
||||
|
||||
// Blended defaults
|
||||
$params: -param-default($params, --ag-secondary-foreground-color, --ag-foreground-color, $alpha: 0.54);
|
||||
$params: -param-default($params, --ag-disabled-foreground-color, --ag-foreground-color, $alpha: 0.38);
|
||||
$params: -param-default(
|
||||
$params,
|
||||
--ag-subheader-toolbar-background-color,
|
||||
--ag-subheader-background-color,
|
||||
$alpha: 0.5
|
||||
);
|
||||
@return $params;
|
||||
}
|
||||
|
||||
// Apply a default value to a parameter
|
||||
// $params: -param-default($params, x, #f08) - default x to a specific color value
|
||||
// $params: -param-default($params, x, y) - default x to the value of y (if y is set)
|
||||
// $params: -param-default($params, x, y, $alpha: 0.5) - default x to the value of y made 50% transparent
|
||||
@function -param-default($params, $target, $source, $alpha: null, $self-overlay: null) {
|
||||
@if string.index($target, '--ag-') != 1 {
|
||||
@error "Internal error: $target to -param-default should start --ag-";
|
||||
}
|
||||
$value: null;
|
||||
@if meta.type-of($source) == 'color' {
|
||||
$value: $source;
|
||||
} @else {
|
||||
@if string.index($source, '--ag-') != 1 {
|
||||
@error "Internal error: $source to -param-default should start --ag-";
|
||||
}
|
||||
$value: map.get($params, $source);
|
||||
}
|
||||
@if map.has-key($params, $target) or $value == null {
|
||||
@return $params;
|
||||
}
|
||||
@if $alpha != null {
|
||||
$value: color.change($value, $alpha: color.alpha($value) * $alpha);
|
||||
}
|
||||
@if $self-overlay != null {
|
||||
// this formula produces the same opacity value as overlaying the color on top
|
||||
// of itself $self-overlay times
|
||||
$value: color.change($value, $alpha: 1-(math.pow(1 - color.alpha($value), $self-overlay)));
|
||||
}
|
||||
@return map.set($params, $target, $value);
|
||||
}
|
||||
|
||||
$-param-type-descriptions: (
|
||||
'color': 'a CSS color (e.g. `red` or `#fff`)',
|
||||
'length': 'a CSS length (e.g. `0`, `4px` or `50%`)',
|
||||
'border-style': 'a CSS border style (e.g. `dotted` or `solid`)',
|
||||
'duration': 'a number with time duration units (e.g. `3s` or `250ms`)',
|
||||
'border-style-and-size':
|
||||
'either `none`, or a CSS border-style and size (e.g. `solid 1px`), or a boolean (true -> `solid 1px` and false -> `none`)',
|
||||
'border-style-and-color': 'a CSS border-style and color (e.g. `solid red`)',
|
||||
'display': 'A CSS display value (`block` to show, `none` to hide - `true` and `false` are also accepted)',
|
||||
'any': 'any value',
|
||||
);
|
||||
|
||||
// params that are copied to --ag-param-name variables
|
||||
$-variable-param-types: (
|
||||
--ag-foreground-color: 'color',
|
||||
--ag-data-color: 'color',
|
||||
--ag-secondary-foreground-color: 'color',
|
||||
--ag-header-foreground-color: 'color',
|
||||
--ag-disabled-foreground-color: 'color',
|
||||
--ag-background-color: 'color',
|
||||
--ag-header-background-color: 'color',
|
||||
--ag-tooltip-background-color: 'color',
|
||||
--ag-tooltip-error-background-color: 'color',
|
||||
--ag-tooltip-error-text-color: 'color',
|
||||
--ag-tooltip-error-border-color: 'color',
|
||||
--ag-subheader-background-color: 'color',
|
||||
--ag-subheader-toolbar-background-color: 'color',
|
||||
--ag-control-panel-background-color: 'color',
|
||||
--ag-side-button-selected-background-color: 'color',
|
||||
--ag-selected-row-background-color: 'color',
|
||||
--ag-odd-row-background-color: 'color',
|
||||
--ag-modal-overlay-background-color: 'color',
|
||||
--ag-row-hover-color: 'color',
|
||||
--ag-column-hover-color: 'color',
|
||||
--ag-range-selection-border-color: 'color',
|
||||
--ag-range-selection-border-style: 'border-style',
|
||||
--ag-range-selection-background-color: 'color',
|
||||
--ag-range-selection-background-color-2: 'color',
|
||||
--ag-range-selection-background-color-3: 'color',
|
||||
--ag-range-selection-background-color-4: 'color',
|
||||
--ag-range-selection-highlight-color: 'color',
|
||||
--ag-selected-tab-underline-color: 'color',
|
||||
--ag-selected-tab-underline-width: 'length',
|
||||
--ag-selected-tab-underline-transition-speed: 'duration',
|
||||
--ag-range-selection-chart-category-background-color: 'color',
|
||||
--ag-range-selection-chart-background-color: 'color',
|
||||
--ag-header-cell-hover-background-color: 'color',
|
||||
--ag-header-cell-moving-background-color: 'color',
|
||||
--ag-value-change-value-highlight-background-color: 'color',
|
||||
--ag-value-change-delta-up-color: 'color',
|
||||
--ag-value-change-delta-down-color: 'color',
|
||||
--ag-chip-background-color: 'color',
|
||||
--ag-borders: 'border-style-and-size',
|
||||
--ag-border-color: 'color',
|
||||
--ag-borders-critical: 'border-style-and-size',
|
||||
--ag-borders-secondary: 'border-style-and-size',
|
||||
--ag-secondary-border-color: 'color',
|
||||
--ag-row-loading-skeleton-effect-color: 'color',
|
||||
|
||||
--ag-row-border-style: 'border-style',
|
||||
--ag-row-border-width: 'length',
|
||||
--ag-row-border-color: 'color',
|
||||
|
||||
--ag-cell-horizontal-border: 'border-style-and-color',
|
||||
--ag-borders-input: 'border-style-and-size',
|
||||
--ag-input-border-color: 'color',
|
||||
--ag-borders-input-invalid: 'border-style-and-size',
|
||||
--ag-input-border-color-invalid: 'color',
|
||||
--ag-full-row-invalid-background-color: 'color',
|
||||
--ag-borders-side-button: 'border-style-and-size',
|
||||
--ag-border-radius: 'length',
|
||||
--ag-header-column-separator-display: 'display',
|
||||
--ag-header-column-separator-height: 'length',
|
||||
--ag-header-column-separator-width: 'length',
|
||||
--ag-header-column-separator-color: 'color',
|
||||
--ag-header-column-resize-handle-display: 'display',
|
||||
--ag-header-column-resize-handle-height: 'length',
|
||||
--ag-header-column-resize-handle-width: 'length',
|
||||
--ag-header-column-resize-handle-color: 'color',
|
||||
--ag-invalid-color: 'color',
|
||||
--ag-input-disabled-border-color: 'color',
|
||||
--ag-input-disabled-background-color: 'color',
|
||||
--ag-checkbox-background-color: 'color',
|
||||
--ag-checkbox-border-radius: 'length',
|
||||
--ag-checkbox-checked-color: 'color',
|
||||
--ag-checkbox-unchecked-color: 'color',
|
||||
--ag-checkbox-indeterminate-color: 'color',
|
||||
--ag-toggle-button-off-border-color: 'color',
|
||||
--ag-toggle-button-off-background-color: 'color',
|
||||
--ag-toggle-button-on-border-color: 'color',
|
||||
--ag-toggle-button-on-background-color: 'color',
|
||||
--ag-toggle-button-switch-background-color: 'color',
|
||||
--ag-toggle-button-switch-border-color: 'color',
|
||||
--ag-toggle-button-border-width: 'length',
|
||||
--ag-toggle-button-height: 'length',
|
||||
--ag-toggle-button-width: 'length',
|
||||
--ag-input-focus-box-shadow: 'any',
|
||||
--ag-input-error-focus-box-shadow: 'any',
|
||||
--ag-input-focus-border-color: 'color',
|
||||
--ag-minichart-selected-chart-color: 'color',
|
||||
--ag-minichart-selected-page-color: 'color',
|
||||
--ag-grid-size: 'length',
|
||||
--ag-icon-size: 'length',
|
||||
--ag-widget-container-horizontal-padding: 'length',
|
||||
--ag-widget-container-vertical-padding: 'length',
|
||||
--ag-widget-horizontal-spacing: 'length',
|
||||
--ag-widget-vertical-spacing: 'length',
|
||||
--ag-cell-horizontal-padding: 'length',
|
||||
--ag-cell-widget-spacing: 'length',
|
||||
--ag-row-height: 'length',
|
||||
--ag-header-height: 'length',
|
||||
--ag-list-item-height: 'length',
|
||||
--ag-column-select-indent-size: 'length',
|
||||
--ag-set-filter-indent-size: 'length',
|
||||
--ag-advanced-filter-builder-indent-size: 'length',
|
||||
--ag-row-group-indent-size: 'length',
|
||||
--ag-filter-tool-panel-group-indent: 'length',
|
||||
--ag-tab-min-width: 'length',
|
||||
--ag-menu-min-width: 'length',
|
||||
--ag-side-bar-panel-width: 'length',
|
||||
--ag-font-family: 'any',
|
||||
--ag-font-size: 'length',
|
||||
--ag-card-radius: 'length',
|
||||
--ag-card-shadow: 'any',
|
||||
--ag-popup-shadow: 'any',
|
||||
--ag-active-color: 'color',
|
||||
--ag-alpine-active-color: 'color',
|
||||
--ag-balham-active-color: 'color',
|
||||
--ag-material-primary-color: 'color',
|
||||
--ag-material-accent-color: 'color',
|
||||
--ag-icon-font-family: 'any',
|
||||
);
|
||||
|
||||
@each $icon-name in map.keys($icon-font-codes) {
|
||||
$-variable-param-types: map.set($-variable-param-types, '--ag-icon-font-code-#{$icon-name}', 'any');
|
||||
}
|
||||
|
||||
// params that are not copied to CSS variables
|
||||
$-non-variable-param-types: (
|
||||
suppress-native-widget-styling: 'bool',
|
||||
extend-theme: 'string',
|
||||
);
|
||||
|
||||
// Apply Sass API sugar over CSS variable API
|
||||
@function internal-preprocess-params($params) {
|
||||
$processed: ();
|
||||
@each $name, $value in $params {
|
||||
$name: -clean-variable-name($name);
|
||||
$type: map.get($-variable-param-types, $name);
|
||||
// Allow `null` for colours
|
||||
@if $type == 'color' and $value == null {
|
||||
$value: transparent;
|
||||
}
|
||||
// Allow booleans for borders params
|
||||
@if string.index($name, 'borders') and $value == true {
|
||||
$value: solid 1px;
|
||||
}
|
||||
@if string.index($name, 'borders') and $value == false {
|
||||
$value: none;
|
||||
}
|
||||
// Allow booleans for display params
|
||||
@if $type == 'display' and not $value {
|
||||
$value: none;
|
||||
}
|
||||
@if $type == 'display' and $value == true {
|
||||
$value: block;
|
||||
}
|
||||
$processed: map.set($processed, $name, $value);
|
||||
}
|
||||
@return $processed;
|
||||
}
|
||||
|
||||
@mixin -validate-params($params, $theme: null) {
|
||||
$error: internal-get-params-error($params, $theme);
|
||||
@if $error {
|
||||
@error $error;
|
||||
}
|
||||
}
|
||||
|
||||
@function internal-get-params-error($params, $theme: null) {
|
||||
$theme-variables: ();
|
||||
@if $theme and map.has-key($-theme-variables, $theme) {
|
||||
$theme-variables: map.get($-theme-variables, $theme);
|
||||
}
|
||||
|
||||
$param-types: map.merge($-variable-param-types, $theme-variables);
|
||||
$errors: ();
|
||||
@each $name, $value in $params {
|
||||
@if $name == 'suppress-native-widget-styling' {
|
||||
$errors: list.append(
|
||||
$errors,
|
||||
'suppress-native-widget-styling can not be specified at the theme level, only at the top level'
|
||||
);
|
||||
}
|
||||
|
||||
@if -is-runtime-expression($value) {
|
||||
// You can pass variable expressions as values and we'll just trust
|
||||
// that it's an appropriate value because we can't check at compile time
|
||||
} @else {
|
||||
$expected-type: map.get($param-types, $name);
|
||||
@if $expected-type {
|
||||
$is-valid: -validate-value($value, $expected-type);
|
||||
|
||||
@if not $is-valid {
|
||||
$expected: map.get($-param-type-descriptions, $expected-type);
|
||||
$expected: $expected-type !default;
|
||||
$errors: list.append(
|
||||
$errors,
|
||||
'Invalid parameter `#{$name}: #{meta.inspect($value)}` (expected #{$expected})'
|
||||
);
|
||||
}
|
||||
} @else if not map.has-key($-non-variable-param-types, $name) {
|
||||
$errors: list.append($errors, "Unrecognised parameter '#{$name}'");
|
||||
}
|
||||
}
|
||||
}
|
||||
@if list.length($errors) > 0 {
|
||||
$message: '';
|
||||
@each $error in $errors {
|
||||
@if $message == '' {
|
||||
$message: $error;
|
||||
} @else {
|
||||
$message: '#{$message}; #{$error}';
|
||||
}
|
||||
}
|
||||
@if list.length($errors) > 1 {
|
||||
$message: '#{list.length($errors)} errors in #{$theme} parameters: #{$message}';
|
||||
} @else {
|
||||
$message: 'Error in #{$theme} parameters: #{$message}';
|
||||
}
|
||||
@return $message;
|
||||
}
|
||||
@return null;
|
||||
}
|
||||
|
||||
@function -validate-value($value, $expected-type) {
|
||||
$validator-name: '-validate-#{$expected-type}';
|
||||
$validator: meta.get-function($validator-name);
|
||||
@if not $validator {
|
||||
@error "Internal error: no validator function #{$validator-name}";
|
||||
}
|
||||
@return meta.call($validator, $value);
|
||||
}
|
||||
|
||||
@function -is-runtime-expression($value) {
|
||||
$value: string.to-lower-case(meta.inspect($value));
|
||||
@return string.index($value, 'var(') != null or string.index($value, 'calc(') != null;
|
||||
}
|
||||
|
||||
@function -validate-color($value) {
|
||||
@return meta.type-of($value) == 'color';
|
||||
}
|
||||
|
||||
@function -validate-length($value) {
|
||||
@return meta.type-of($value) == 'number' and (unit($value) != '' or $value == 0);
|
||||
}
|
||||
|
||||
$border-styles: (none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset, initial);
|
||||
@function -validate-border-style($value) {
|
||||
$value-preserve-quotes: meta.inspect($value);
|
||||
@return list.index($border-styles, $value-preserve-quotes) != null;
|
||||
}
|
||||
|
||||
@function -validate-duration($value) {
|
||||
@return meta.type-of($value) == 'number' and (unit($value) == 's' or unit($value) == 'ms' or $value == 0);
|
||||
}
|
||||
|
||||
@function -validate-display($value) {
|
||||
@return $value == block or $value == none;
|
||||
}
|
||||
|
||||
@function -validate-border-style-and-size($value) {
|
||||
@return -validate-two-in-any-order($value, 'border-style', 'length');
|
||||
}
|
||||
|
||||
@function -validate-border-style-and-color($value) {
|
||||
@return -validate-two-in-any-order($value, 'border-style', 'color');
|
||||
}
|
||||
|
||||
@function -validate-bool($value) {
|
||||
@return meta.type-of($value) == 'bool';
|
||||
}
|
||||
|
||||
@function -validate-string($value) {
|
||||
@return meta.type-of($value) == 'string';
|
||||
}
|
||||
|
||||
@function -validate-any($value) {
|
||||
@return true;
|
||||
}
|
||||
|
||||
@function -validate-two-in-any-order($value, $type-a, $type-b) {
|
||||
@if meta.type-of($value) == 'string' and $value == 'none' {
|
||||
@return true;
|
||||
}
|
||||
|
||||
@if meta.type-of($value) != 'list' or list.length($value) != 2 {
|
||||
@return false;
|
||||
}
|
||||
|
||||
$value-1: list.nth($value, 1);
|
||||
$value-2: list.nth($value, 2);
|
||||
@return (
|
||||
(-validate-value($value-1, $type-a) and -validate-value($value-2, $type-b)) or
|
||||
(-validate-value($value-2, $type-a) and -validate-value($value-1, $type-b))
|
||||
);
|
||||
}
|
||||
|
||||
// check that we defined all the validator functions
|
||||
@each $variable-name, $type in $-variable-param-types {
|
||||
@if not map.has-key($-param-type-descriptions, $type) {
|
||||
@error "Internal error: missing type description for #{$type} (used on #{$variable-name})";
|
||||
}
|
||||
@if not meta.function-exists('-validate-#{$type}') {
|
||||
@error "Internal error: missing validator function for #{$type} (used on #{$variable-name})";
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
// mixins shared between the our themes and the public API
|
||||
|
||||
// Apply styles to all text fields. Usage:
|
||||
// @include ag.text-input {
|
||||
// border: solid dashed red;
|
||||
// }
|
||||
@mixin text-input {
|
||||
input[class^='ag-']:not([type]),
|
||||
input[class^='ag-'][type='text'],
|
||||
input[class^='ag-'][type='number'],
|
||||
input[class^='ag-'][type='tel'],
|
||||
input[class^='ag-'][type='date'],
|
||||
input[class^='ag-'][type='datetime-local'],
|
||||
textarea[class^='ag-'] {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
+19
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,617 @@
|
||||
.ag-theme-alpine,
|
||||
.ag-theme-alpine-dark,
|
||||
.ag-theme-alpine-auto-dark {
|
||||
--ag-alpine-active-color: #2196f3;
|
||||
--ag-selected-row-background-color: rgba(33, 150, 243, 0.3);
|
||||
--ag-row-hover-color: rgba(33, 150, 243, 0.1);
|
||||
--ag-column-hover-color: rgba(33, 150, 243, 0.1);
|
||||
--ag-input-focus-border-color: rgba(33, 150, 243, 0.4);
|
||||
--ag-range-selection-background-color: rgba(33, 150, 243, 0.2);
|
||||
--ag-range-selection-background-color-2: rgba(33, 150, 243, 0.36);
|
||||
--ag-range-selection-background-color-3: rgba(33, 150, 243, 0.49);
|
||||
--ag-range-selection-background-color-4: rgba(33, 150, 243, 0.59);
|
||||
--ag-row-numbers-selected-color: color-mix(in srgb, transparent, var(--ag-alpine-active-color) 50%);
|
||||
--ag-background-color: #fff;
|
||||
--ag-foreground-color: #181d1f;
|
||||
--ag-border-color: #babfc7;
|
||||
--ag-secondary-border-color: #dde2eb;
|
||||
--ag-header-background-color: #f8f8f8;
|
||||
--ag-tooltip-background-color: #f8f8f8;
|
||||
--ag-odd-row-background-color: #fcfcfc;
|
||||
--ag-control-panel-background-color: #f8f8f8;
|
||||
--ag-subheader-background-color: #fff;
|
||||
--ag-invalid-color: #e02525;
|
||||
--ag-checkbox-unchecked-color: #999;
|
||||
--ag-advanced-filter-join-pill-color: #f08e8d;
|
||||
--ag-advanced-filter-column-pill-color: #a6e194;
|
||||
--ag-advanced-filter-option-pill-color: #f3c08b;
|
||||
--ag-advanced-filter-value-pill-color: #85c0e4;
|
||||
--ag-find-match-color: var(--ag-foreground-color);
|
||||
--ag-find-match-background-color: #ffff00;
|
||||
--ag-find-active-match-color: var(--ag-foreground-color);
|
||||
--ag-find-active-match-background-color: #ffa500;
|
||||
--ag-checkbox-background-color: var(--ag-background-color);
|
||||
--ag-checkbox-checked-color: var(--ag-alpine-active-color);
|
||||
--ag-range-selection-border-color: var(--ag-alpine-active-color);
|
||||
--ag-secondary-foreground-color: var(--ag-foreground-color);
|
||||
--ag-input-border-color: var(--ag-border-color);
|
||||
--ag-input-border-color-invalid: var(--ag-invalid-color);
|
||||
--ag-input-focus-box-shadow: 0 0 2px 0.1rem var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 2px 0.1rem var(--ag-invalid-color);
|
||||
--ag-panel-background-color: var(--ag-header-background-color);
|
||||
--ag-menu-background-color: var(--ag-header-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-background-color: var(--ag-alpine-active-color);
|
||||
--ag-disabled-foreground-color: rgba(24, 29, 31, 0.5);
|
||||
--ag-chip-background-color: rgba(24, 29, 31, 0.07);
|
||||
--ag-input-disabled-border-color: rgba(186, 191, 199, 0.3);
|
||||
--ag-input-disabled-background-color: rgba(186, 191, 199, 0.15);
|
||||
--ag-borders: solid 1px;
|
||||
--ag-border-radius: 3px;
|
||||
--ag-borders-side-button: none;
|
||||
--ag-side-button-selected-background-color: transparent;
|
||||
--ag-header-column-resize-handle-display: block;
|
||||
--ag-header-column-resize-handle-width: 2px;
|
||||
--ag-header-column-resize-handle-height: 30%;
|
||||
--ag-grid-size: 6px;
|
||||
--ag-icon-size: 16px;
|
||||
--ag-row-height: calc(var(--ag-grid-size) * 7);
|
||||
--ag-header-height: calc(var(--ag-grid-size) * 8);
|
||||
--ag-list-item-height: calc(var(--ag-grid-size) * 4);
|
||||
--ag-column-select-indent-size: var(--ag-icon-size);
|
||||
--ag-set-filter-indent-size: var(--ag-icon-size);
|
||||
--ag-advanced-filter-builder-indent-size: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
--ag-cell-horizontal-padding: calc(var(--ag-grid-size) * 3);
|
||||
--ag-cell-widget-spacing: calc(var(--ag-grid-size) * 2);
|
||||
--ag-widget-container-vertical-padding: calc(var(--ag-grid-size) * 2);
|
||||
--ag-widget-container-horizontal-padding: calc(var(--ag-grid-size) * 2);
|
||||
--ag-widget-vertical-spacing: calc(var(--ag-grid-size) * 1.5);
|
||||
--ag-toggle-button-height: 18px;
|
||||
--ag-toggle-button-width: 28px;
|
||||
--ag-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell,
|
||||
"Helvetica Neue", sans-serif;
|
||||
--ag-font-size: 13px;
|
||||
--ag-icon-font-family: agGridAlpine;
|
||||
--ag-selected-tab-underline-color: var(--ag-alpine-active-color);
|
||||
--ag-selected-tab-underline-width: 2px;
|
||||
--ag-selected-tab-underline-transition-speed: 0.3s;
|
||||
--ag-tab-min-width: 240px;
|
||||
--ag-card-shadow: 0 1px 4px 1px rgba(186, 191, 199, 0.4);
|
||||
--ag-popup-shadow: var(--ag-card-shadow);
|
||||
--ag-side-bar-panel-width: 250px;
|
||||
}
|
||||
|
||||
.ag-theme-alpine-dark {
|
||||
--ag-background-color: #181d1f;
|
||||
--ag-foreground-color: #fff;
|
||||
--ag-border-color: #68686e;
|
||||
--ag-secondary-border-color: rgba(88, 86, 82, 0.5);
|
||||
--ag-modal-overlay-background-color: rgba(24, 29, 31, 0.66);
|
||||
--ag-header-background-color: #222628;
|
||||
--ag-tooltip-background-color: #222628;
|
||||
--ag-odd-row-background-color: #222628;
|
||||
--ag-control-panel-background-color: #222628;
|
||||
--ag-subheader-background-color: #000;
|
||||
--ag-input-disabled-background-color: #282c2f;
|
||||
--ag-input-focus-box-shadow: 0 0 2px 0.5px rgba(255, 255, 255, 0.5), 0 0 4px 3px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 2px 0.5px rgba(255, 255, 255, 0.5),
|
||||
0 0 4px 3px color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-card-shadow: 0 1px 20px 1px black;
|
||||
--ag-disabled-foreground-color: rgba(255, 255, 255, 0.5);
|
||||
--ag-chip-background-color: rgba(255, 255, 255, 0.07);
|
||||
--ag-input-disabled-border-color: rgba(104, 104, 110, 0.3);
|
||||
--ag-input-disabled-background-color: rgba(104, 104, 110, 0.07);
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37;
|
||||
--ag-advanced-filter-column-pill-color: #355f2d;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168;
|
||||
--ag-advanced-filter-value-pill-color: #374c86;
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-foreground-color);
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.ag-theme-alpine-auto-dark {
|
||||
--ag-background-color: #181d1f;
|
||||
--ag-foreground-color: #fff;
|
||||
--ag-border-color: #68686e;
|
||||
--ag-secondary-border-color: rgba(88, 86, 82, 0.5);
|
||||
--ag-modal-overlay-background-color: rgba(24, 29, 31, 0.66);
|
||||
--ag-header-background-color: #222628;
|
||||
--ag-tooltip-background-color: #222628;
|
||||
--ag-odd-row-background-color: #222628;
|
||||
--ag-control-panel-background-color: #222628;
|
||||
--ag-subheader-background-color: #000;
|
||||
--ag-input-disabled-background-color: #282c2f;
|
||||
--ag-input-focus-box-shadow: 0 0 2px 0.5px rgba(255, 255, 255, 0.5), 0 0 4px 3px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 2px 0.5px rgba(255, 255, 255, 0.5),
|
||||
0 0 4px 3px color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-card-shadow: 0 1px 20px 1px black;
|
||||
--ag-disabled-foreground-color: rgba(255, 255, 255, 0.5);
|
||||
--ag-chip-background-color: rgba(255, 255, 255, 0.07);
|
||||
--ag-input-disabled-border-color: rgba(104, 104, 110, 0.3);
|
||||
--ag-input-disabled-background-color: rgba(104, 104, 110, 0.07);
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37;
|
||||
--ag-advanced-filter-column-pill-color: #355f2d;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168;
|
||||
--ag-advanced-filter-value-pill-color: #374c86;
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-foreground-color);
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
}
|
||||
.ag-theme-alpine .ag-filter-toolpanel-header,
|
||||
.ag-theme-alpine .ag-filter-toolpanel-search,
|
||||
.ag-theme-alpine .ag-status-bar,
|
||||
.ag-theme-alpine .ag-header-row,
|
||||
.ag-theme-alpine .ag-row-number-cell,
|
||||
.ag-theme-alpine .ag-panel-title-bar-title,
|
||||
.ag-theme-alpine .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-alpine .ag-filter-card-title,
|
||||
.ag-theme-alpine-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-alpine-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-alpine-dark .ag-status-bar,
|
||||
.ag-theme-alpine-dark .ag-header-row,
|
||||
.ag-theme-alpine-dark .ag-row-number-cell,
|
||||
.ag-theme-alpine-dark .ag-panel-title-bar-title,
|
||||
.ag-theme-alpine-dark .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-filter-card-title,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-alpine-auto-dark .ag-status-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-header-row,
|
||||
.ag-theme-alpine-auto-dark .ag-row-number-cell,
|
||||
.ag-theme-alpine-auto-dark .ag-panel-title-bar-title,
|
||||
.ag-theme-alpine-auto-dark .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-card-title {
|
||||
font-weight: 700;
|
||||
color: var(--ag-header-foreground-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-row,
|
||||
.ag-theme-alpine-dark .ag-row,
|
||||
.ag-theme-alpine-auto-dark .ag-row {
|
||||
font-size: calc(var(--ag-font-size) + 1px);
|
||||
}
|
||||
.ag-theme-alpine input[class^=ag-]:not([type]),
|
||||
.ag-theme-alpine input[class^=ag-][type=text],
|
||||
.ag-theme-alpine input[class^=ag-][type=number],
|
||||
.ag-theme-alpine input[class^=ag-][type=tel],
|
||||
.ag-theme-alpine input[class^=ag-][type=date],
|
||||
.ag-theme-alpine input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-alpine textarea[class^=ag-],
|
||||
.ag-theme-alpine-dark input[class^=ag-]:not([type]),
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=text],
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=number],
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=tel],
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=date],
|
||||
.ag-theme-alpine-dark input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-alpine-dark textarea[class^=ag-],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-]:not([type]),
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=text],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=number],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=tel],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=date],
|
||||
.ag-theme-alpine-auto-dark input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-alpine-auto-dark textarea[class^=ag-] {
|
||||
min-height: calc(var(--ag-grid-size) * 4);
|
||||
border-radius: var(--ag-border-radius);
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr input[class^=ag-]:not([type]), .ag-theme-alpine .ag-ltr input[class^=ag-][type=text], .ag-theme-alpine .ag-ltr input[class^=ag-][type=number], .ag-theme-alpine .ag-ltr input[class^=ag-][type=tel], .ag-theme-alpine .ag-ltr input[class^=ag-][type=date], .ag-theme-alpine .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-alpine .ag-ltr textarea[class^=ag-], .ag-theme-alpine-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-alpine-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-alpine-dark .ag-ltr textarea[class^=ag-], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-alpine-auto-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-alpine-auto-dark .ag-ltr textarea[class^=ag-] {
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl input[class^=ag-]:not([type]), .ag-theme-alpine .ag-rtl input[class^=ag-][type=text], .ag-theme-alpine .ag-rtl input[class^=ag-][type=number], .ag-theme-alpine .ag-rtl input[class^=ag-][type=tel], .ag-theme-alpine .ag-rtl input[class^=ag-][type=date], .ag-theme-alpine .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-alpine .ag-rtl textarea[class^=ag-], .ag-theme-alpine-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-alpine-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-alpine-dark .ag-rtl textarea[class^=ag-], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-alpine-auto-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-alpine-auto-dark .ag-rtl textarea[class^=ag-] {
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-tab,
|
||||
.ag-theme-alpine-dark .ag-tab,
|
||||
.ag-theme-alpine-auto-dark .ag-tab {
|
||||
padding: calc(var(--ag-grid-size) * 1.5);
|
||||
transition: color 0.4s;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.ag-theme-alpine .ag-tab-selected,
|
||||
.ag-theme-alpine-dark .ag-tab-selected,
|
||||
.ag-theme-alpine-auto-dark .ag-tab-selected {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-menu,
|
||||
.ag-theme-alpine-dark .ag-menu,
|
||||
.ag-theme-alpine-auto-dark .ag-menu {
|
||||
background-color: var(--ag-control-panel-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-panel-content-wrapper .ag-column-select,
|
||||
.ag-theme-alpine-dark .ag-panel-content-wrapper .ag-column-select,
|
||||
.ag-theme-alpine-auto-dark .ag-panel-content-wrapper .ag-column-select {
|
||||
background-color: var(--ag-control-panel-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-menu-header,
|
||||
.ag-theme-alpine-dark .ag-menu-header,
|
||||
.ag-theme-alpine-auto-dark .ag-menu-header {
|
||||
background-color: var(--ag-control-panel-background-color);
|
||||
padding-top: 1px;
|
||||
}
|
||||
.ag-theme-alpine .ag-tabs-header,
|
||||
.ag-theme-alpine-dark .ag-tabs-header,
|
||||
.ag-theme-alpine-auto-dark .ag-tabs-header {
|
||||
border-bottom: var(--ag-borders) var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-charts-settings-group-title-bar,
|
||||
.ag-theme-alpine .ag-charts-data-group-title-bar,
|
||||
.ag-theme-alpine .ag-charts-format-top-level-group-title-bar,
|
||||
.ag-theme-alpine .ag-charts-advanced-settings-top-level-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-settings-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-data-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-format-top-level-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-advanced-settings-top-level-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-settings-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-data-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-top-level-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-advanced-settings-top-level-group-title-bar {
|
||||
padding: var(--ag-grid-size) calc(var(--ag-grid-size) * 2);
|
||||
line-height: calc(var(--ag-icon-size) + var(--ag-grid-size) - 2px);
|
||||
}
|
||||
.ag-theme-alpine .ag-chart-mini-thumbnail,
|
||||
.ag-theme-alpine-dark .ag-chart-mini-thumbnail,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-mini-thumbnail {
|
||||
background-color: var(--ag-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-chart-settings-nav-bar,
|
||||
.ag-theme-alpine-dark .ag-chart-settings-nav-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-settings-nav-bar {
|
||||
border-top: var(--ag-borders-secondary) var(--ag-secondary-border-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr .ag-group-title-bar-icon, .ag-theme-alpine-dark .ag-ltr .ag-group-title-bar-icon, .ag-theme-alpine-auto-dark .ag-ltr .ag-group-title-bar-icon {
|
||||
margin-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-group-title-bar-icon, .ag-theme-alpine-dark .ag-rtl .ag-group-title-bar-icon, .ag-theme-alpine-auto-dark .ag-rtl .ag-group-title-bar-icon {
|
||||
margin-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-charts-format-top-level-group-toolbar,
|
||||
.ag-theme-alpine .ag-charts-advanced-settings-top-level-group-toolbar,
|
||||
.ag-theme-alpine-dark .ag-charts-format-top-level-group-toolbar,
|
||||
.ag-theme-alpine-dark .ag-charts-advanced-settings-top-level-group-toolbar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-top-level-group-toolbar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-advanced-settings-top-level-group-toolbar {
|
||||
margin-top: var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine .ag-ltr .ag-charts-advanced-settings-top-level-group-toolbar, .ag-theme-alpine-dark .ag-ltr .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine-dark .ag-ltr .ag-charts-advanced-settings-top-level-group-toolbar, .ag-theme-alpine-auto-dark .ag-ltr .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine-auto-dark .ag-ltr .ag-charts-advanced-settings-top-level-group-toolbar {
|
||||
padding-left: calc(var(--ag-icon-size) * 0.5 + var(--ag-grid-size) * 2);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine .ag-rtl .ag-charts-advanced-settings-top-level-group-toolbar, .ag-theme-alpine-dark .ag-rtl .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine-dark .ag-rtl .ag-charts-advanced-settings-top-level-group-toolbar, .ag-theme-alpine-auto-dark .ag-rtl .ag-charts-format-top-level-group-toolbar, .ag-theme-alpine-auto-dark .ag-rtl .ag-charts-advanced-settings-top-level-group-toolbar {
|
||||
padding-right: calc(var(--ag-icon-size) * 0.5 + var(--ag-grid-size) * 2);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-charts-format-sub-level-group,
|
||||
.ag-theme-alpine-dark .ag-charts-format-sub-level-group,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-sub-level-group {
|
||||
border-left: dashed 1px;
|
||||
border-left-color: var(--ag-border-color);
|
||||
padding-left: var(--ag-grid-size);
|
||||
margin-bottom: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-alpine .ag-charts-format-sub-level-group-title-bar,
|
||||
.ag-theme-alpine-dark .ag-charts-format-sub-level-group-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-sub-level-group-title-bar {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
background: none;
|
||||
font-weight: 700;
|
||||
}
|
||||
.ag-theme-alpine .ag-charts-format-sub-level-group-container,
|
||||
.ag-theme-alpine-dark .ag-charts-format-sub-level-group-container,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-sub-level-group-container {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.ag-theme-alpine .ag-charts-format-sub-level-group-item:last-child,
|
||||
.ag-theme-alpine-dark .ag-charts-format-sub-level-group-item:last-child,
|
||||
.ag-theme-alpine-auto-dark .ag-charts-format-sub-level-group-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.ag-theme-alpine.ag-dnd-ghost,
|
||||
.ag-theme-alpine-dark.ag-dnd-ghost,
|
||||
.ag-theme-alpine-auto-dark.ag-dnd-ghost {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 700;
|
||||
}
|
||||
.ag-theme-alpine .ag-side-buttons,
|
||||
.ag-theme-alpine-dark .ag-side-buttons,
|
||||
.ag-theme-alpine-auto-dark .ag-side-buttons {
|
||||
width: calc(var(--ag-grid-size) * 5);
|
||||
}
|
||||
.ag-theme-alpine .ag-standard-button,
|
||||
.ag-theme-alpine-dark .ag-standard-button,
|
||||
.ag-theme-alpine-auto-dark .ag-standard-button {
|
||||
font-family: inherit;
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
border-radius: var(--ag-border-radius);
|
||||
border: 1px solid;
|
||||
border-color: var(--ag-alpine-active-color);
|
||||
color: var(--ag-alpine-active-color);
|
||||
background-color: var(--ag-background-color);
|
||||
font-weight: 600;
|
||||
padding: var(--ag-grid-size) calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-alpine .ag-standard-button:hover,
|
||||
.ag-theme-alpine-dark .ag-standard-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-standard-button:hover {
|
||||
border-color: var(--ag-alpine-active-color);
|
||||
background-color: var(--ag-row-hover-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-standard-button:active,
|
||||
.ag-theme-alpine-dark .ag-standard-button:active,
|
||||
.ag-theme-alpine-auto-dark .ag-standard-button:active {
|
||||
border-color: var(--ag-alpine-active-color);
|
||||
background-color: var(--ag-alpine-active-color);
|
||||
color: var(--ag-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-standard-button:disabled,
|
||||
.ag-theme-alpine-dark .ag-standard-button:disabled,
|
||||
.ag-theme-alpine-auto-dark .ag-standard-button:disabled {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
background-color: var(--ag-input-disabled-background-color);
|
||||
border-color: var(--ag-input-disabled-border-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-vertical,
|
||||
.ag-theme-alpine-dark .ag-column-drop-vertical,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-vertical {
|
||||
min-height: 75px;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-vertical-title-bar,
|
||||
.ag-theme-alpine-dark .ag-column-drop-vertical-title-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-vertical-title-bar {
|
||||
padding: calc(var(--ag-grid-size) * 2);
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-alpine-dark .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-vertical-empty-message {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: dashed 1px;
|
||||
border-color: var(--ag-border-color);
|
||||
margin: calc(var(--ag-grid-size) * 2);
|
||||
padding: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-empty-message,
|
||||
.ag-theme-alpine-dark .ag-column-drop-empty-message,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-empty-message {
|
||||
color: var(--ag-foreground-color);
|
||||
opacity: 0.75;
|
||||
}
|
||||
.ag-theme-alpine .ag-pill-select .ag-column-drop,
|
||||
.ag-theme-alpine-dark .ag-pill-select .ag-column-drop,
|
||||
.ag-theme-alpine-auto-dark .ag-pill-select .ag-column-drop {
|
||||
min-height: unset;
|
||||
}
|
||||
.ag-theme-alpine .ag-status-bar,
|
||||
.ag-theme-alpine-dark .ag-status-bar,
|
||||
.ag-theme-alpine-auto-dark .ag-status-bar {
|
||||
font-weight: normal;
|
||||
}
|
||||
.ag-theme-alpine .ag-status-name-value-value,
|
||||
.ag-theme-alpine-dark .ag-status-name-value-value,
|
||||
.ag-theme-alpine-auto-dark .ag-status-name-value-value {
|
||||
font-weight: 700;
|
||||
}
|
||||
.ag-theme-alpine .ag-paging-number,
|
||||
.ag-theme-alpine .ag-paging-row-summary-panel-number,
|
||||
.ag-theme-alpine-dark .ag-paging-number,
|
||||
.ag-theme-alpine-dark .ag-paging-row-summary-panel-number,
|
||||
.ag-theme-alpine-auto-dark .ag-paging-number,
|
||||
.ag-theme-alpine-auto-dark .ag-paging-row-summary-panel-number {
|
||||
font-weight: 700;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-cell-button,
|
||||
.ag-theme-alpine-dark .ag-column-drop-cell-button,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-cell-button {
|
||||
opacity: 0.5;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-drop-cell-button:hover,
|
||||
.ag-theme-alpine-dark .ag-column-drop-cell-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-column-drop-cell-button:hover {
|
||||
opacity: 0.75;
|
||||
}
|
||||
.ag-theme-alpine .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-alpine .ag-column-select-column-readonly .ag-icon-grip,
|
||||
.ag-theme-alpine-dark .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-alpine-dark .ag-column-select-column-readonly .ag-icon-grip,
|
||||
.ag-theme-alpine-auto-dark .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-alpine-auto-dark .ag-column-select-column-readonly .ag-icon-grip {
|
||||
opacity: 0.35;
|
||||
}
|
||||
.ag-theme-alpine .ag-header-cell-menu-button:hover,
|
||||
.ag-theme-alpine .ag-header-cell-filter-button:hover,
|
||||
.ag-theme-alpine .ag-side-button-button:hover,
|
||||
.ag-theme-alpine .ag-tab:hover,
|
||||
.ag-theme-alpine .ag-panel-title-bar-button:hover,
|
||||
.ag-theme-alpine .ag-header-expand-icon:hover,
|
||||
.ag-theme-alpine .ag-column-group-icons:hover,
|
||||
.ag-theme-alpine .ag-set-filter-group-icons:hover,
|
||||
.ag-theme-alpine .ag-group-expanded .ag-icon:hover,
|
||||
.ag-theme-alpine .ag-group-contracted .ag-icon:hover,
|
||||
.ag-theme-alpine .ag-chart-settings-prev:hover,
|
||||
.ag-theme-alpine .ag-chart-settings-next:hover,
|
||||
.ag-theme-alpine .ag-group-title-bar-icon:hover,
|
||||
.ag-theme-alpine .ag-column-select-header-icon:hover,
|
||||
.ag-theme-alpine .ag-floating-filter-button-button:hover,
|
||||
.ag-theme-alpine .ag-filter-toolpanel-expand:hover,
|
||||
.ag-theme-alpine .ag-chart-menu-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-header-cell-menu-button:hover,
|
||||
.ag-theme-alpine-dark .ag-header-cell-filter-button:hover,
|
||||
.ag-theme-alpine-dark .ag-side-button-button:hover,
|
||||
.ag-theme-alpine-dark .ag-tab:hover,
|
||||
.ag-theme-alpine-dark .ag-panel-title-bar-button:hover,
|
||||
.ag-theme-alpine-dark .ag-header-expand-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-column-group-icons:hover,
|
||||
.ag-theme-alpine-dark .ag-set-filter-group-icons:hover,
|
||||
.ag-theme-alpine-dark .ag-group-expanded .ag-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-group-contracted .ag-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-chart-settings-prev:hover,
|
||||
.ag-theme-alpine-dark .ag-chart-settings-next:hover,
|
||||
.ag-theme-alpine-dark .ag-group-title-bar-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-column-select-header-icon:hover,
|
||||
.ag-theme-alpine-dark .ag-floating-filter-button-button:hover,
|
||||
.ag-theme-alpine-dark .ag-filter-toolpanel-expand:hover,
|
||||
.ag-theme-alpine-dark .ag-chart-menu-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-header-cell-menu-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-header-cell-filter-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-side-button-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-tab:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-panel-title-bar-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-header-expand-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-column-group-icons:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-set-filter-group-icons:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-group-expanded .ag-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-group-contracted .ag-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-settings-prev:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-settings-next:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-group-title-bar-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-column-select-header-icon:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-floating-filter-button-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-toolpanel-expand:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-menu-icon:hover {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-header-cell-menu-button:hover .ag-icon,
|
||||
.ag-theme-alpine .ag-header-cell-filter-button:hover .ag-icon,
|
||||
.ag-theme-alpine .ag-side-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine .ag-panel-title-bar-button:hover .ag-icon,
|
||||
.ag-theme-alpine .ag-floating-filter-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-header-cell-menu-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-header-cell-filter-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-side-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-panel-title-bar-button:hover .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-floating-filter-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-header-cell-menu-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-header-cell-filter-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-side-button-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-panel-title-bar-button:hover .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-floating-filter-button-button:hover .ag-icon {
|
||||
color: inherit;
|
||||
}
|
||||
.ag-theme-alpine .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-alpine-dark .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-active .ag-icon-filter {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-chart-settings-card-item.ag-not-selected:hover,
|
||||
.ag-theme-alpine-dark .ag-chart-settings-card-item.ag-not-selected:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-chart-settings-card-item.ag-not-selected:hover {
|
||||
opacity: 0.35;
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr .ag-panel-title-bar-button, .ag-theme-alpine-dark .ag-ltr .ag-panel-title-bar-button, .ag-theme-alpine-auto-dark .ag-ltr .ag-panel-title-bar-button {
|
||||
margin-left: calc(var(--ag-grid-size) * 2);
|
||||
margin-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-panel-title-bar-button, .ag-theme-alpine-dark .ag-rtl .ag-panel-title-bar-button, .ag-theme-alpine-auto-dark .ag-rtl .ag-panel-title-bar-button {
|
||||
margin-right: calc(var(--ag-grid-size) * 2);
|
||||
margin-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-ltr .ag-filter-toolpanel-group-container, .ag-theme-alpine-dark .ag-ltr .ag-filter-toolpanel-group-container, .ag-theme-alpine-auto-dark .ag-ltr .ag-filter-toolpanel-group-container {
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-filter-toolpanel-group-container, .ag-theme-alpine-dark .ag-rtl .ag-filter-toolpanel-group-container, .ag-theme-alpine-auto-dark .ag-rtl .ag-filter-toolpanel-group-container {
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-filter-toolpanel-instance-filter,
|
||||
.ag-theme-alpine-dark .ag-filter-toolpanel-instance-filter,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-toolpanel-instance-filter {
|
||||
border: none;
|
||||
background-color: var(--ag-control-panel-background-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-ltr .ag-filter-toolpanel-instance-filter, .ag-theme-alpine-dark .ag-ltr .ag-filter-toolpanel-instance-filter, .ag-theme-alpine-auto-dark .ag-ltr .ag-filter-toolpanel-instance-filter {
|
||||
border-left: dashed 1px;
|
||||
border-left-color: var(--ag-border-color);
|
||||
margin-left: calc(var(--ag-icon-size) * 0.5);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-rtl .ag-filter-toolpanel-instance-filter, .ag-theme-alpine-dark .ag-rtl .ag-filter-toolpanel-instance-filter, .ag-theme-alpine-auto-dark .ag-rtl .ag-filter-toolpanel-instance-filter {
|
||||
border-right: dashed 1px;
|
||||
border-right-color: var(--ag-border-color);
|
||||
margin-right: calc(var(--ag-icon-size) * 0.5);
|
||||
}
|
||||
|
||||
.ag-theme-alpine .ag-set-filter-list,
|
||||
.ag-theme-alpine-dark .ag-set-filter-list,
|
||||
.ag-theme-alpine-auto-dark .ag-set-filter-list {
|
||||
padding-top: calc(var(--ag-grid-size) * 0.5);
|
||||
padding-bottom: calc(var(--ag-grid-size) * 0.5);
|
||||
}
|
||||
.ag-theme-alpine .ag-filter-add-button .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-filter-add-button .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-filter-add-button .ag-icon {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-alpine .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-alpine .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-alpine .ag-layout-print .ag-center-cols-container,
|
||||
.ag-theme-alpine-dark .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-alpine-dark .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-alpine-dark .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-alpine-dark .ag-layout-print .ag-center-cols-container,
|
||||
.ag-theme-alpine-auto-dark .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-alpine-auto-dark .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-alpine-auto-dark .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-alpine-auto-dark .ag-layout-print .ag-center-cols-container {
|
||||
min-height: 150px;
|
||||
}
|
||||
.ag-theme-alpine .ag-date-time-list-page-entry-is-current,
|
||||
.ag-theme-alpine-dark .ag-date-time-list-page-entry-is-current,
|
||||
.ag-theme-alpine-auto-dark .ag-date-time-list-page-entry-is-current {
|
||||
background-color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-advanced-filter-builder-button,
|
||||
.ag-theme-alpine-dark .ag-advanced-filter-builder-button,
|
||||
.ag-theme-alpine-auto-dark .ag-advanced-filter-builder-button {
|
||||
padding: var(--ag-grid-size);
|
||||
font-weight: 600;
|
||||
}
|
||||
.ag-theme-alpine .ag-list-item-hovered::after,
|
||||
.ag-theme-alpine-dark .ag-list-item-hovered::after,
|
||||
.ag-theme-alpine-auto-dark .ag-list-item-hovered::after {
|
||||
background-color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-alpine-dark .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-alpine-auto-dark .ag-pill .ag-pill-button:hover {
|
||||
color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-header-highlight-before::after,
|
||||
.ag-theme-alpine .ag-header-highlight-after::after,
|
||||
.ag-theme-alpine-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-alpine-dark .ag-header-highlight-after::after,
|
||||
.ag-theme-alpine-auto-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-alpine-auto-dark .ag-header-highlight-after::after {
|
||||
background-color: var(--ag-alpine-active-color);
|
||||
}
|
||||
.ag-theme-alpine .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-alpine .ag-disabled .ag-icon,
|
||||
.ag-theme-alpine .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-alpine [disabled] .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-alpine-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-alpine-dark [disabled] .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-alpine-auto-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-alpine-auto-dark [disabled] .ag-icon {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,400 @@
|
||||
.ag-theme-balham,
|
||||
.ag-theme-balham-dark,
|
||||
.ag-theme-balham-auto-dark {
|
||||
--ag-balham-active-color: #0091ea;
|
||||
--ag-foreground-color: #000;
|
||||
--ag-background-color: #fff;
|
||||
--ag-header-background-color: #f5f7f7;
|
||||
--ag-tooltip-background-color: #cbd0d3;
|
||||
--ag-subheader-background-color: #e2e9eb;
|
||||
--ag-control-panel-background-color: #f5f7f7;
|
||||
--ag-border-color: #bdc3c7;
|
||||
--ag-odd-row-background-color: #fcfdfe;
|
||||
--ag-row-hover-color: #ecf0f1;
|
||||
--ag-column-hover-color: #ecf0f1;
|
||||
--ag-input-border-color: #95a5a6;
|
||||
--ag-invalid-color: #e02525;
|
||||
--ag-input-disabled-background-color: #ebebeb;
|
||||
--ag-checkbox-unchecked-color: #7f8c8d;
|
||||
--ag-input-focus-border-color: #719ece;
|
||||
--ag-advanced-filter-join-pill-color: #f08e8d;
|
||||
--ag-advanced-filter-column-pill-color: #a6e194;
|
||||
--ag-advanced-filter-option-pill-color: #f3c08b;
|
||||
--ag-advanced-filter-value-pill-color: #85c0e4;
|
||||
--ag-find-match-color: var(--ag-foreground-color);
|
||||
--ag-find-match-background-color: #ffff00;
|
||||
--ag-find-active-match-color: var(--ag-foreground-color);
|
||||
--ag-find-active-match-background-color: #ffa500;
|
||||
--ag-input-focus-box-shadow: 0 0 2px 1px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 2px 1px var(--ag-invalid-color);
|
||||
--ag-range-selection-border-color: var(--ag-balham-active-color);
|
||||
--ag-checkbox-checked-color: var(--ag-balham-active-color);
|
||||
--ag-checkbox-background-color: var(--ag-background-color);
|
||||
--ag-panel-background-color: var(--ag-header-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-background-color: var(--ag-balham-active-color);
|
||||
--ag-secondary-foreground-color: rgba(0, 0, 0, 0.54);
|
||||
--ag-disabled-foreground-color: rgba(0, 0, 0, 0.38);
|
||||
--ag-subheader-toolbar-background-color: rgba(226, 233, 235, 0.5);
|
||||
--ag-row-border-color: rgba(189, 195, 199, 0.58);
|
||||
--ag-chip-background-color: rgba(0, 0, 0, 0.1);
|
||||
--ag-range-selection-background-color: rgba(0, 145, 234, 0.2);
|
||||
--ag-range-selection-background-color-2: rgba(0, 145, 234, 0.36);
|
||||
--ag-range-selection-background-color-3: rgba(0, 145, 234, 0.49);
|
||||
--ag-range-selection-background-color-4: rgba(0, 145, 234, 0.59);
|
||||
--ag-selected-row-background-color: rgba(0, 145, 234, 0.28);
|
||||
--ag-header-column-separator-color: rgba(189, 195, 199, 0.5);
|
||||
--ag-input-disabled-border-color: rgba(149, 165, 166, 0.3);
|
||||
--ag-row-numbers-selected-color: color-mix(in srgb, transparent, var(--ag-balham-active-color) 50%);
|
||||
--ag-header-column-separator-display: block;
|
||||
--ag-header-column-separator-height: 50%;
|
||||
--ag-grid-size: 4px;
|
||||
--ag-icon-size: 16px;
|
||||
--ag-row-height: calc(var(--ag-grid-size) * 7);
|
||||
--ag-header-height: calc(var(--ag-grid-size) * 8);
|
||||
--ag-list-item-height: calc(var(--ag-grid-size) * 6);
|
||||
--ag-row-group-indent-size: calc(var(--ag-grid-size) * 3 + var(--ag-icon-size));
|
||||
--ag-cell-horizontal-padding: calc(var(--ag-grid-size) * 3);
|
||||
--ag-input-height: calc(var(--ag-grid-size) * 4);
|
||||
--ag-chart-menu-panel-width: 240px;
|
||||
--ag-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell,
|
||||
"Helvetica Neue", sans-serif;
|
||||
--ag-font-size: 12px;
|
||||
--ag-icon-font-family: agGridBalham;
|
||||
--ag-border-radius: 2px;
|
||||
--ag-checkbox-border-radius: 3px;
|
||||
--ag-card-shadow: none;
|
||||
}
|
||||
|
||||
.ag-theme-balham-dark {
|
||||
--ag-balham-active-color: #00b0ff;
|
||||
--ag-foreground-color: #f5f5f5;
|
||||
--ag-background-color: #2d3436;
|
||||
--ag-header-background-color: #1c1c1c;
|
||||
--ag-tooltip-background-color: #1c1f20;
|
||||
--ag-subheader-background-color: #111;
|
||||
--ag-control-panel-background-color: #202020;
|
||||
--ag-border-color: #424242;
|
||||
--ag-odd-row-background-color: #262c2e;
|
||||
--ag-row-hover-color: #3d4749;
|
||||
--ag-column-hover-color: #3d4749;
|
||||
--ag-input-border-color: #f0f0f0;
|
||||
--ag-input-disabled-background-color: rgba(48, 46, 46, 0.3);
|
||||
--ag-modal-overlay-background-color: rgba(45, 52, 54, 0.66);
|
||||
--ag-checkbox-unchecked-color: #ecf0f1;
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37;
|
||||
--ag-advanced-filter-column-pill-color: #355f2d;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168;
|
||||
--ag-advanced-filter-value-pill-color: #374c86;
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-foreground-color);
|
||||
--ag-secondary-foreground-color: var(--ag-foreground-color);
|
||||
--ag-disabled-foreground-color: rgba(245, 245, 245, 0.38);
|
||||
--ag-subheader-toolbar-background-color: rgba(17, 17, 17, 0.5);
|
||||
--ag-row-border-color: #5c5c5c;
|
||||
--ag-chip-background-color: rgba(245, 245, 245, 0.08);
|
||||
--ag-range-selection-background-color: rgba(0, 176, 255, 0.2);
|
||||
--ag-range-selection-background-color-2: rgba(0, 176, 255, 0.36);
|
||||
--ag-range-selection-background-color-3: rgba(0, 176, 255, 0.49);
|
||||
--ag-range-selection-background-color-4: rgba(0, 176, 255, 0.59);
|
||||
--ag-selected-row-background-color: rgba(0, 176, 255, 0.28);
|
||||
--ag-header-column-separator-color: rgba(66, 66, 66, 0.5);
|
||||
--ag-input-disabled-border-color: rgba(240, 240, 240, 0.3);
|
||||
--ag-header-foreground-color: rgba(245, 245, 245, 0.64);
|
||||
--ag-toggle-button-off-background-color: transparent;
|
||||
--ag-toggle-button-off-border-color: var(--ag-foreground-color);
|
||||
--ag-range-selection-chart-category-background-color: rgba(26, 177, 74, 0.5);
|
||||
--ag-range-selection-chart-background-color: rgba(45, 166, 255, 0.5);
|
||||
--ag-input-focus-box-shadow: 0 0 4px 1.5px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 4px 1.5px
|
||||
color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.ag-theme-balham-auto-dark {
|
||||
--ag-balham-active-color: #00b0ff;
|
||||
--ag-foreground-color: #f5f5f5;
|
||||
--ag-background-color: #2d3436;
|
||||
--ag-header-background-color: #1c1c1c;
|
||||
--ag-tooltip-background-color: #1c1f20;
|
||||
--ag-subheader-background-color: #111;
|
||||
--ag-control-panel-background-color: #202020;
|
||||
--ag-border-color: #424242;
|
||||
--ag-odd-row-background-color: #262c2e;
|
||||
--ag-row-hover-color: #3d4749;
|
||||
--ag-column-hover-color: #3d4749;
|
||||
--ag-input-border-color: #f0f0f0;
|
||||
--ag-input-disabled-background-color: rgba(48, 46, 46, 0.3);
|
||||
--ag-modal-overlay-background-color: rgba(45, 52, 54, 0.66);
|
||||
--ag-checkbox-unchecked-color: #ecf0f1;
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37;
|
||||
--ag-advanced-filter-column-pill-color: #355f2d;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168;
|
||||
--ag-advanced-filter-value-pill-color: #374c86;
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-filter-panel-apply-button-color: var(--ag-foreground-color);
|
||||
--ag-secondary-foreground-color: var(--ag-foreground-color);
|
||||
--ag-disabled-foreground-color: rgba(245, 245, 245, 0.38);
|
||||
--ag-subheader-toolbar-background-color: rgba(17, 17, 17, 0.5);
|
||||
--ag-row-border-color: #5c5c5c;
|
||||
--ag-chip-background-color: rgba(245, 245, 245, 0.08);
|
||||
--ag-range-selection-background-color: rgba(0, 176, 255, 0.2);
|
||||
--ag-range-selection-background-color-2: rgba(0, 176, 255, 0.36);
|
||||
--ag-range-selection-background-color-3: rgba(0, 176, 255, 0.49);
|
||||
--ag-range-selection-background-color-4: rgba(0, 176, 255, 0.59);
|
||||
--ag-selected-row-background-color: rgba(0, 176, 255, 0.28);
|
||||
--ag-header-column-separator-color: rgba(66, 66, 66, 0.5);
|
||||
--ag-input-disabled-border-color: rgba(240, 240, 240, 0.3);
|
||||
--ag-header-foreground-color: rgba(245, 245, 245, 0.64);
|
||||
--ag-toggle-button-off-background-color: transparent;
|
||||
--ag-toggle-button-off-border-color: var(--ag-foreground-color);
|
||||
--ag-range-selection-chart-category-background-color: rgba(26, 177, 74, 0.5);
|
||||
--ag-range-selection-chart-background-color: rgba(45, 166, 255, 0.5);
|
||||
--ag-input-focus-box-shadow: 0 0 4px 1.5px var(--ag-input-focus-border-color);
|
||||
--ag-input-error-focus-box-shadow: 0 0 4px 1.5px
|
||||
color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
}
|
||||
.ag-theme-balham .ag-filter-toolpanel-header,
|
||||
.ag-theme-balham .ag-filter-toolpanel-search,
|
||||
.ag-theme-balham .ag-status-bar,
|
||||
.ag-theme-balham .ag-header-row,
|
||||
.ag-theme-balham .ag-row-number-cell,
|
||||
.ag-theme-balham .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-balham-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-balham-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-balham-dark .ag-status-bar,
|
||||
.ag-theme-balham-dark .ag-header-row,
|
||||
.ag-theme-balham-dark .ag-row-number-cell,
|
||||
.ag-theme-balham-dark .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-balham-auto-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-balham-auto-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-balham-auto-dark .ag-status-bar,
|
||||
.ag-theme-balham-auto-dark .ag-header-row,
|
||||
.ag-theme-balham-auto-dark .ag-row-number-cell,
|
||||
.ag-theme-balham-auto-dark .ag-multi-filter-group-title-bar {
|
||||
font-weight: 600;
|
||||
color: var(--ag-header-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-ltr input[class^=ag-]:not([type]), .ag-theme-balham .ag-ltr input[class^=ag-][type=text], .ag-theme-balham .ag-ltr input[class^=ag-][type=number], .ag-theme-balham .ag-ltr input[class^=ag-][type=tel], .ag-theme-balham .ag-ltr input[class^=ag-][type=date], .ag-theme-balham .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-balham .ag-ltr textarea[class^=ag-], .ag-theme-balham-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-balham-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-balham-dark .ag-ltr textarea[class^=ag-], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-balham-auto-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-balham-auto-dark .ag-ltr textarea[class^=ag-] {
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-balham .ag-rtl input[class^=ag-]:not([type]), .ag-theme-balham .ag-rtl input[class^=ag-][type=text], .ag-theme-balham .ag-rtl input[class^=ag-][type=number], .ag-theme-balham .ag-rtl input[class^=ag-][type=tel], .ag-theme-balham .ag-rtl input[class^=ag-][type=date], .ag-theme-balham .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-balham .ag-rtl textarea[class^=ag-], .ag-theme-balham-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-balham-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-balham-dark .ag-rtl textarea[class^=ag-], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-balham-auto-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-balham-auto-dark .ag-rtl textarea[class^=ag-] {
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-balham .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-balham .ag-status-bar,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-balham-dark .ag-status-bar,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-balham-auto-dark .ag-status-bar {
|
||||
font-weight: 600;
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-balham.ag-dnd-ghost,
|
||||
.ag-theme-balham-dark.ag-dnd-ghost,
|
||||
.ag-theme-balham-auto-dark.ag-dnd-ghost {
|
||||
font-size: var(--ag-font-size);
|
||||
font-weight: 600;
|
||||
}
|
||||
.ag-theme-balham .ag-tab,
|
||||
.ag-theme-balham-dark .ag-tab,
|
||||
.ag-theme-balham-auto-dark .ag-tab {
|
||||
border: 1px solid transparent;
|
||||
padding: var(--ag-grid-size) calc(var(--ag-grid-size) * 2);
|
||||
margin: var(--ag-grid-size);
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
.ag-theme-balham .ag-tab-selected,
|
||||
.ag-theme-balham-dark .ag-tab-selected,
|
||||
.ag-theme-balham-auto-dark .ag-tab-selected {
|
||||
background-color: var(--ag-background-color);
|
||||
border-color: var(--ag-border-color);
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
.ag-theme-balham .ag-tabs-header,
|
||||
.ag-theme-balham-dark .ag-tabs-header,
|
||||
.ag-theme-balham-auto-dark .ag-tabs-header {
|
||||
border-bottom: 1px solid var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-cell,
|
||||
.ag-theme-balham-dark .ag-column-drop-cell,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-cell {
|
||||
height: calc(var(--ag-grid-size) * 6);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical-title,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-title,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-title {
|
||||
color: var(--ag-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical-cell,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-cell,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-cell {
|
||||
margin-left: calc(var(--ag-grid-size) * 2);
|
||||
margin-right: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical-cell-text,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-cell-text,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-cell-text {
|
||||
margin-left: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical-icon,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical-icon,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical-icon {
|
||||
color: var(--ag-secondary-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-ltr .ag-column-drop-vertical-empty-message, .ag-theme-balham-dark .ag-ltr .ag-column-drop-vertical-empty-message, .ag-theme-balham-auto-dark .ag-ltr .ag-column-drop-vertical-empty-message {
|
||||
padding-left: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-balham .ag-rtl .ag-column-drop-vertical-empty-message, .ag-theme-balham-dark .ag-rtl .ag-column-drop-vertical-empty-message, .ag-theme-balham-auto-dark .ag-rtl .ag-column-drop-vertical-empty-message {
|
||||
padding-right: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-balham .ag-column-drop-horizontal,
|
||||
.ag-theme-balham-dark .ag-column-drop-horizontal,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-horizontal {
|
||||
height: var(--ag-header-height);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-empty,
|
||||
.ag-theme-balham-dark .ag-column-drop-empty,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-empty {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-horizontal-cell-text,
|
||||
.ag-theme-balham-dark .ag-column-drop-horizontal-cell-text,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-horizontal-cell-text {
|
||||
margin-left: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-balham .ag-column-drop-vertical,
|
||||
.ag-theme-balham-dark .ag-column-drop-vertical,
|
||||
.ag-theme-balham-auto-dark .ag-column-drop-vertical {
|
||||
padding-top: calc(var(--ag-grid-size) * 2);
|
||||
}
|
||||
.ag-theme-balham .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-balham .ag-column-select-column-readonly .ag-icon-grip,
|
||||
.ag-theme-balham-dark .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-balham-dark .ag-column-select-column-readonly .ag-icon-grip,
|
||||
.ag-theme-balham-auto-dark .ag-column-select-column-readonly.ag-icon-grip,
|
||||
.ag-theme-balham-auto-dark .ag-column-select-column-readonly .ag-icon-grip {
|
||||
opacity: 0.35;
|
||||
}
|
||||
.ag-theme-balham .ag-menu-header,
|
||||
.ag-theme-balham-dark .ag-menu-header,
|
||||
.ag-theme-balham-auto-dark .ag-menu-header {
|
||||
background-color: var(--ag-header-background-color);
|
||||
}
|
||||
.ag-theme-balham .ag-overlay-loading-center,
|
||||
.ag-theme-balham-dark .ag-overlay-loading-center,
|
||||
.ag-theme-balham-auto-dark .ag-overlay-loading-center {
|
||||
background-color: var(--ag-background-color);
|
||||
border: 1px solid var(--ag-border-color);
|
||||
color: var(--ag-foreground-color);
|
||||
padding: calc(var(--ag-grid-size) * 4);
|
||||
}
|
||||
.ag-theme-balham .ag-tooltip,
|
||||
.ag-theme-balham-dark .ag-tooltip,
|
||||
.ag-theme-balham-auto-dark .ag-tooltip {
|
||||
border: none;
|
||||
}
|
||||
.ag-theme-balham .ag-panel-title-bar-button-icon,
|
||||
.ag-theme-balham-dark .ag-panel-title-bar-button-icon,
|
||||
.ag-theme-balham-auto-dark .ag-panel-title-bar-button-icon {
|
||||
font-size: calc(var(--ag-icon-size) + var(--ag-grid-size));
|
||||
}
|
||||
.ag-theme-balham .ag-panel,
|
||||
.ag-theme-balham-dark .ag-panel,
|
||||
.ag-theme-balham-auto-dark .ag-panel {
|
||||
background-color: var(--ag-header-background-color);
|
||||
}
|
||||
.ag-theme-balham .ag-chart-data-section,
|
||||
.ag-theme-balham .ag-chart-format-section,
|
||||
.ag-theme-balham .ag-chart-advanced-settings-section,
|
||||
.ag-theme-balham-dark .ag-chart-data-section,
|
||||
.ag-theme-balham-dark .ag-chart-format-section,
|
||||
.ag-theme-balham-dark .ag-chart-advanced-settings-section,
|
||||
.ag-theme-balham-auto-dark .ag-chart-data-section,
|
||||
.ag-theme-balham-auto-dark .ag-chart-format-section,
|
||||
.ag-theme-balham-auto-dark .ag-chart-advanced-settings-section {
|
||||
padding-bottom: calc(var(--ag-grid-size) * 0.5);
|
||||
}
|
||||
.ag-theme-balham .ag-group-toolbar,
|
||||
.ag-theme-balham-dark .ag-group-toolbar,
|
||||
.ag-theme-balham-auto-dark .ag-group-toolbar {
|
||||
background-color: var(--ag-subheader-toolbar-background-color);
|
||||
}
|
||||
.ag-theme-balham .ag-chart-tab,
|
||||
.ag-theme-balham-dark .ag-chart-tab,
|
||||
.ag-theme-balham-auto-dark .ag-chart-tab {
|
||||
padding-top: calc(var(--ag-grid-size) * 0.5);
|
||||
}
|
||||
.ag-theme-balham .ag-charts-format-sub-level-group-item,
|
||||
.ag-theme-balham-dark .ag-charts-format-sub-level-group-item,
|
||||
.ag-theme-balham-auto-dark .ag-charts-format-sub-level-group-item {
|
||||
margin-bottom: calc(var(--ag-grid-size) * 1.5);
|
||||
}
|
||||
.ag-theme-balham .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-balham-dark .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-balham-auto-dark .ag-filter-active .ag-icon-filter {
|
||||
color: var(--ag-balham-active-color);
|
||||
}
|
||||
.ag-theme-balham .ag-color-input input[class^=ag-][type=text].ag-input-field-input,
|
||||
.ag-theme-balham-dark .ag-color-input input[class^=ag-][type=text].ag-input-field-input,
|
||||
.ag-theme-balham-auto-dark .ag-color-input input[class^=ag-][type=text].ag-input-field-input {
|
||||
min-height: calc(var(--ag-icon-size) + 4px);
|
||||
}
|
||||
.ag-theme-balham .ag-list-item-hovered::after,
|
||||
.ag-theme-balham-dark .ag-list-item-hovered::after,
|
||||
.ag-theme-balham-auto-dark .ag-list-item-hovered::after {
|
||||
background-color: var(--ag-balham-active-color);
|
||||
}
|
||||
.ag-theme-balham .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-balham-dark .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-balham-auto-dark .ag-pill .ag-pill-button:hover {
|
||||
color: var(--ag-balham-active-color);
|
||||
}
|
||||
.ag-theme-balham .ag-header-highlight-before::after,
|
||||
.ag-theme-balham .ag-header-highlight-after::after,
|
||||
.ag-theme-balham-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-balham-dark .ag-header-highlight-after::after,
|
||||
.ag-theme-balham-auto-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-balham-auto-dark .ag-header-highlight-after::after {
|
||||
background-color: var(--ag-balham-active-color);
|
||||
}
|
||||
.ag-theme-balham .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-balham .ag-disabled .ag-icon,
|
||||
.ag-theme-balham .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-balham [disabled] .ag-icon,
|
||||
.ag-theme-balham-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-balham-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-balham-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-balham-dark [disabled] .ag-icon,
|
||||
.ag-theme-balham-auto-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-balham-auto-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-balham-auto-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-balham-auto-dark [disabled] .ag-icon {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-balham .ag-filter-panel .ag-standard-button.ag-filter-panel-buttons-apply-button:disabled,
|
||||
.ag-theme-balham-dark .ag-filter-panel .ag-standard-button.ag-filter-panel-buttons-apply-button:disabled,
|
||||
.ag-theme-balham-auto-dark .ag-filter-panel .ag-standard-button.ag-filter-panel-buttons-apply-button:disabled {
|
||||
color: unset;
|
||||
background-color: unset;
|
||||
}
|
||||
.ag-theme-balham .ag-filter-card-title,
|
||||
.ag-theme-balham-dark .ag-filter-card-title,
|
||||
.ag-theme-balham-auto-dark .ag-filter-card-title {
|
||||
font-weight: 600;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,614 @@
|
||||
.ag-theme-material,
|
||||
.ag-theme-material-dark,
|
||||
.ag-theme-material-auto-dark {
|
||||
--ag-material-primary-color: #3f51b5;
|
||||
--ag-material-accent-color: #ff4081;
|
||||
--ag-foreground-color: rgba(0, 0, 0, 0.87);
|
||||
--ag-secondary-foreground-color: rgba(0, 0, 0, 0.54);
|
||||
--ag-disabled-foreground-color: rgba(0, 0, 0, 0.38);
|
||||
--ag-background-color: #fff;
|
||||
--ag-header-background-color: #fff;
|
||||
--ag-tooltip-background-color: #fff;
|
||||
--ag-subheader-background-color: #eee;
|
||||
--ag-subheader-toolbar-background-color: rgba(238, 238, 238, 0.5);
|
||||
--ag-header-cell-hover-background-color: #f2f2f2;
|
||||
--ag-chip-background-color: #e2e2e2;
|
||||
--ag-range-selection-background-color: rgba(122, 134, 203, 0.1);
|
||||
--ag-range-selection-background-color-2: rgba(122, 134, 203, 0.19);
|
||||
--ag-range-selection-background-color-3: rgba(122, 134, 203, 0.27);
|
||||
--ag-range-selection-background-color-4: rgba(122, 134, 203, 0.34);
|
||||
--ag-row-numbers-selected-color: color-mix(in srgb, transparent, var(--ag-material-accent-color) 50%);
|
||||
--ag-range-selection-highlight-color: #fce4ec;
|
||||
--ag-row-hover-color: #fafafa;
|
||||
--ag-column-hover-color: #fafafa;
|
||||
--ag-control-panel-background-color: #fafafa;
|
||||
--ag-selected-row-background-color: rgba(33, 150, 243, 0.3);
|
||||
--ag-checkbox-unchecked-color: #333;
|
||||
--ag-value-change-value-highlight-background-color: #00acc1;
|
||||
--ag-side-button-selected-background-color: transparent;
|
||||
--ag-advanced-filter-join-pill-color: #f08e8d;
|
||||
--ag-advanced-filter-column-pill-color: #a6e194;
|
||||
--ag-advanced-filter-option-pill-color: #f3c08b;
|
||||
--ag-advanced-filter-value-pill-color: #85c0e4;
|
||||
--ag-find-match-color: var(--ag-foreground-color);
|
||||
--ag-find-match-background-color: #ffff00;
|
||||
--ag-find-active-match-color: var(--ag-foreground-color);
|
||||
--ag-find-active-match-background-color: #ffa500;
|
||||
--ag-filter-panel-apply-button-color: var(--ag-material-primary-color);
|
||||
--ag-filter-panel-apply-button-background-color: transparent;
|
||||
--ag-range-selection-border-color: var(--ag-material-primary-color);
|
||||
--ag-checkbox-checked-color: var(--ag-material-accent-color);
|
||||
--ag-borders: none;
|
||||
--ag-borders-critical: solid 1px;
|
||||
--ag-border-color: #e2e2e2;
|
||||
--ag-grid-size: 8px;
|
||||
--ag-icon-size: 18px;
|
||||
--ag-header-height: calc(var(--ag-grid-size) * 7);
|
||||
--ag-row-height: calc(var(--ag-grid-size) * 6);
|
||||
--ag-cell-horizontal-padding: calc(var(--ag-grid-size) * 3);
|
||||
--ag-list-item-height: calc(var(--ag-grid-size) * 4);
|
||||
--ag-row-group-indent-size: calc(var(--ag-grid-size) * 3 + var(--ag-icon-size));
|
||||
--ag-filter-tool-panel-sub-level-row-height: calc(var(--ag-grid-size) * 4);
|
||||
--ag-checkbox-border-radius: 2px;
|
||||
--ag-toggle-button-switch-border-width: 2px;
|
||||
--ag-toggle-button-height: var(--ag-icon-size);
|
||||
--ag-widget-container-horizontal-padding: calc(var(--ag-grid-size) * 1.5);
|
||||
--ag-widget-container-vertical-padding: calc(var(--ag-grid-size) * 2);
|
||||
--ag-widget-vertical-spacing: calc(var(--ag-grid-size) * 1.75);
|
||||
--ag-font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen-Sans, Ubuntu, Cantarell,
|
||||
"Helvetica Neue", sans-serif;
|
||||
--ag-font-size: 13px;
|
||||
--ag-icon-font-family: agGridMaterial;
|
||||
--ag-selected-tab-underline-color: var(--ag-material-primary-color);
|
||||
--ag-selected-tab-underline-width: 2px;
|
||||
--ag-input-focus-border-color: var(--ag-material-primary-color);
|
||||
--ag-input-focus-box-shadow: 0 0 0 5px rgba(32, 33, 36, 0.122);
|
||||
--ag-input-error-focus-box-shadow: 0 0 0 5px
|
||||
color-mix(in srgb, var(--ag-background-color), var(--ag-invalid-color) 0.5%);
|
||||
--ag-card-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
|
||||
0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
||||
--ag-card-radius: 2px;
|
||||
--ag-invalid-color: #e02525;
|
||||
}
|
||||
|
||||
.ag-theme-material-dark {
|
||||
--ag-material-primary-color: #3f51b5;
|
||||
--ag-material-accent-color: #bb86fcff;
|
||||
--ag-range-selection-border-color: var(--ag-material-accent-color);
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-background-color: #121212ff;
|
||||
--ag-foreground-color: #ffffffff;
|
||||
--ag-data-color: #f5f5f5ff;
|
||||
--ag-header-cell-hover-background-color: #000000ff;
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37ff;
|
||||
--ag-advanced-filter-column-pill-color: #355f2dff;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168ff;
|
||||
--ag-advanced-filter-value-pill-color: #374c86ff;
|
||||
--ag-input-disabled-border-color: #3a434eff;
|
||||
--ag-input-disabled-background-color: #68686e12;
|
||||
--ag-selected-row-background-color: #bb86fc33;
|
||||
--ag-row-hover-color: #bb86fc33;
|
||||
--ag-column-hover-color: #f5f5f50d;
|
||||
--ag-range-selection-background-color: #bb86fc1a;
|
||||
--ag-range-selection-background-color-2: #bb86fc30;
|
||||
--ag-range-selection-background-color-3: #bb86fc45;
|
||||
--ag-range-selection-background-color-4: #bb86fc57;
|
||||
--ag-border-color: #383838ff;
|
||||
--ag-secondary-border-color: #383838ff;
|
||||
--ag-header-background-color: #121212ff;
|
||||
--ag-tooltip-background-color: #212b38ff;
|
||||
--ag-odd-row-background-color: #121212ff;
|
||||
--ag-control-panel-background-color: #2c2c2cff;
|
||||
--ag-subheader-background-color: #ffffff0d;
|
||||
--ag-subheader-toolbar-background-color: #2c2c2cff;
|
||||
--ag-invalid-color: #e02525ff;
|
||||
--ag-checkbox-unchecked-color: #797e87ff;
|
||||
--ag-checkbox-background-color: #121212ff;
|
||||
--ag-secondary-foreground-color: #f5f5f5ff;
|
||||
--ag-input-border-color: #383838ff;
|
||||
--ag-input-border-color-invalid: #e02525ff;
|
||||
--ag-disabled-foreground-color: #f5f5f580;
|
||||
--ag-chip-background-color: #22262812;
|
||||
--ag-side-button-selected-background-color: #2c2c2cff;
|
||||
--ag-selected-tab-underline-color: #3f51b5ff;
|
||||
--ag-modal-overlay-background-color: #121212a8;
|
||||
--ag-value-change-delta-up-color: #43a047a8;
|
||||
--ag-value-change-delta-down-color: #e53935ff;
|
||||
--ag-menu-background-color: #2c2c2cff;
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.ag-theme-material-auto-dark {
|
||||
--ag-material-primary-color: #3f51b5;
|
||||
--ag-material-accent-color: #bb86fcff;
|
||||
--ag-range-selection-border-color: var(--ag-material-accent-color);
|
||||
--ag-find-match-color: var(--ag-background-color);
|
||||
--ag-find-active-match-color: var(--ag-background-color);
|
||||
--ag-background-color: #121212ff;
|
||||
--ag-foreground-color: #ffffffff;
|
||||
--ag-data-color: #f5f5f5ff;
|
||||
--ag-header-cell-hover-background-color: #000000ff;
|
||||
--ag-advanced-filter-join-pill-color: #7a3a37ff;
|
||||
--ag-advanced-filter-column-pill-color: #355f2dff;
|
||||
--ag-advanced-filter-option-pill-color: #5a3168ff;
|
||||
--ag-advanced-filter-value-pill-color: #374c86ff;
|
||||
--ag-input-disabled-border-color: #3a434eff;
|
||||
--ag-input-disabled-background-color: #68686e12;
|
||||
--ag-selected-row-background-color: #bb86fc33;
|
||||
--ag-row-hover-color: #bb86fc33;
|
||||
--ag-column-hover-color: #f5f5f50d;
|
||||
--ag-range-selection-background-color: #bb86fc1a;
|
||||
--ag-range-selection-background-color-2: #bb86fc30;
|
||||
--ag-range-selection-background-color-3: #bb86fc45;
|
||||
--ag-range-selection-background-color-4: #bb86fc57;
|
||||
--ag-border-color: #383838ff;
|
||||
--ag-secondary-border-color: #383838ff;
|
||||
--ag-header-background-color: #121212ff;
|
||||
--ag-tooltip-background-color: #212b38ff;
|
||||
--ag-odd-row-background-color: #121212ff;
|
||||
--ag-control-panel-background-color: #2c2c2cff;
|
||||
--ag-subheader-background-color: #ffffff0d;
|
||||
--ag-subheader-toolbar-background-color: #2c2c2cff;
|
||||
--ag-invalid-color: #e02525ff;
|
||||
--ag-checkbox-unchecked-color: #797e87ff;
|
||||
--ag-checkbox-background-color: #121212ff;
|
||||
--ag-secondary-foreground-color: #f5f5f5ff;
|
||||
--ag-input-border-color: #383838ff;
|
||||
--ag-input-border-color-invalid: #e02525ff;
|
||||
--ag-disabled-foreground-color: #f5f5f580;
|
||||
--ag-chip-background-color: #22262812;
|
||||
--ag-side-button-selected-background-color: #2c2c2cff;
|
||||
--ag-selected-tab-underline-color: #3f51b5ff;
|
||||
--ag-modal-overlay-background-color: #121212a8;
|
||||
--ag-value-change-delta-up-color: #43a047a8;
|
||||
--ag-value-change-delta-down-color: #e53935ff;
|
||||
--ag-menu-background-color: #2c2c2cff;
|
||||
--ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
|
||||
--ag-cell-batch-edit-text-color: #f3d0b3;
|
||||
color-scheme: dark;
|
||||
}
|
||||
}
|
||||
.ag-theme-material .ag-filter-toolpanel-header,
|
||||
.ag-theme-material .ag-filter-toolpanel-search,
|
||||
.ag-theme-material .ag-status-bar,
|
||||
.ag-theme-material .ag-header-row,
|
||||
.ag-theme-material .ag-row-number-cell,
|
||||
.ag-theme-material .ag-panel-title-bar-title,
|
||||
.ag-theme-material .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-material-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-material-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-material-dark .ag-status-bar,
|
||||
.ag-theme-material-dark .ag-header-row,
|
||||
.ag-theme-material-dark .ag-row-number-cell,
|
||||
.ag-theme-material-dark .ag-panel-title-bar-title,
|
||||
.ag-theme-material-dark .ag-multi-filter-group-title-bar,
|
||||
.ag-theme-material-auto-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-material-auto-dark .ag-filter-toolpanel-search,
|
||||
.ag-theme-material-auto-dark .ag-status-bar,
|
||||
.ag-theme-material-auto-dark .ag-header-row,
|
||||
.ag-theme-material-auto-dark .ag-row-number-cell,
|
||||
.ag-theme-material-auto-dark .ag-panel-title-bar-title,
|
||||
.ag-theme-material-auto-dark .ag-multi-filter-group-title-bar {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 600;
|
||||
color: var(--ag-header-foreground-color);
|
||||
}
|
||||
.ag-theme-material .ag-tab,
|
||||
.ag-theme-material-dark .ag-tab,
|
||||
.ag-theme-material-auto-dark .ag-tab {
|
||||
height: calc(var(--ag-grid-size) * 4.5);
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.ag-theme-material .ag-tabs-header,
|
||||
.ag-theme-material .ag-column-drop-horizontal,
|
||||
.ag-theme-material-dark .ag-tabs-header,
|
||||
.ag-theme-material-dark .ag-column-drop-horizontal,
|
||||
.ag-theme-material-auto-dark .ag-tabs-header,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-horizontal {
|
||||
background-color: var(--ag-subheader-background-color);
|
||||
}
|
||||
.ag-theme-material .ag-tabs-body,
|
||||
.ag-theme-material-dark .ag-tabs-body,
|
||||
.ag-theme-material-auto-dark .ag-tabs-body {
|
||||
padding: calc(var(--ag-grid-size) * 0.5) 0;
|
||||
}
|
||||
.ag-theme-material .ag-tabs-body .ag-menu-list,
|
||||
.ag-theme-material-dark .ag-tabs-body .ag-menu-list,
|
||||
.ag-theme-material-auto-dark .ag-tabs-body .ag-menu-list {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.ag-theme-material .ag-header-cell,
|
||||
.ag-theme-material .ag-header-group-cell,
|
||||
.ag-theme-material-dark .ag-header-cell,
|
||||
.ag-theme-material-dark .ag-header-group-cell,
|
||||
.ag-theme-material-auto-dark .ag-header-cell,
|
||||
.ag-theme-material-auto-dark .ag-header-group-cell {
|
||||
transition: background-color 0.5s;
|
||||
}
|
||||
.ag-theme-material .ag-row-last:not(.ag-row-first) .ag-cell-inline-editing,
|
||||
.ag-theme-material-dark .ag-row-last:not(.ag-row-first) .ag-cell-inline-editing,
|
||||
.ag-theme-material-auto-dark .ag-row-last:not(.ag-row-first) .ag-cell-inline-editing {
|
||||
bottom: 0;
|
||||
}
|
||||
.ag-theme-material .ag-cell-inline-editing,
|
||||
.ag-theme-material-dark .ag-cell-inline-editing,
|
||||
.ag-theme-material-auto-dark .ag-cell-inline-editing {
|
||||
padding: var(--ag-grid-size);
|
||||
height: calc(var(--ag-row-height) + var(--ag-grid-size) * 3);
|
||||
border-color: var(--ag-border-color) !important;
|
||||
}
|
||||
.ag-theme-material .ag-has-focus .ag-cell-inline-editing,
|
||||
.ag-theme-material-dark .ag-has-focus .ag-cell-inline-editing,
|
||||
.ag-theme-material-auto-dark .ag-has-focus .ag-cell-inline-editing {
|
||||
border-color: var(--ag-input-focus-border-color) !important;
|
||||
}
|
||||
.ag-theme-material .ag-column-drop-vertical,
|
||||
.ag-theme-material-dark .ag-column-drop-vertical,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-vertical {
|
||||
border-bottom: solid 1px;
|
||||
border-bottom-color: var(--ag-border-color);
|
||||
padding-top: var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-material .ag-column-drop-vertical.ag-last-column-drop,
|
||||
.ag-theme-material-dark .ag-column-drop-vertical.ag-last-column-drop,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-vertical.ag-last-column-drop {
|
||||
border-bottom: none;
|
||||
}
|
||||
.ag-theme-material .ag-column-drop-vertical-cell,
|
||||
.ag-theme-material-dark .ag-column-drop-vertical-cell,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-vertical-cell {
|
||||
margin-left: 0;
|
||||
}
|
||||
.ag-theme-material .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-material-dark .ag-column-drop-vertical-empty-message,
|
||||
.ag-theme-material-auto-dark .ag-column-drop-vertical-empty-message {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 600;
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-material .ag-ltr .ag-column-drop-vertical-empty-message, .ag-theme-material-dark .ag-ltr .ag-column-drop-vertical-empty-message, .ag-theme-material-auto-dark .ag-ltr .ag-column-drop-vertical-empty-message {
|
||||
padding-left: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
padding-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-material .ag-rtl .ag-column-drop-vertical-empty-message, .ag-theme-material-dark .ag-rtl .ag-column-drop-vertical-empty-message, .ag-theme-material-auto-dark .ag-rtl .ag-column-drop-vertical-empty-message {
|
||||
padding-right: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
|
||||
padding-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-material .ag-status-bar,
|
||||
.ag-theme-material-dark .ag-status-bar,
|
||||
.ag-theme-material-auto-dark .ag-status-bar {
|
||||
border: solid 1px;
|
||||
border-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material .ag-column-panel-column-select,
|
||||
.ag-theme-material-dark .ag-column-panel-column-select,
|
||||
.ag-theme-material-auto-dark .ag-column-panel-column-select {
|
||||
border-top: solid 1px;
|
||||
border-top-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material .ag-column-select,
|
||||
.ag-theme-material .ag-column-select-header,
|
||||
.ag-theme-material-dark .ag-column-select,
|
||||
.ag-theme-material-dark .ag-column-select-header,
|
||||
.ag-theme-material-auto-dark .ag-column-select,
|
||||
.ag-theme-material-auto-dark .ag-column-select-header {
|
||||
border-bottom: solid 1px;
|
||||
border-bottom-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material .ag-column-select-header,
|
||||
.ag-theme-material-dark .ag-column-select-header,
|
||||
.ag-theme-material-auto-dark .ag-column-select-header {
|
||||
height: var(--ag-header-height);
|
||||
}
|
||||
.ag-theme-material .ag-group-title-bar,
|
||||
.ag-theme-material-dark .ag-group-title-bar,
|
||||
.ag-theme-material-auto-dark .ag-group-title-bar {
|
||||
padding: calc(var(--ag-grid-size) * 0.75) var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-material .ag-charts-format-sub-level-group-title-bar,
|
||||
.ag-theme-material-dark .ag-charts-format-sub-level-group-title-bar,
|
||||
.ag-theme-material-auto-dark .ag-charts-format-sub-level-group-title-bar {
|
||||
padding: calc(var(--ag-grid-size) * 0.5) var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-material .ag-chart-data-section,
|
||||
.ag-theme-material .ag-chart-format-section,
|
||||
.ag-theme-material .ag-chart-advanced-settings-section,
|
||||
.ag-theme-material-dark .ag-chart-data-section,
|
||||
.ag-theme-material-dark .ag-chart-format-section,
|
||||
.ag-theme-material-dark .ag-chart-advanced-settings-section,
|
||||
.ag-theme-material-auto-dark .ag-chart-data-section,
|
||||
.ag-theme-material-auto-dark .ag-chart-format-section,
|
||||
.ag-theme-material-auto-dark .ag-chart-advanced-settings-section {
|
||||
padding-bottom: calc(var(--ag-grid-size) * 0.5);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]),
|
||||
.ag-theme-material input[class^=ag-][type=text],
|
||||
.ag-theme-material input[class^=ag-][type=number],
|
||||
.ag-theme-material input[class^=ag-][type=tel],
|
||||
.ag-theme-material input[class^=ag-][type=date],
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-material textarea[class^=ag-],
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]),
|
||||
.ag-theme-material-dark input[class^=ag-][type=text],
|
||||
.ag-theme-material-dark input[class^=ag-][type=number],
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel],
|
||||
.ag-theme-material-dark input[class^=ag-][type=date],
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-material-dark textarea[class^=ag-],
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text],
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number],
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel],
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date],
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local],
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-] {
|
||||
background: transparent;
|
||||
color: var(--ag-foreground-color);
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
padding-bottom: var(--ag-grid-size);
|
||||
border-width: 0;
|
||||
border-radius: 0;
|
||||
border-bottom: 2px solid;
|
||||
border-bottom-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]):not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=text]:not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=number]:not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=tel]:not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=date]:not(textarea),
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]:not(textarea),
|
||||
.ag-theme-material textarea[class^=ag-]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]):not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]:not(textarea),
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]:not(textarea),
|
||||
.ag-theme-material-dark textarea[class^=ag-]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]):not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]:not(textarea),
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]:not(textarea),
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]:not(textarea) {
|
||||
height: calc(var(--ag-grid-size) * 5);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]):focus,
|
||||
.ag-theme-material input[class^=ag-][type=text]:focus,
|
||||
.ag-theme-material input[class^=ag-][type=number]:focus,
|
||||
.ag-theme-material input[class^=ag-][type=tel]:focus,
|
||||
.ag-theme-material input[class^=ag-][type=date]:focus,
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]:focus,
|
||||
.ag-theme-material textarea[class^=ag-]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]):focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]:focus,
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]:focus,
|
||||
.ag-theme-material-dark textarea[class^=ag-]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]):focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]:focus,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]:focus,
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]:focus {
|
||||
border-bottom: 2px solid;
|
||||
border-bottom-color: var(--ag-material-primary-color);
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type])::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=text]::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=number]::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=tel]::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=date]::placeholder,
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]::placeholder,
|
||||
.ag-theme-material textarea[class^=ag-]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type])::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]::placeholder,
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]::placeholder,
|
||||
.ag-theme-material-dark textarea[class^=ag-]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type])::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]::placeholder,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]::placeholder,
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]::placeholder {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]):disabled,
|
||||
.ag-theme-material input[class^=ag-][type=text]:disabled,
|
||||
.ag-theme-material input[class^=ag-][type=number]:disabled,
|
||||
.ag-theme-material input[class^=ag-][type=tel]:disabled,
|
||||
.ag-theme-material input[class^=ag-][type=date]:disabled,
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]:disabled,
|
||||
.ag-theme-material textarea[class^=ag-]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]):disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]:disabled,
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]:disabled,
|
||||
.ag-theme-material-dark textarea[class^=ag-]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]):disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]:disabled,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]:disabled,
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]:disabled {
|
||||
border-bottom: 1px solid;
|
||||
border-bottom-color: var(--ag-border-color);
|
||||
}
|
||||
.ag-theme-material input[class^=ag-]:not([type]):invalid,
|
||||
.ag-theme-material input[class^=ag-][type=text]:invalid,
|
||||
.ag-theme-material input[class^=ag-][type=number]:invalid,
|
||||
.ag-theme-material input[class^=ag-][type=tel]:invalid,
|
||||
.ag-theme-material input[class^=ag-][type=date]:invalid,
|
||||
.ag-theme-material input[class^=ag-][type=datetime-local]:invalid,
|
||||
.ag-theme-material textarea[class^=ag-]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-]:not([type]):invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=text]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=number]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=tel]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=date]:invalid,
|
||||
.ag-theme-material-dark input[class^=ag-][type=datetime-local]:invalid,
|
||||
.ag-theme-material-dark textarea[class^=ag-]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-]:not([type]):invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=text]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=number]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=tel]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=date]:invalid,
|
||||
.ag-theme-material-auto-dark input[class^=ag-][type=datetime-local]:invalid,
|
||||
.ag-theme-material-auto-dark textarea[class^=ag-]:invalid {
|
||||
border-width: 0;
|
||||
border-bottom: 1px solid;
|
||||
border-bottom-color: var(--ag-invalid-color);
|
||||
color: var(--ag-invalid-color);
|
||||
}
|
||||
.ag-theme-material .ag-standard-button,
|
||||
.ag-theme-material-dark .ag-standard-button,
|
||||
.ag-theme-material-auto-dark .ag-standard-button {
|
||||
appearance: none;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
color: var(--ag-material-primary-color);
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.ag-theme-material .ag-standard-button:disabled,
|
||||
.ag-theme-material-dark .ag-standard-button:disabled,
|
||||
.ag-theme-material-auto-dark .ag-standard-button:disabled {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
background-color: var(--ag-input-disabled-background-color);
|
||||
border-color: var(--ag-input-disabled-border-color);
|
||||
}
|
||||
.ag-theme-material.ag-dnd-ghost,
|
||||
.ag-theme-material-dark.ag-dnd-ghost,
|
||||
.ag-theme-material-auto-dark.ag-dnd-ghost {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 600;
|
||||
}
|
||||
.ag-theme-material .ag-filter-toolpanel-header,
|
||||
.ag-theme-material-dark .ag-filter-toolpanel-header,
|
||||
.ag-theme-material-auto-dark .ag-filter-toolpanel-header {
|
||||
height: calc(var(--ag-grid-size) * 4);
|
||||
}
|
||||
.ag-theme-material .ag-filter-toolpanel-group-level-0-header,
|
||||
.ag-theme-material-dark .ag-filter-toolpanel-group-level-0-header,
|
||||
.ag-theme-material-auto-dark .ag-filter-toolpanel-group-level-0-header {
|
||||
height: calc(var(--ag-grid-size) * 7);
|
||||
}
|
||||
.ag-theme-material .ag-filter-card-title,
|
||||
.ag-theme-material-dark .ag-filter-card-title,
|
||||
.ag-theme-material-auto-dark .ag-filter-card-title {
|
||||
font-size: calc(var(--ag-font-size) - 1px);
|
||||
font-weight: 600;
|
||||
}
|
||||
.ag-theme-material .ag-filter-panel .ag-standard-button,
|
||||
.ag-theme-material-dark .ag-filter-panel .ag-standard-button,
|
||||
.ag-theme-material-auto-dark .ag-filter-panel .ag-standard-button {
|
||||
padding: var(--ag-grid-size);
|
||||
}
|
||||
.ag-theme-material .ag-filter-add-button,
|
||||
.ag-theme-material-dark .ag-filter-add-button,
|
||||
.ag-theme-material-auto-dark .ag-filter-add-button {
|
||||
border-bottom: 2px solid var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-filter-add-button .ag-icon,
|
||||
.ag-theme-material-dark .ag-filter-add-button .ag-icon,
|
||||
.ag-theme-material-auto-dark .ag-filter-add-button .ag-icon {
|
||||
color: var(--ag-material-active-color);
|
||||
}
|
||||
.ag-theme-material .ag-ltr .ag-filter-apply-panel-button, .ag-theme-material .ag-ltr .ag-advanced-filter-apply-button, .ag-theme-material .ag-ltr .ag-advanced-filter-builder-button, .ag-theme-material-dark .ag-ltr .ag-filter-apply-panel-button, .ag-theme-material-dark .ag-ltr .ag-advanced-filter-apply-button, .ag-theme-material-dark .ag-ltr .ag-advanced-filter-builder-button, .ag-theme-material-auto-dark .ag-ltr .ag-filter-apply-panel-button, .ag-theme-material-auto-dark .ag-ltr .ag-advanced-filter-apply-button, .ag-theme-material-auto-dark .ag-ltr .ag-advanced-filter-builder-button {
|
||||
margin-left: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-material .ag-rtl .ag-filter-apply-panel-button, .ag-theme-material .ag-rtl .ag-advanced-filter-apply-button, .ag-theme-material .ag-rtl .ag-advanced-filter-builder-button, .ag-theme-material-dark .ag-rtl .ag-filter-apply-panel-button, .ag-theme-material-dark .ag-rtl .ag-advanced-filter-apply-button, .ag-theme-material-dark .ag-rtl .ag-advanced-filter-builder-button, .ag-theme-material-auto-dark .ag-rtl .ag-filter-apply-panel-button, .ag-theme-material-auto-dark .ag-rtl .ag-advanced-filter-apply-button, .ag-theme-material-auto-dark .ag-rtl .ag-advanced-filter-builder-button {
|
||||
margin-right: var(--ag-grid-size);
|
||||
}
|
||||
|
||||
.ag-theme-material .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-material .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-material .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-material .ag-layout-print .ag-center-cols-container,
|
||||
.ag-theme-material-dark .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-material-dark .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-material-dark .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-material-dark .ag-layout-print .ag-center-cols-container,
|
||||
.ag-theme-material-auto-dark .ag-layout-auto-height .ag-center-cols-viewport,
|
||||
.ag-theme-material-auto-dark .ag-layout-auto-height .ag-center-cols-container,
|
||||
.ag-theme-material-auto-dark .ag-layout-print .ag-center-cols-viewport,
|
||||
.ag-theme-material-auto-dark .ag-layout-print .ag-center-cols-container {
|
||||
min-height: 150px;
|
||||
}
|
||||
.ag-theme-material .ag-picker-field-wrapper:focus-within,
|
||||
.ag-theme-material-dark .ag-picker-field-wrapper:focus-within,
|
||||
.ag-theme-material-auto-dark .ag-picker-field-wrapper:focus-within {
|
||||
box-shadow: 0 0 0 1px var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-rich-select-list,
|
||||
.ag-theme-material-dark .ag-rich-select-list,
|
||||
.ag-theme-material-auto-dark .ag-rich-select-list {
|
||||
box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;
|
||||
}
|
||||
.ag-theme-material .ag-advanced-filter-builder-button-label,
|
||||
.ag-theme-material-dark .ag-advanced-filter-builder-button-label,
|
||||
.ag-theme-material-auto-dark .ag-advanced-filter-builder-button-label {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.ag-theme-material .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-material-dark .ag-filter-active .ag-icon-filter,
|
||||
.ag-theme-material-auto-dark .ag-filter-active .ag-icon-filter {
|
||||
color: var(--ag-material-accent-color);
|
||||
}
|
||||
.ag-theme-material .ag-list-item-hovered::after,
|
||||
.ag-theme-material-dark .ag-list-item-hovered::after,
|
||||
.ag-theme-material-auto-dark .ag-list-item-hovered::after {
|
||||
background-color: var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-material-dark .ag-pill .ag-pill-button:hover,
|
||||
.ag-theme-material-auto-dark .ag-pill .ag-pill-button:hover {
|
||||
color: var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-header-highlight-before::after,
|
||||
.ag-theme-material .ag-header-highlight-after::after,
|
||||
.ag-theme-material-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-material-dark .ag-header-highlight-after::after,
|
||||
.ag-theme-material-auto-dark .ag-header-highlight-before::after,
|
||||
.ag-theme-material-auto-dark .ag-header-highlight-after::after {
|
||||
background-color: var(--ag-material-primary-color);
|
||||
}
|
||||
.ag-theme-material .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-material .ag-disabled .ag-icon,
|
||||
.ag-theme-material .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-material [disabled] .ag-icon,
|
||||
.ag-theme-material-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-material-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-material-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-material-dark [disabled] .ag-icon,
|
||||
.ag-theme-material-auto-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
|
||||
.ag-theme-material-auto-dark .ag-disabled .ag-icon,
|
||||
.ag-theme-material-auto-dark .ag-column-select-column-group-readonly .ag-icon,
|
||||
.ag-theme-material-auto-dark [disabled] .ag-icon {
|
||||
color: var(--ag-disabled-foreground-color);
|
||||
}
|
||||
+4
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user