github.com/cozy/cozy-stack@v0.0.0-20240603063001-31110fa4cae1/assets/styles/cirrus.css (about)

     1  /* Buttons */
     2  .btn .icon {
     3    vertical-align: middle;
     4  }
     5  .btn-done {
     6    background-color: var(--successColorLightest) !important;
     7    opacity: 1 !important;
     8    transition: none;
     9  }
    10  
    11  /* Icons */
    12  .icon-alert {
    13    -webkit-mask-image: url(../icons/alert.svg);
    14    mask-image: url(../icons/alert.svg);
    15  }
    16  .icon-answer {
    17    -webkit-mask: url(../icons/answer.svg) space no-repeat bottom;
    18    mask: url(../icons/answer.svg) space no-repeat bottom;
    19    width: 0.813rem;
    20  }
    21  .icon-auth {
    22    -webkit-mask-image: url(../icons/auth.svg);
    23    mask-image: url(../icons/auth.svg);
    24  }
    25  .icon-back {
    26    -webkit-mask-image: url(../icons/back.svg);
    27    mask-image: url(../icons/back.svg);
    28  }
    29  .icon-check {
    30    -webkit-mask-image: url(../icons/check.svg);
    31    mask-image: url(../icons/check.svg);
    32  }
    33  .icon-check-circle {
    34    -webkit-mask-image: url(../icons/check-circle.svg);
    35    mask-image: url(../icons/check-circle.svg);
    36  }
    37  .icon-cross {
    38    -webkit-mask-image: url(../icons/cross.svg);
    39    mask-image: url(../icons/cross.svg);
    40  }
    41  .icon-eye-closed {
    42    -webkit-mask-image: url(../icons/eye-closed.svg);
    43    mask-image: url(../icons/eye-closed.svg);
    44  }
    45  .icon-eye-opened {
    46    -webkit-mask-image: url(../icons/eye-opened.svg);
    47    mask-image: url(../icons/eye-opened.svg);
    48  }
    49  .icon-import {
    50    -webkit-mask-image: url(../icons/import.svg);
    51    mask-image: url(../icons/import.svg);
    52  }
    53  .icon-info {
    54    -webkit-mask-image: url(../icons/info.svg);
    55    mask-image: url(../icons/info.svg);
    56  }
    57  .icon-permissions {
    58    -webkit-mask-image: url(../icons/permissions.svg);
    59    mask-image: url(../icons/permissions.svg);
    60  }
    61  .icon-right {
    62    -webkit-mask-image: url(../icons/arrow-right.svg);
    63    mask-image: url(../icons/arrow-right.svg);
    64  }
    65  
    66  /* Icons for files on the authorize sharing page */
    67  .filetype {
    68    flex-shrink: 0;
    69    width: 2rem;
    70    height: 2rem;
    71  }
    72  .filetype-other {
    73    background-image: url("../images/icon-files.svg");
    74  }
    75  .filetype-audio {
    76    background-image: url("../images/filetypes/audio.svg");
    77  }
    78  .filetype-bin {
    79    background-image: url("../images/filetypes/bin.svg");
    80  }
    81  .filetype-code {
    82    background-image: url("../images/filetypes/code.svg");
    83  }
    84  .filetype-files {
    85    background-image: url("../images/filetypes/files.svg");
    86  }
    87  .filetype-image {
    88    background-image: url("../images/filetypes/image.svg");
    89  }
    90  .filetype-note {
    91    background-image: url("../images/filetypes/note.svg");
    92  }
    93  .filetype-pdf {
    94    background-image: url("../images/filetypes/pdf.svg");
    95  }
    96  .filetype-sheet {
    97    background-image: url("../images/filetypes/sheet.svg");
    98  }
    99  .filetype-slide {
   100    background-image: url("../images/filetypes/slide.svg");
   101  }
   102  .filetype-text {
   103    background-image: url("../images/filetypes/text.svg");
   104  }
   105  .filetype-video {
   106    background-image: url("../images/filetypes/video.svg");
   107  }
   108  .filetype-zip {
   109    background-image: url("../images/filetypes/zip.svg");
   110  }
   111  .filetype-organization {
   112    background-image: url("../icons/doctypes/organization.svg");
   113    background-size: contain;
   114    background-repeat: no-repeat;
   115  }
   116  
   117  /* Password strength on onboarding and password renew */
   118  .progress {
   119    position: relative;
   120    z-index: 10;
   121    width: 100%;
   122    height: 0.3rem;
   123    bottom: 0.3rem;
   124    left: 1px;
   125    background: var(--dividerColor);
   126    border-top: 0;
   127    border-radius: 0 0 0.2rem 0.2rem;
   128  }
   129  .progress-bar {
   130    background: var(--infoColor);
   131    border-radius: 0 0 0.2rem 0;
   132  }
   133  .progress-bar.w-100 {
   134    border-radius: 0 0 0.2rem 0.2rem;
   135  }
   136  .progress-bar.pass-weak {
   137    background: var(--errorColorLightest);
   138  }
   139  .progress-bar.pass-moderate {
   140    background: var(--warningColorLightest);
   141  }
   142  .progress-bar.pass-strong {
   143    background: var(--successColorLightest);
   144  }
   145  .w-0 {
   146    width: 0%;
   147  }
   148  .w-4 {
   149    width: 4%;
   150  }
   151  .w-8 {
   152    width: 8%;
   153  }
   154  .w-12 {
   155    width: 12%;
   156  }
   157  .w-16 {
   158    width: 16%;
   159  }
   160  .w-20 {
   161    width: 20%;
   162  }
   163  .w-24 {
   164    width: 24%;
   165  }
   166  .w-28 {
   167    width: 28%;
   168  }
   169  .w-32 {
   170    width: 32%;
   171  }
   172  .w-36 {
   173    width: 36%;
   174  }
   175  .w-40 {
   176    width: 40%;
   177  }
   178  .w-44 {
   179    width: 44%;
   180  }
   181  .w-48 {
   182    width: 48%;
   183  }
   184  .w-52 {
   185    width: 52%;
   186  }
   187  .w-56 {
   188    width: 56%;
   189  }
   190  .w-60 {
   191    width: 60%;
   192  }
   193  .w-64 {
   194    width: 64%;
   195  }
   196  .w-68 {
   197    width: 68%;
   198  }
   199  .w-72 {
   200    width: 72%;
   201  }
   202  .w-76 {
   203    width: 76%;
   204  }
   205  .w-80 {
   206    width: 80%;
   207  }
   208  .w-84 {
   209    width: 84%;
   210  }
   211  .w-88 {
   212    width: 88%;
   213  }
   214  .w-92 {
   215    width: 92%;
   216  }
   217  .w-96 {
   218    width: 96%;
   219  }
   220  
   221  /* Permissions list on the OAuth authorize page */
   222  .authorize-pill {
   223    display: inline-flex;
   224    flex-direction: row;
   225    align-items: center;
   226    padding: 0.25rem 0.75rem;
   227  }
   228  .permissions-list {
   229    padding: 0;
   230    list-style: none;
   231  }
   232  .permissions-list li {
   233    display: flex;
   234    flex-direction: row;
   235    align-items: center;
   236  }
   237  .permissions-list li .small {
   238    display: flex;
   239    align-items: center;
   240    flex-grow: 1;
   241    padding: 1rem 1rem 1rem 0;
   242  }
   243  .permissions-list li + li .small {
   244    border-top: solid 1px var(--dividerColor);
   245  }
   246  .permissions-list li .halo-icon {
   247    margin-left: 1rem;
   248    margin-right: 1rem;
   249  }
   250  @media (min-width: 768px) {
   251    .permissions-list li .rounded-circle {
   252      margin-left: 4rem;
   253    }
   254  }
   255  .permissions-list li .perm {
   256    -webkit-mask-position: center;
   257    -webkit-mask-size: 1rem;
   258    -webkit-mask-repeat: no-repeat;
   259    mask-position: center;
   260    mask-size: 1rem;
   261    mask-repeat: no-repeat;
   262  }
   263  .perm {
   264    -webkit-mask-image: url("../icons/doctypes/fallback.svg");
   265    mask-image: url("../icons/doctypes/fallback.svg");
   266  }
   267  .perm[class^="\* "] {
   268    -webkit-mask-image: url("../icons/doctypes/cozy-smile.svg");
   269    mask-image: url("../icons/doctypes/cozy-smile.svg");
   270  }
   271  .perm[class^="com-bitwarden-ciphers"],
   272  .perm[class^="com-bitwarden-folders"],
   273  .perm[class^="com-bitwarden-profiles"],
   274  .perm[class^="io-cozy-permissions"] {
   275    -webkit-mask-image: url("../icons/doctypes/lock.svg");
   276    mask-image: url("../icons/doctypes/lock.svg");
   277  }
   278  .perm[class^="com-bitwarden-organizations"] {
   279    -webkit-mask-image: url("../icons/doctypes/organization.svg");
   280    mask-image: url("../icons/doctypes/organization.svg");
   281  }
   282  .perm[class^="cc-cozycloud-dacc"],
   283  .perm[class^="cc-cozycloud-dacc-dev"],
   284  .perm[class^="cc-cozycloud-dacc_v2"],
   285  .perm[class^="cc-cozycloud-dacc-dev_v2"],
   286  .perm[class^="eu.mycozy.dacc_v2"] {
   287    -webkit-mask-image: url("../icons/doctypes/stats.svg");
   288    mask-image: url("../icons/doctypes/stats.svg");
   289  }
   290  .perm[class^="io-cozy-settings"],
   291  .perm[class^="io-cozy-bank-settings"] {
   292    -webkit-mask-image: url("../icons/doctypes/cog.svg");
   293    mask-image: url("../icons/doctypes/cog.svg");
   294  }
   295  .perm[class^="io-cozy-coachco2-settings"] {
   296    -webkit-mask-image: url("../icons/doctypes/cog.svg");
   297    mask-image: url("../icons/doctypes/cog.svg");
   298  }
   299  .perm[class^="io-cozy-tags"] {
   300    -webkit-mask-image: url("../icons/doctypes/tags.svg");
   301    mask-image: url("../icons/doctypes/tags.svg");
   302  }
   303  .perm[class^="io-cozy-accounts"],
   304  .perm[class^="io-cozy-accounts-stats"] {
   305    -webkit-mask-image: url("../icons/doctypes/shield.svg");
   306    mask-image: url("../icons/doctypes/shield.svg");
   307  }
   308  .perm[class^="io-cozy-apps"],
   309  .perm[class^="io-cozy-apps-suggestions"] {
   310    -webkit-mask-image: url("../icons/doctypes/grid.svg");
   311    mask-image: url("../icons/doctypes/grid.svg");
   312  }
   313  .perm[class^="io-cozy-bank-accounts"] {
   314    -webkit-mask-image: url("../icons/doctypes/wallet.svg");
   315    mask-image: url("../icons/doctypes/wallet.svg");
   316  }
   317  .perm[class^="io-cozy-bank-groups"] {
   318    -webkit-mask-image: url("../icons/doctypes/banking.svg");
   319    mask-image: url("../icons/doctypes/banking.svg");
   320  }
   321  .perm[class^="io-cozy-bank-operations"] {
   322    -webkit-mask-image: url("../icons/doctypes/euro.svg");
   323    mask-image: url("../icons/doctypes/euro.svg");
   324  }
   325  .perm[class^="io-cozy-contacts"],
   326  .perm[class^="io-cozy-identities"],
   327  .perm[class^="io-cozy-bank-recipients"] {
   328    -webkit-mask-image: url("../icons/doctypes/profile.svg");
   329    mask-image: url("../icons/doctypes/profile.svg");
   330  }
   331  .perm[class^="io-cozy-contacts-groups"] {
   332    -webkit-mask-image: url("../icons/doctypes/team.svg");
   333    mask-image: url("../icons/doctypes/team.svg");
   334  }
   335  .perm[class^="io-cozy-bank-recurrence"] {
   336    -webkit-mask-image: url("../icons/doctypes/timer.svg");
   337    mask-image: url("../icons/doctypes/timer.svg");
   338  }
   339  .perm[class^="io-cozy-bills"] {
   340    -webkit-mask-image: url("../icons/doctypes/bill.svg");
   341    mask-image: url("../icons/doctypes/bill.svg");
   342  }
   343  .perm[class^="cc-cozycloud-sentry"],
   344  .perm[class^="cc-cozycloud-errors"],
   345  .perm[class^="io-cozy-files"] {
   346    -webkit-mask-image: url("../icons/doctypes/file.svg");
   347    mask-image: url("../icons/doctypes/file.svg");
   348  }
   349  .perm[class^="io-cozy-files-versions"] {
   350    -webkit-mask-image: url("../icons/doctypes/history.svg");
   351    mask-image: url("../icons/doctypes/history.svg");
   352  }
   353  .perm[class^="io-cozy-certified-carbon_copy"] {
   354    -webkit-mask-image: url("../images/icon-certified.svg");
   355    mask-image: url("../images/icon-certified.svg");
   356  }
   357  .perm[class^="io-cozy-certified-electronic_safe"] {
   358    -webkit-mask-image: url("../images/icon-safe.svg");
   359    mask-image: url("../images/icon-safe.svg");
   360  }
   361  .perm[class^="io-cozy-home-settings"] {
   362    -webkit-mask-image: url("../icons/doctypes/cog.svg");
   363    mask-image: url("../icons/doctypes/cog.svg");
   364  }
   365  .perm[class^="io-cozy-konnectors"] {
   366    -webkit-mask-image: url("../icons/doctypes/sync-cozy.svg");
   367    mask-image: url("../icons/doctypes/sync-cozy.svg");
   368  }
   369  .perm[class^="io-cozy-notifications"] {
   370    -webkit-mask-image: url("../icons/doctypes/bell.svg");
   371    mask-image: url("../icons/doctypes/bell.svg");
   372  }
   373  .perm[class^="io-cozy-photos-albums"] {
   374    -webkit-mask-image: url("../icons/doctypes/picture.svg");
   375    mask-image: url("../icons/doctypes/picture.svg");
   376  }
   377  .perm[class^="io-cozy-timeseries-geojson"] {
   378    -webkit-mask-image: url("../icons/doctypes/location.svg");
   379    mask-image: url("../icons/doctypes/location.svg");
   380  }
   381  .perm[class^="io-cozy-jobs"] {
   382    -webkit-mask-image: url("../icons/doctypes/email.svg");
   383    mask-image: url("../icons/doctypes/email.svg");
   384  }
   385  .perm[class^="io-cozy-triggers"] {
   386    -webkit-mask-image: url("../icons/doctypes/clock.svg");
   387    mask-image: url("../icons/doctypes/clock.svg");
   388  }
   389  .perm[class^="io-cozy-sharings"] {
   390    -webkit-mask-image: url("../icons/doctypes/share.svg");
   391    mask-image: url("../icons/doctypes/share.svg");
   392  }
   393  .perm[class^="io-cozy-oauth-clients"] {
   394    -webkit-mask-image: url("../icons/doctypes/devices.svg");
   395    mask-image: url("../icons/doctypes/devices.svg");
   396  }
   397  
   398  /* Others */
   399  .halo-icon {
   400    flex: 2rem 0 0;
   401    width: 2rem;
   402    height: 2rem;
   403    padding: 0.5rem;
   404    background-color: var(--primaryColor);
   405    border-radius: 50%;
   406  }
   407  .halo-icon .icon {
   408    background-color: var(--primaryTextContrastColor);
   409  }
   410  button.alert-info:hover {
   411    background-color: var(--btn-ghost-hover-color);
   412  }
   413  button.card-intent:hover {
   414    background-color: var(--errorColorLightest);
   415  }
   416  .big.illustration {
   417    height: 8rem;
   418  }
   419  .greyed-extension {
   420    opacity: 0.6;
   421  }
   422  .compat .vertical-separator {
   423    height: 2rem;
   424  }
   425  .expand {
   426    display: inline-flex;
   427  }
   428  .expand .icon {
   429    transition: transform 0.2s;
   430  }
   431  .expanded .icon {
   432    transform: rotate(90deg);
   433  }
   434  :not(.expanded) + .collapse {
   435    display: none;
   436  }
   437  .modal-icon .icon-cozy {
   438    background: url(../icons/cozy-app-square.svg);
   439  }